コンテンツにスキップ

MkDocs

requirements.txt

requirements.txt
mkdocs
mkdocs-material
mkdocs-git-authors-plugin
mkdocs-git-revision-date-localized-plugin
mkdocs-video
mkdocs-jupyter
pip install -r requirements.txt

コマンド

$ mkdocs [COMMAND]
mkdocs.yml
プロジェクトファイル
COMMAND
build ビルド
gh-deploy GitHub Pagesにデプロイ
new 新規MkDocs projectを作成
serve 開発用サーバのホスティング
Option
-V --version バージョン確認
-q --quiet エラー省略
-v --verbose 詳細出力
-h --help ヘルプ

build

mkdocs build

serve

mkdocs serve

dirtyreload

更新されたページのみビルドするlivereload

mkdocs serve --dirtyreload

記法

注意点

tab

リスト等で使用するタブ文字は2だと認識されないので4にする


mkdocs.yml
# Site info
site_name: ymtr.
site_description: Public note
docs_dir: 'docs'
copyright:  yamatora'

# # Repo info
# repo_url: https://github.com/yamatora/doc
# repo_name: doc

# Theme
theme:
  name: material
  font: # https://fonts.google.com/ のものを利用可能
      text: Zen Maru Gothic
      code: Roboto Mono
  language: ja
  icon:
    logo: material/broadcast
    # repo: fontawesome/brands/git-alt
  feature:
    tabs: true
  features:
    - navigation.instant
    - navigation.expand
    - navigation.tracking
    - navigation.top
    - navigation.tabs
    # - navigation.sections
    - navigation.indexes
    - content.code.copy
  custom_dir: 'theme'
  palette:
    - scheme: slate
      primary: black
      accent: gray

# Plugins
plugins:
  - offline
  - search
  - git-revision-date-localized:  # 最終更新日表示
      enabled: true
      enable_creation_date: true  # 作成日
      exclude:  # 無視するファイル
        - index.md
        - tags.md
      locale: en
      fallback_to_build_date: true
  - mkdocs-video:  # 動画再生
      video_autoplay: True
  - tags:
      tags_file: index.md
  # - blog:
  #     blog_dir: LOG
  #     blog_toc: true
  #     post_date_format: full
  #     archive_toc: true
  #     categories_toc: true
  #     draft_if_future_date: true
  # - social:       # require Image processing environment
  #   enabled: !ENV [CI, false]

# Extra
extra:
  search:
    language: 'en'
  social:
    # https://fontawesome.com/  同形式で指定
    - icon: fontawesome/brands/twitter
      link: https://twitter.com/_yamatora
    - icon: fontawesome/solid/cloud
      link: https://bsky.app/profile/ymtr.jp
    - icon: fontawesome/brands/mastodon
      link: https://mstdn.jp/@ymtr
    - icon: fontawesome/brands/discord
      link: https://discordapp.com/users/433977907933872129
    - icon: fontawesome/brands/instagram
      link: https://www.instagram.com/ymtr.jp/
    - icon: fontawesome/brands/github
      link: https://github.com/yamatora
  generator: false

# Extra CSS
extra_css:
    # - "https://fonts.googleapis.com/earlyaccess/notosansjp.css"
    # - "https://fonts.googleapis.com/css?family=Open+Sans:600,800"
    - "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"
    - "css/custom.css"
    - "css/scheme.css"

# Extra Javascript
extra_javascript: 
  # - http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML
  - https://polyfill.io/v3/polyfill.min.js?features=es6
  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js

# Markdown Extensions
markdown_extensions:
  - admonition            # 警告の有効化
  - pymdownx.details      # 
  - pymdownx.superfences
  - pymdownx.tabbed:
      alternate_style: true
  - pymdownx.arithmatex:  # 数式
      generic: true
  - pymdownx.tilde        # 打消し線の有効化
  - attr_list             # リンクのボタン化
  - tables                # 明示的な宣言
  - pymdownx.superfences: # mermaidによるダイアグラム
      custom_fences:
        - name: mermaid
          class: mermaid
          format: !!python/name:pymdownx.superfences.fence_code_format
  - footnotes
  - def_list
  - pymdownx.tasklist:
      custom_checkbox: true

# # Navigation
# nav:
#   - HOME: index.md
#   - Algorithm:
#     - Algorithm/polygon.md
#   - Document: 
#     - Document/index.md
#   - LOG:
#     - LOG/index.md
#   - Tags: tags.md

最終更新日: August 14, 2023
作成日: August 14, 2023