hugo theme fiber
1.0.0
ミニマリストのための Hugo のテーマ。 Fiber では最小限の JavaScript と CSS を使用するため、サイトの読み込みが速くなります。 UIも綺麗で目に優しい!!
このテーマを Hugo ベースのサイトで使用するには 2 つの方法があります。
<hugo-site-root>/themes/に直接ダウンロードします。 hugo new site SITE_NAMEを使用してサイトを作成するSITE_NAMEにcdgit init 。 git サブモジュールを追加する必要があるため、これが必要になります。git submodule add [email protected]:abdus/hugo-theme-fiber.git themes/hugo-theme-fiberを実行してサブモジュールを追加しますhugo serve使用して Hugo サーバーをローカルで起動します。テーマ リポジトリに更新がある場合は、 git submodule update --remote使用して取得できます。
何らかの理由で Git を使用できない場合は、この方法を使用してください。
SITE_ROOT/themes/hugo-theme-fiber/に抽出します。hugo serve実行してローカルで Hugo を起動します。 このテーマには、基本的な SEO と Schema.org からの最小限の JSON-LD データが読み込まれています。
すぐに使えるショートコードとは別に、時には役に立つことが証明される他の便利なショートコードがいくつかあります。
AsciiNema キャストを埋め込みます。使用するショートコード: {{< asciinema id="id of a public cast" >}}
このショートコードは、caniuse.com Web サイトからの最新データを示します。 Web 開発者にとって役立ちます。例：
{{ < caniuse feature =" abortcontroller " periods =" future_1,current,past_1,past_2 "
> }}Web サイトの訪問者は、ワンクリックでコードブロックのコンテンツをコピーできます。これにより、コードのインデントが壊れることはありません。
content/notes内に置いたものはすべて、大まかな注釈が付けられます。これにより、メモから重要なことを認識しやすくなります。
大まかな注釈は、 strong 、 em 、 strikethroughなどのタグを使用して制御されます。新しいnotesエントリを生成するには、まずディレクトリcontent/notesを作成する必要があります。次に、 hugo new notes/file-name.mdを使用してノートを生成します。このファイルには、上記のタグで注釈を付ける方法に関する情報が含まれます。
ホームページは 2 つの異なる方法で設定できます。 contentディレクトリからお気に入り/最も重要なセクションをリストすることができます。
または、その中にカスタム コンテンツを配置します。
あるいは、両方を行うこともできます。 fromtmatter 内にプロパティtitle持つファイルcontent/_index.mdを必ず作成してください。このtitleプロパティは SEO に役立ちます。例：
---
title : " Welcome to my Homepage "
---
<!-- content goes here --> ホームページにコンテンツのリストを作成するには、 config.tomlファイルにmainSectionsという変数を設定する必要があります。例：
[ params ]
mainSections = [ " posts " ]カスタム コンテンツをリストするには、適切なフロントマターを使用してcontent/_index.md内にカスタム コンテンツを配置するだけです。
デフォルトでは、Hugo はクラスを使用しません。ただし、一部の機能はテーマに依存しているため、これはこのテーマでは機能しません。
コードブロックのクラスをオンにする必要があります。その方法は次のとおりです。
# file: config.toml
[ markup ]
[ markup . highlight ]
codeFences = true
noClasses = falseデフォルトでは、トップメニューにはメニュー項目が 1 つだけあります。さらに項目を追加するには、 config.toml内でメニュー項目を定義する必要があります。以下は私のサイトのconfig.tomlの例です。
[ menu ]
[[ menu . main ]]
identifier = " me "
name = " Me "
url = " /me/ "
weight = 10
[[ menu . main ]]
identifier = " keys "
name = " keys "
url = " /keys/ "
weight = 10
[[ menu . main ]]
identifier = " categories "
name = " categories "
url = " /categories "
weight = 10
[[ menu . main ]]
identifier = " notes "
name = " notes "
url = " /notes/ "
weight = 10サイトのタイトルは、 config.tomlの次のパラメータによって制御されます。
[ params ]
title = " abdus.xyz "
mainSections = [ " posts " ]Notes 、このテーマでハードコーディングされた特別な種類です。この種のコンテンツには、大まかな注釈が付けられます (メモの管理が容易になります)。
コマンドhugo new notes/your-filename.mdを使用してノート ページを生成し、ノート ページ内で大まかな注釈を使用する方法を学びます。
種類ノートのアーキタイプが含まれています。
このテーマは、Frontmatter を使用して、SEO のためのカスタム投稿の説明とメタ画像を処理します。 meta.imageとmeta.descriptionが見つからない場合は、それぞれ/images/default-meta-image.pngと.Summaryにフォールバックします。
フロントマターでこれら 2 つのフィールドを次のように使用します。
---
...
...
meta :
image : " https://example.com/some-image.png "
description : " your custom desc "
...
...
---
<!-- content goes here -->
