forked from drowl87/hextra_mirror
docs(i18n): add ja translation
- translated via llm
This commit is contained in:
16
exampleSite/content/docs/advanced/_index.ja.md
Normal file
16
exampleSite/content/docs/advanced/_index.ja.md
Normal file
@ -0,0 +1,16 @@
|
||||
---
|
||||
linkTitle: 上級者向け
|
||||
title: 上級者向けトピック
|
||||
prev: /docs/guide/shortcodes/tabs
|
||||
next: /docs/advanced/multi-language
|
||||
---
|
||||
|
||||
このセクションでは、テーマの上級者向けトピックをカバーします。
|
||||
|
||||
<!--more-->
|
||||
|
||||
{{< cards >}}
|
||||
{{< card link="multi-language" title="多言語対応" icon="translate" >}}
|
||||
{{< card link="customization" title="カスタマイズ" icon="pencil" >}}
|
||||
{{< card link="comments" title="コメントシステム" icon="chat-alt" >}}
|
||||
{{< /cards >}}
|
39
exampleSite/content/docs/advanced/comments.ja.md
Normal file
39
exampleSite/content/docs/advanced/comments.ja.md
Normal file
@ -0,0 +1,39 @@
|
||||
---
|
||||
title: コメントシステム
|
||||
linkTitle: コメント
|
||||
---
|
||||
|
||||
Hextraは、サイトにコメントシステムを追加することをサポートしています。
|
||||
現在、[giscus](https://giscus.app/)がサポートされています。
|
||||
|
||||
<!--more-->
|
||||
|
||||
## giscus
|
||||
|
||||
[giscus](https://giscus.app/)は、[GitHub Discussions](https://docs.github.com/ja/discussions)を利用したコメントシステムです。無料でオープンソースです。
|
||||
|
||||
giscusを有効にするには、サイトの設定ファイルに以下を追加する必要があります:
|
||||
|
||||
```yaml {filename="hugo.yaml"}
|
||||
params:
|
||||
comments:
|
||||
enable: false
|
||||
type: giscus
|
||||
|
||||
giscus:
|
||||
repo: <リポジトリ>
|
||||
repoId: <リポジトリID>
|
||||
category: <カテゴリ>
|
||||
categoryId: <カテゴリID>
|
||||
```
|
||||
|
||||
giscusの設定は、[giscus.app](https://giscus.app/)のウェブサイトから構築できます。詳細もそこで確認できます。
|
||||
|
||||
特定のページでコメントを有効または無効にするには、ページのフロントマターに以下を追加します:
|
||||
|
||||
```yaml {filename="content/docs/about.md"}
|
||||
---
|
||||
title: について
|
||||
comments: true
|
||||
---
|
||||
```
|
211
exampleSite/content/docs/advanced/customization.ja.md
Normal file
211
exampleSite/content/docs/advanced/customization.ja.md
Normal file
@ -0,0 +1,211 @@
|
||||
---
|
||||
title: Hextraのカスタマイズ
|
||||
linkTitle: カスタマイズ
|
||||
---
|
||||
|
||||
Hextraは、`hugo.yaml`設定ファイル内でいくつかのデフォルトのカスタマイズオプションを提供し、テーマを設定できます。
|
||||
このページでは、利用可能なオプションと、テーマをさらにカスタマイズする方法について説明します。
|
||||
|
||||
<!--more-->
|
||||
|
||||
## カスタムCSS
|
||||
|
||||
カスタムCSSを追加するには、サイト内に`assets/css/custom.css`ファイルを作成する必要があります。Hextraはこのファイルを自動的に読み込みます。
|
||||
|
||||
### フォントファミリー
|
||||
|
||||
コンテンツのフォントファミリーは、以下のようにカスタマイズできます:
|
||||
|
||||
```css {filename="assets/css/custom.css"}
|
||||
.content {
|
||||
font-family: "Times New Roman", Times, serif;
|
||||
}
|
||||
```
|
||||
|
||||
### インラインコード要素
|
||||
|
||||
`other text`と混在するテキストの色は、以下のようにカスタマイズできます:
|
||||
|
||||
```css {filename="assets/css/custom.css"}
|
||||
.content code:not(.code-block code) {
|
||||
color: #c97c2e;
|
||||
}
|
||||
```
|
||||
|
||||
### プライマリカラー
|
||||
|
||||
テーマのプライマリカラーは、`--primary-hue`、`--primary-saturation`、`--primary-lightness`変数を設定することでカスタマイズできます:
|
||||
|
||||
```css {filename="assets/css/custom.css"}
|
||||
:root {
|
||||
--primary-hue: 100deg;
|
||||
--primary-saturation: 90%;
|
||||
--primary-lightness: 50%;
|
||||
}
|
||||
```
|
||||
|
||||
### テーマのさらなるカスタマイズ
|
||||
|
||||
テーマは、公開されているCSSクラスを介してデフォルトのスタイルをオーバーライドすることでさらにカスタマイズできます。フッター要素をカスタマイズする例:
|
||||
|
||||
```css {filename="assets/css/custom.css"}
|
||||
.hextra-footer {
|
||||
/* フッター要素に適用されるスタイル */
|
||||
}
|
||||
|
||||
.hextra-footer:is(html[class~="dark"] *) {
|
||||
/* ダークモードでのフッター要素に適用されるスタイル */
|
||||
}
|
||||
```
|
||||
|
||||
以下のクラスを使用して、テーマのさまざまな部分をカスタマイズできます。
|
||||
|
||||
#### 一般
|
||||
|
||||
- `hextra-scrollbar` - スクロールバー要素
|
||||
- `content` - ページコンテンツコンテナ
|
||||
|
||||
#### ショートコード
|
||||
|
||||
##### バッジ
|
||||
|
||||
- `hextra-badge` - バッジ要素
|
||||
|
||||
##### カード
|
||||
|
||||
- `hextra-card` - カード要素
|
||||
- `hextra-card-image` - カード画像要素
|
||||
- `hextra-card-icon` - カードアイコン要素
|
||||
- `hextra-card-subtitle` - カードサブタイトル要素
|
||||
|
||||
##### カードグリッド
|
||||
|
||||
- `hextra-cards` - カードグリッドコンテナ
|
||||
|
||||
##### Jupyter Notebook
|
||||
|
||||
- `hextra-jupyter-code-cell` - Jupyterコードセルコンテナ
|
||||
- `hextra-jupyter-code-cell-outputs-container` - Jupyterコードセル出力コンテナ
|
||||
- `hextra-jupyter-code-cell-outputs` - Jupyterコードセル出力div要素
|
||||
|
||||
##### PDF
|
||||
|
||||
- `hextra-pdf` - PDFコンテナ要素
|
||||
|
||||
##### ステップ
|
||||
|
||||
- `steps` - ステップコンテナ
|
||||
|
||||
##### タブ
|
||||
|
||||
- `hextra-tabs-panel` - タブパネルコンテナ
|
||||
- `hextra-tabs-toggle` - タブトグルボタン
|
||||
|
||||
##### ファイルツリー
|
||||
|
||||
- `hextra-filetree` - ファイルツリーコンテナ
|
||||
|
||||
##### フォルダ
|
||||
|
||||
- `hextra-filetree-folder` - ファイルツリーフォルダコンテナ
|
||||
|
||||
#### ナビゲーションバー
|
||||
|
||||
- `nav-container` - ナビゲーションバーコンテナ
|
||||
- `nav-container-blur` - ナビゲーションバーコンテナのぼかし要素
|
||||
- `hamburger-menu` - ハンバーガーメニューボタン
|
||||
|
||||
#### フッター
|
||||
|
||||
- `hextra-footer` - フッター要素
|
||||
- `hextra-custom-footer` - カスタムフッターセクションコンテナ
|
||||
|
||||
#### 検索
|
||||
|
||||
- `search-wrapper` - 検索ラッパーコンテナ
|
||||
- `search-input` - 検索入力要素
|
||||
- `search-results` - 検索結果リストコンテナ
|
||||
|
||||
#### 目次
|
||||
|
||||
- `hextra-toc` - 目次コンテナ
|
||||
|
||||
#### サイドバー
|
||||
|
||||
- `mobile-menu-overlay` - モバイルメニューのオーバーレイ要素
|
||||
- `sidebar-container` - サイドバーコンテナ
|
||||
- `sidebar-active-item` - サイドバーのアクティブアイテム
|
||||
|
||||
#### 言語スイッチャー
|
||||
|
||||
- `language-switcher` - 言語スイッチャーボタン
|
||||
- `language-options` - 言語オプションコンテナ
|
||||
|
||||
#### テーマトグル
|
||||
|
||||
- `theme-toggle` - テーマトグルボタン
|
||||
|
||||
#### コードコピーボタン
|
||||
|
||||
- `hextra-code-copy-btn-container` - コードコピーボタンコンテナ
|
||||
- `hextra-code-copy-btn` - コードコピーボタン
|
||||
|
||||
#### コードブロック
|
||||
|
||||
- `hextra-code-block` - コードブロックコンテナ
|
||||
|
||||
#### フィーチャーカード
|
||||
|
||||
- `hextra-feature-card` - フィーチャーカードリンク要素
|
||||
|
||||
#### フィーチャーグリッド
|
||||
|
||||
- `hextra-feature-grid` - フィーチャーグリッドコンテナ
|
||||
|
||||
#### パンくずリスト
|
||||
|
||||
パンくずリスト用の特定のクラスはありません。
|
||||
|
||||
### シンタックスハイライト
|
||||
|
||||
利用可能なシンタックスハイライトテーマのリストは、[Chroma Styles Gallery](https://xyproto.github.io/splash/docs/all.html)で確認できます。スタイルシートは以下のコマンドで生成できます:
|
||||
|
||||
```shell
|
||||
hugo gen chromastyles --style=github
|
||||
```
|
||||
|
||||
デフォルトのシンタックスハイライトテーマをオーバーライドするには、生成されたスタイルをカスタムCSSファイルに追加します。
|
||||
|
||||
## カスタムスクリプト
|
||||
|
||||
すべてのページのheadの最後にカスタムスクリプトを追加するには、以下のファイルを追加します:
|
||||
|
||||
```
|
||||
layouts/partials/custom/head-end.html
|
||||
```
|
||||
|
||||
## フッターのカスタムセクション
|
||||
|
||||
フッターに追加のセクションを追加するには、サイト内に`layouts/partials/custom/footer.html`ファイルを作成します。
|
||||
|
||||
```html {filename="layouts/partials/custom/footer.html"}
|
||||
<!-- ここにフッター要素を追加 -->
|
||||
```
|
||||
|
||||
追加されたセクションは、フッターの著作権セクションの前に追加されます。
|
||||
[HTML](https://developer.mozilla.org/ja/docs/Web/HTML)と[Hugoテンプレート構文](https://gohugo.io/templates/)を使用して、独自のコンテンツを追加できます。
|
||||
|
||||
フッターセクションで利用可能なHugo変数は、`.switchesVisible`と`.copyrightVisible`です。
|
||||
|
||||
## カスタムレイアウト
|
||||
|
||||
テーマのレイアウトは、サイトの`layouts`ディレクトリ内に同じ名前のファイルを作成することでオーバーライドできます。
|
||||
例えば、ドキュメント用の`single.html`レイアウトをオーバーライドするには、サイト内に`layouts/docs/single.html`ファイルを作成します。
|
||||
|
||||
詳細については、[Hugoテンプレート][hugo-template-docs]を参照してください。
|
||||
|
||||
## さらなるカスタマイズ
|
||||
|
||||
探しているものが見つかりませんでしたか?[ディスカッションを開く](https://github.com/imfing/hextra/discussions)か、テーマに貢献してください!
|
||||
|
||||
[hugo-template-docs]: https://gohugo.io/templates/
|
83
exampleSite/content/docs/advanced/multi-language.ja.md
Normal file
83
exampleSite/content/docs/advanced/multi-language.ja.md
Normal file
@ -0,0 +1,83 @@
|
||||
---
|
||||
title: "多言語対応"
|
||||
weight: 1
|
||||
prev: /docs/advanced
|
||||
---
|
||||
|
||||
Hextraは、Hugoの[多言語モード](https://gohugo.io/content-management/multilingual/)を使用して、複数の言語でサイトを作成することをサポートしています。
|
||||
|
||||
<!--more-->
|
||||
|
||||
## 多言語対応を有効にする
|
||||
|
||||
サイトを多言語対応にするためには、Hugoにサポートする言語を伝える必要があります。サイトの設定ファイルに以下を追加します:
|
||||
|
||||
```yaml {filename="hugo.yaml"}
|
||||
defaultContentLanguage: en
|
||||
languages:
|
||||
en:
|
||||
languageName: English
|
||||
weight: 1
|
||||
fr:
|
||||
languageName: Français
|
||||
weight: 2
|
||||
ja:
|
||||
languageName: 日本語
|
||||
weight: 3
|
||||
```
|
||||
|
||||
## ファイル名による翻訳管理
|
||||
|
||||
Hugoは、ファイル名による翻訳管理をサポートしています。例えば、英語のファイル `content/docs/_index.md` がある場合、フランス語の翻訳用に `content/docs/_index.fr.md` というファイルを作成できます。
|
||||
|
||||
{{< filetree/container >}}
|
||||
{{< filetree/folder name="content" >}}
|
||||
{{< filetree/folder name="docs" state="open" >}}
|
||||
{{< filetree/file name="_index.md" >}}
|
||||
{{< filetree/file name="_index.fr.md" >}}
|
||||
{{< filetree/file name="_index.ja.md" >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/container >}}
|
||||
|
||||
注: Hugoは[コンテンツディレクトリによる翻訳](https://gohugo.io/content-management/multilingual/#translation-by-content-directory)もサポートしています。
|
||||
|
||||
## メニュー項目の翻訳
|
||||
|
||||
ナビゲーションバーのメニュー項目を翻訳するには、`identifier` フィールドを設定する必要があります:
|
||||
|
||||
```yaml {filename="hugo.yaml"}
|
||||
menu:
|
||||
main:
|
||||
- identifier: documentation
|
||||
name: Documentation
|
||||
pageRef: /docs
|
||||
weight: 1
|
||||
- identifier: blog
|
||||
name: Blog
|
||||
pageRef: /blog
|
||||
weight: 2
|
||||
```
|
||||
|
||||
そして、対応するi18nファイルで翻訳します:
|
||||
|
||||
```yaml {filename="i18n/fr.yaml"}
|
||||
documentation: Documentation
|
||||
blog: Blog
|
||||
```
|
||||
|
||||
## 文字列の翻訳
|
||||
|
||||
他の場所の文字列を翻訳するには、対応するi18nファイルに翻訳を追加する必要があります:
|
||||
|
||||
```yaml {filename="i18n/fr.yaml"}
|
||||
readMore: Lire la suite
|
||||
```
|
||||
|
||||
テーマで使用されている文字列のリストは、`i18n/en.yaml` ファイルにあります。
|
||||
|
||||
## さらに詳しく
|
||||
|
||||
- [Hugo 多言語モード](https://gohugo.io/content-management/multilingual/)
|
||||
- [Hugo 多言語 Part 1: コンテンツ翻訳](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/)
|
||||
- [Hugo 多言語 Part 2: 文字列のローカライズ](https://www.regisphilibert.com/blog/2018/08/hugo-multilingual-part-2-i18n-string-localization/)
|
Reference in New Issue
Block a user