HugoのAcademicテーマのクイックスタート

2020/05/03 3 分で読める hugo, academic

今回はhugoのacademicテーマを使用して静的サイトを構築しようと思います。

環境

今回はacademicテーマのクイックスタートについて記事にしようと思います。所感としてはacademicテーマは他のテーマに比べて、かなり特殊なテーマのイメージがありますね。ですが、機能としては本当に豊富で使う価値は間違いなくあると思うので、是非使って見てはいかがでしょうか！

ターミナルで作業する際はgitを使用します。インストールしてない場合はbrewコマンドを使用します。 Macはbrewコマンドがあるので便利ですよね。

brew install git
git --version

gitについての詳細な説明は今回は割愛します。いずれするかもしれん..

gitがインストールできたら、academicの公式が推奨している、キックスターターをインストールします

git clone https://github.com/sourcethemes/academic-kickstart.git My_Website

テーマを初期化します。

cd My_Website
git submodule update --init --recursive

以上で準備は完了です。デフォルトの状態でページを確認したければ、以下のコマンドを使用して、localhost:1313にアクセルします。

hugo server

プロジェクトルートにあるconfig.tomlではなく、 /config/_default/ディレクトリ以下にある4つの.tomlファイルを編集します。

少し過去記事と被っていますがこちらにも記載します記事を作成するには以下のコマンドを使うのを推奨します。

hugo new  --kind post post/my-article-name

[content/post/my-article-name]ディレクトリと[content/post/my-article-name/index.md]が作成されて、index.mdに記事を書きます。

クイックスタートですと以下のようなコマンドで記事を作成しています。

hugo new post/my-first-post.md

もちろんこのコマンドでも記事は作成できますが、記事のトップ画像などをacademicのテーマの機能を使う際などにacademicの推奨コマンドを使う方が色々便利なイメージです。

ページの管理をするメタデータについて軽く説明します。

title : ページのタイトル
subtitle：タイトルの下に表示されるオプションのサブタイトル
summary : ページのコンテンツの要約。一覧画面等で表示されたり、検索エンジンのランキングにも効果的
authors : ページの作成者を表示し、ユーザープロファイルにリンクします。
tags : コンテンツにtagをつけると、ユーザーが同様のコンテンツを見つけやすくなるようです。tags: ["Electronics", "hugo"]
categories : コンテンツをカテゴリに分けると、サイト内での類似コンテンツを見つけるのに役に立ちます。categories: ["hugo"]
data : ページが公開された日付、hugo newで自動挿入されます
featured : featured: trueすることで、特集ウィジェットにページを表示できます。
draft : draft: trueにすると、ローカルで実行時に自分だけがページ表示になります。

今回はacademicテーマのクイックスタートについて書いてみました。設定ファイルについてはまた、後日記事にしようかなぁ。

hugo academic