#author("2020-06-13T08:15:01+00:00","default:wikiwriter","wikiwriter")
&tag(Hugo);
*目次 [#pa2e5701]
#contents
*関連ページ [#b5123a9d]
-[[./テーマ作成]]
-[[./hugo-icarus-theme]]
*参考情報 [#f1658a3f]
-Goで作られた静的サイトジェネレーター。
*インストール [#se70d986]
-MacPortsの場合以下の方法でインストール
sudo port install hugo
*基本的な使用方法 [#f816055a]
-[[HUGOで静的サイトを作成してみた - Qiita:https://qiita.com/zak74702675/items/b84cd883c01d72720c35]]
-サイトの作成(demoというサイトが作られる)
hugo new site demo
-テーマの追加。
cd demo
git init
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
echo 'theme = "ananke"' >> config.toml
-記事の追加。content/post下に記事が作成される。
hugo new post/my-first-post.md
-hugo server
hugo server -D
-記事の公開。[[静的サイトジェネレータ「Hugo」〜公開方法〜 - SIS Lab:https://www.meganii.com/blog/2017/01/11/deploy-site-with-hugo/]]。
-hugoコマンドを実行するとpublicディレクトリの下にhtmlが書き出される。それをscpなりで公開する。
*Tips [#vab57140]
**サブディレクトリで公開 [#yf5d9a07]
-とりあえず以下のようにすれば良い？
#pre{{
baseurl="http://localhost/hugo"
RelativeURLs=true
CanonifyURLs=true
}}
**カテゴリ [#pf3eb137]
-[[Hugoのテーマを自作してみる 階層化したカテゴリーの実装 - hansode Lab:https://hansode.net/2020-05-07-hugo-use-category-section/]]
-[[Hugo の カテゴリー(categories) を 階層化 する | のい太ろぐ:https://noitalog.tokyo/hugo-categories-level/]]…記事「categories
」を使って階層化する方法。
-フォルダ階層をメニューとして表示する。
--[[Content Sections | Hugo:https://gohugo.io/content-management/sections/#example-breadcrumb-navigation]]
--[[パンくずリストを表示するには - bnote:https://www.bnote.net/hugo/breadcrumb.html]]
**コンテンツ管理 [#h0e08af0]
-ディレクトリを「001-about」(/about)「002-home」(/home)のように設定していけばセクションの順番をフォルダ名で管理できる…と思ったがセクションにslugは設定できないようだ。
-対して記事に「url」を指定してパーマリンクを設定すると、ディレクトリ部分まで含めてすきなURLを設定できるが(例: /t/hoge.html)、「/t/」に対応したセクションが存在しないと記事一覧は取得できない。
-結局about、homeのようなディレクトリを設定し、weightを設定するhugo公式ドキュメントサイトのような方式が一番素直なのか。？
**ツリー構造 [#d7068a91]
-[[サイト内の全ページの一覧をセクションの階層構造に従って表示する | まくまくHugo/Goノート:https://maku77.github.io/hugo/list/page-hierarchy.html]]
*テーマ [#u4bc98b0]
**おすすめテーマ [#ue72d018]
-Clean White: [[ブログ移行日記(その1) - Hugoとテーマ-@johtaniの日記 3rd | @johtani's blog 3rd edition:https://blog.johtani.info/blog/2020/01/22/intro-hugo-and-theme/]]
-Bilberry Hugo Theme: [[ブログをHugoに移行しました | 研究開発日誌:http://hideki-todo.com/cgu/blog/article/hugo/]]
-Icarus / Tranquilpeak / Robust: [[Hugoのオススメ３テーマを相互に切り替え可能な環境を作ってみてわかったこと · GizWoo:https://blog.gizwoo.com/hugo-customize-themes/]]
-Mainroad: [[静的サイトジェネレーターのHugoでブログはじめました - Yabuzaki blog:https://blog.planet12.jp/post/start-blog/]]
**テーマのカスタマイズ [#r6802bd9]
-[[Hugoでテーマをカスタマイズする方法:https://ja.takp.me/posts/how-to-customize-the-hugo-themes/]]
-layouts以下にテーマと同じファイルを階層構造で作成する。
***ページリソースをサムネイルとして使用したい。 [#s43f16e6]
-たとえばフロントマターでthumbnailをページリソースとして指定している場合、以下のようにテーマを改造する。
{{ if .Params.thumbnail }}
{{ $image := .Resources.GetMatch .Params.thumbnail }}
<div class="thumb" style="background-image: url('{{ $image.RelPermalink }}');"></div>
{{ else }}
<div class="thumb"></div>
{{ end }}
** hugo_theme_robustの使用 [#iacd67df]
***参考情報 [#m6ecae83]
-[[Hugoのテーマ、Robustを採用・カスタマイズ - なるほどわからん:https://masaqu.id/posts/2019-06-11_robust-customize/]]
-[[HUGO のテーマ Robust のカスタマイズ - zzzmisa's blog:https://blog.zzzmisa.com/customize_hugo_theme/]]
-[[Alice in the Machine - wiki:https://wiki.browniealice.net/technote/hugo/setting_for_robust/]]
-[[blog/using-hugo.md at master · kaitoy/blog:https://github.com/kaitoy/blog/blob/master/content/post/using-hugo.md]]
*トラブルシューティング [#q36b255f]
**scssが変換できないとかどうとかのエラー [#mec03aa4]
-scssを扱うためにはextended版が必要？
sudo port install hugo +extended
**Error: add site dependencies: load resources: loading templates: walk: Readdir: decorate: [#m3cf18a1]
-hugo server -Dでエラー。
-layoutフォルダ内にEmacsのロックファイルが残っていたのが原因。
-ドットから始まるファイルがないか確認する。
** found no layout file for "HTML" for kind "page" [#g20b9e46]
-hugo server -Dを実行すると以下の警告メッセージが表示される。
-「 found no layout file for "HTML" for kind "page": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.」
-原因はテーマを指定していないこと。
-config.tomlで指定。
theme = "mytheme"
**public以下にファイルが書き出されない [#v8f4c250]
-コンテンツがdraftになっていないか確認。
-「hugo server -D」で確認していて「hugo」でコンパイルするとドラフトが表示されない。
**情報が反映されない？ [#xe99e1b5]
-[[Hugo サーバーで記事の変更内容が反映されない場合 | まくまくHugo/Goノート:https://maku77.github.io/hugo/command/ignore-cache.html]]
-キャッシュが原因？
$ hugo server --ignoreCache
-階層構造がおかしかったのもこれが原因か。
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
