Memo

簡単にセットアップ方法を備忘のために書いておく 前提 MacOS Mojave Homebrew 2.1.16 GitHubのblogリポジトリで公開する この記事でディレクトリを表記する時は、blogローカルリポジトリの最上位を/で表現する インストール ターミナルにて以下のコマンドを叩く 1 $ brew install hugo ブログサイトの作成 blogサイトのローカルリポジトリがある前提で進める。blogディレクトリに移動して以下のコマンドを実行する。 forceフラグをつけると、今のディレクトリに何かファイルがあった場合でもサイトを生成してくれる。僕の環境の場合はREADME.mdしかなかったので何も上書きされなかったが、hugoが生成するファイルと名前がかぶる場合は、何かファイルが上書きされる恐れがあるので注意。 1 $ hugo new site ./ --force すると、何やらたくさんファイルやディレクトリを生成してくれる。 テーマの追加 contrast-hugoが気に入ったのでこれを使う。 /themesに移動して、contrast-hugoのファイルをcloneしてくる 1 $ git clone https://github.com/niklasbuschmann/contrast-hugo.git 後でテーマをいじるので、一応テーマ名を変更しておく。contrast-hugoをch-modifiedに変更する。 シンタックスハイライトの設定 Chromaというハイライターが入っているらしい。そのテーマはこちらで見られる。今回はgithubというテーマを利用する。 /config.tomlでpygmentsStyle=githubと指定すると、スタイルをhtmlに直接埋め込んでくれる。しかしCSSを後で自分でいじりたいのでこの方法は用いない。その代わり、pygmentsUseClasses=trueとして、CSSを利用することにする。 /themes/ch-modified/static/cssに移動して、以下のコマンドを実行する。 1 $ hugo gen chromastyles --style=github > syntax.css configの設定 /config.tomlの内容を以下の通りにする。ほとんどの設定項目がデフォルトのもので、正直意味が分かっていないものもある。コメントアウトのところはAboutページのリンクを貼るものだが、Aboutページができたらコメントを外そうと思っている。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 baseURL = [ブログのURL] title = [ブログのタイトル] author = [作成者] paginate = 3 languageCode = "ja-jp" DefaultContentLanguage = "ja" enableInlineShortcodes = true footnoteReturnLinkContents = "^" theme = [テーマ] publishDir="docs" pygmentsUseClasses = true [menu] # 気が向いたら設定する # [[menu....