テーマしたい(theme

theme:
  name: mkdocs  # or readthedocs
  language: ja

mkdocs.ymltheme セクションでドキュメントサイトの外観を設定できます。

標準テーマしたい(mkdocs

theme:
  name: mkdocs

mkdocsはデフォルトのテーマ名です。 Bootstrapをベースにした設計で、MkDocsのほぼすべての機能をサポートしています。シンプルで軽量なテーマです。

Read The Docsしたい(readthedocs

theme:
  name: readthedocs

readthedocsはRead the Docsサイトのデフォルトテーマと同じデザインです。 サイドバーナビゲーションが特徴で、より限定的な機能セットです。

言語を設定したい

theme:
  name: mkdocs
  language: ja

language キーで表示言語を指定できます。 jaで日本語、enで英語、その他17以上の言語に対応しています。

パレットしたい

theme:
  name: mkdocs
  palette:
    color_mode: light  # light, dark, auto
    user_color_mode_toggle: true
    nav_style: primary  # primary, dark, light

theme.paletteセクションで、サイト全体の色を設定できます。 設定できる項目はテーマによって異なります。

paletteの標準オプション:

  • color_mode: カラーモード(lightdarkauto

  • user_color_mode_toggle: ユーザーがカラーモードを切り替え可能にする(デフォルト: false)

  • nav_style: ナビゲーションバーのスタイル(primarydarklight

features(機能)を有効にしたい

mkdocs テーマで利用可能な機能

theme:
  name: mkdocs
  features:
    - code.highlight.js
    - search.suggest
    - search.share

標準で利用可能な機能:

  • code.highlight.js - highlight.jsによるソースコードのシンタックスハイライト

  • search.suggest - 検索候補の表示

  • search.share - 検索結果の共有機能

  • nav.instant - ページ遷移時のプリロード(読み込み速度向上)

  • toc.integrate - 目次をサイドバーに統合

フォントを設定したい(theme.font

theme:
  name: mkdocs
  font:
    text: Noto Sans JP
    code: Source Code Pro

theme.fontセクションで表示フォントを指定できます。 指定したフォントがインストールされていることが前提です。

ナビゲーション深さを設定したい(theme.nav_depth

theme:
  name: mkdocs
  nav_depth: 3  # デフォルト: 2

theme.nav_depthでナビゲーションで表示する見出しの深さを設定できます。 mkdocsは最大2レベル、 readthedocsは最大4レベルです。

リファレンス