hextra/exampleSite/content/docs/guide/configuration.ja.md
Xin b8f617f1b0 docs(i18n): add ja translation
- translated via llm
2024-12-31 01:01:56 +00:00

9.6 KiB

title weight
設定 2

Hugoは、Hugoサイトのルートにあるhugo.yamlから設定を読み取ります。 この設定ファイルでは、サイトのすべての側面を設定できます。 利用可能な設定とベストプラクティスの包括的な理解を得るために、GitHub上のこのサイトの設定ファイルexampleSite/hugo.yamlをチェックしてください。

ナビゲーション

メニュー

右上のメニューは、設定ファイルのmenu.mainセクションで定義されます:

menu:
  main:
    - name: ドキュメント
      pageRef: /docs
      weight: 1
    - name: ブログ
      pageRef: /blog
      weight: 2
    - name: について
      pageRef: /about
      weight: 3
    - name: 検索
      weight: 4
      params:
        type: search
    - name: GitHub
      weight: 5
      url: "https://github.com/imfing/hextra"
      params:
        icon: github

メニュー項目にはさまざまなタイプがあります:

  1. pageRefを使用してサイト内のページにリンク
    - name: ドキュメント
      pageRef: /docs
    
  2. urlを使用して外部URLにリンク
    - name: GitHub
      url: "https://github.com"
    
  3. type: searchを使用して検索バーを表示
    - name: 検索
      params:
        type: search
    
  4. アイコン
    - name: GitHub
      params:
        icon: github
    

これらのメニュー項目は、weightパラメータを設定して並べ替えることができます。

ロゴとタイトル

デフォルトのロゴを変更するには、hugo.yamlを編集し、staticディレクトリ下のロゴファイルへのパスを追加します。 オプションで、ロゴをクリックしたときにユーザーがリダイレクトされるリンクや、ロゴの幅と高さをピクセル単位で設定できます。

params:
  navbar:
    displayTitle: true
    displayLogo: true
    logo:
      path: images/logo.svg
      dark: images/logo-dark.svg
      link: /
      width: 40
      height: 20

サイドバー

メインサイドバー

メインサイドバーは、コンテンツディレクトリの構造から自動的に生成されます。 詳細については、ファイルの整理ページを参照してください。

左サイドバーから単一のページを除外するには、ページのフロントマターでsidebar.excludeパラメータを設定します:

---
title: 設定
sidebar:
  exclude: true
---

追加リンク

サイドバーの追加リンクは、設定ファイルのmenu.sidebarセクションで定義されます:

menu:
  sidebar:
    - name: その他
      params:
        type: separator
      weight: 1
    - name: "について"
      pageRef: "/about"
      weight: 2
    - name: "Hugo Docs ↗"
      url: "https://gohugo.io/documentation/"
      weight: 3

右サイドバー

目次

目次は、コンテンツファイルの見出しから自動的に生成されます。ページのフロントマターでtoc: falseを設定することで無効にできます。

---
title: 設定
toc: false
---

ページ編集リンク

ページ編集リンクを設定するには、設定ファイルでparams.editURL.baseパラメータを設定します:

params:
  editURL:
    enable: true
    base: "https://github.com/your-username/your-repo/edit/main"

提供されたURLをルートディレクトリとして、各ページの編集リンクが自動的に生成されます。 特定のページの編集リンクを設定したい場合は、ページのフロントマターでeditURLパラメータを設定します:

---
title: 設定
editURL: "https://example.com/edit/this/page"
---

フッター

著作権

ウェブサイトのフッターに表示される著作権テキストを変更するには、i18n/en.yamlという名前のファイルを作成します。 このファイルに、以下のように新しい著作権テキストを指定します:

copyright: "© 2024 YOUR TEXT HERE"

参考として、GitHubリポジトリにi18n/en.yamlファイルの例があります。また、著作権テキストにMarkdown形式を使用することもできます。

その他

ファビコン

サイトのファビコンをカスタマイズするには、staticフォルダ下にアイコンファイルを配置して、テーマのデフォルトのファビコンを上書きします:

{{< filetree/container >}} {{< filetree/folder name="static" >}} {{< filetree/file name="android-chrome-192x192.png" >}} {{< filetree/file name="android-chrome-512x512.png" >}} {{< filetree/file name="apple-touch-icon.png" >}} {{< filetree/file name="favicon-16x16.png" >}} {{< filetree/file name="favicon-32x32.png" >}} {{< filetree/file name="favicon-dark.svg" >}} {{< filetree/file name="favicon.ico" >}} {{< filetree/file name="favicon.svg" >}} {{< filetree/file name="site.webmanifest" >}} {{< /filetree/folder >}} {{< /filetree/container >}}

プロジェクトにfavicon.icofavicon.svgfavicon-dark.svgファイルを含めて、サイトのファビコンが正しく表示されるようにします。

favicon.icoは一般的に古いブラウザ用ですが、favicon.svgfavicon-dark.svgは現代のブラウザでサポートされています。 favicon.iofavyconなどのツールを使用して、このようなアイコンを生成できます。

テーマ設定

theme設定を使用して、デフォルトのテーマモードとトグルボタンを設定し、訪問者がライトモードとダークモードを切り替えられるようにします。

params:
  theme:
    # light | dark | system
    default: system
    displayToggle: true

theme.defaultのオプション:

  • light - 常にライトモードを使用
  • dark - 常にダークモードを使用
  • system - オペレーティングシステムの設定と同期(デフォルト)

theme.displayToggleパラメータを使用して、テーマを変更するためのトグルボタンを表示できます。 trueに設定すると、訪問者はデフォルト設定を上書きしてライトモードとダークモードを切り替えることができます。

ページ幅

ページの幅は、設定ファイルのparams.page.widthパラメータでカスタマイズできます:

params:
  page:
    # full (100%), wide (90rem), normal (1280px)
    width: wide

利用可能なオプションはfullwidenormalです。デフォルトでは、ページ幅はnormalに設定されています。

同様に、ナビゲーションバーとフッターの幅は、params.navbar.widthparams.footer.widthパラメータでカスタマイズできます。

検索インデックス

FlexSearchによる全文検索はデフォルトで有効です。 検索インデックスをカスタマイズするには、設定ファイルでparams.search.flexsearch.indexパラメータを設定します:

params:
  # 検索
  search:
    enable: true
    type: flexsearch

    flexsearch:
      # ページをインデックスする方法: content | summary | heading | title
      index: content

flexsearch.indexのオプション:

  • content - ページの全内容(デフォルト)
  • summary - ページの要約、詳細はHugoコンテンツ要約を参照
  • heading - レベル1とレベル2の見出し
  • title - ページタイトルのみを含める

検索トークン化をカスタマイズするには、設定ファイルでparams.search.flexsearch.tokenizeパラメータを設定します:

params:
    # ...
    flexsearch:
      # full | forward | reverse | strict 
      tokenize: forward

flexsearch.tokenizeのオプション:

  • strict - 単語全体をインデックス
  • forward - 前方方向に単語を増分的にインデックス
  • reverse - 両方向に単語を増分的にインデックス
  • full - すべての可能な組み合わせをインデックス

検索インデックスからページを除外するには、ページのフロントマターでexcludeSearch: trueを設定します:

---
title: 設定
excludeSearch: true
---

Googleアナリティクス

Googleアナリティクスを有効にするには、hugo.yamlservices.googleAnalytics.IDフラグを設定します:

services:
  googleAnalytics:
    ID: G-MEASUREMENT_ID