hugoで自サイト構築-config.yaml設定編
ディレクトリの大まかな構成 この記事を書いている時点でのディレクトリが以下のような構成になっています。
このテンプレートいじっていて重要なセクションについて、
気づいたことやここら辺のディレクトリはこういうものかなみたいな事を簡単に示します。
だいぶ荒いですけど… assets/images ポートフォリオ向けのyamlやconfig.yaml等で設定する際に参照先となる画像ファイルの保存先だと思われます。
各yamlではポートフォリオ画面やサイト、サイトオーナーなどについての記述や設定を記載できるのですが(詳細は後述)
そこで必要となるファイルを必要なyamlのファイル名やディレクトリに合わせて保管しています。
content/notes blog機能実現している部分の一つですね。 当サイトのNoteでの投稿セクションに利用しました。
今後ここにコンテンツを追加することでNoteが拡充されるかと…
content/posts blog機能実現している部分の一つですね。 今ご覧になっている記事を構成するディレクトリです。
data ポートフォリオを構成するディレクトリですね。
設定項目ごとにyamlファイルを用意していきそこに任意の設定をしていくことで自分なりのポートフォリオサイトができます。
又jpディレクトリ以外を作ることで他言語にも対応可能です。
config.yamlの設定 以前の操作で生成されたconfig.yamlに設定を記述していきます。
このファイルはこのサイトの基本的な設定を記述できる部分です。
baseURL サイトの公開用URLをここに記載します
languageCode hugoは他言語対応サイトを構築できます。
そのための設定として言語や言語ごとのサイトの振る舞いを変更できる項目が設けられています。
languageCode はRSSによってWebサイトの更新情報を配布するためlanguageエレメントに何を記載するかを規定します。
日本語でのみの利用なら"ja"でよいかと思います。
DefaultContentLanguage どの言語をデフォルトとして設定するかを規定できます。
title サイトタイトル
theme 利用しているテーマの設定をします。今回はtohaを利用させて頂いていますのでこの"toha"と入力します。
languages このセクションにはサイトが取り扱う言語について記載します。
jp 今回は日本語なのでjpのみです。
複数言語の場合にはこのセクションを増やしてあげると良いです。
languageName languageNameには表記したい文字列を記載するようです。
weight weightには表示の優先度を数値で記載します。
enableEmoji 絵文字の有効化無効化 🤣
enable 有効化することで絵文字を記述できるようになります。✌️
markup TOCの対象についての設定ができます
tableOfContents TOCに含める深さの設定
startLevel/endLevel h2 ~ h6までを数値で範囲指定できます
ordered 番号をつけるか否かを設定できます
params ここの配下にはサイトのパラメーターについての記述を行います。
background 読み込ませたい背景画像のパスを設定します。 assets内にimagesディレクトリを作成しその中にsiteディレクトリを作成します。 背景画像はその中に配置すると読み込んでくれるみたいです。
logo 読み込ませたいロゴ画像のパスを設定します。
main メインロゴを指定します。