今回はブログの作り方です。
ブログの仕組みの作り方
Leap daysはデフォルトでブログ機能をサポートしていないので、自分で仕組みを作らなければなりません。 といっても、それは大変な作業ではありません。 デフォルトのテーマminimaがブログをサポートしているので、それを参考に作るのが早いです。
あとはブログ記事を書いて_posts
ディレクトリに保存するだけです。
Minimal Mistakes
Jekyllのテーマはたくさんあり、JekyllのウェブサイトのResourcesにリンクがあります。 ここではブログ機能をサポートしているMinimal Mistakesをテーマにしてブログのサンプルを作ってみます。 なお、ここではローカルで動かします。 GitHubと連携するには別の方法が必要です。 Minimal Mistakesのドキュメントを参考にしてください。
インストール
ブログ用のディレクトリを作ります。 ここでは「sample」という名前にします。
$ mkdir sample $ cd sample
Gemfileを作ります。
source "https://rubygems.org" gem "minimal-mistakes-jekyll" gem "webrick"
_cofig.ymlを作ります
theme: minimal-mistakes-jekyll
gemをインストールします。
$ bundle install
以上でインストールは完了です。 簡単!!
index.mdを作る
トップページの名前は「index.md」と決まっています。 簡単なメッセージを書いておくことにします。
--- layout: home title: サンプルページ description: Sample site with Minimal Mistakes header: image: "/assets/images/home.png" --- みなさん、こんにちは!
- レイアウトはhomeにする
- titleとdescriptionを書く
- ページを少しお洒落にするためにタイトルのヘッダに写真を入れる。 headerキーの下にimageキーで画像の場所を指定する
タイトル画面の画像を設定するyamlはMinimal Mistakesのレイアウトを調べると分かります。 ドキュメントには短く書かれているだけで分かりにくいです。 ソースコードを見るのが一番確かなのですが、ドキュメントにも書いてほしいです。
それでは、画面をチェックしましょう。
$ bundle exec jekyll serve
ブラウザでlocalhost:4000を開きます。
写真が入るとイメージが良くなりますね。
記事の投稿
ブログの投稿記事は日時で順番付けられます。 日時はファイル名とフロントマターの2ヶ所に書きます。
--- layout: posts title: "Welcome to Sample page" description: "The first post to Sample page" date: 2022-08-20 14:05:00 +0900 --- はじめて記事を投稿します。 Sample page をよろしく!
- layoutはpostsにする。これはMinimal Mistakesの仕様です。minimaではpostと単数形
- タイトルとディスクリプションを書く
- dateに日時を書く。フォーマットはYYYY-MM-DD HH:MM:SS +900。最後の+900はTokyoの標準時からの時差
- ファイル名は
2022-08-20-welcome-to-Sample-pagei.md
とした。「日付-タイトル.md」のフォーマット
もう一つ記事を作ってみます。
--- layout: posts title: ふたつめの記事 description: この記事が投稿2回目 date: 2022-084-20 14:15:00 +0900 --- 2回目の投稿です。 Sample page をもっともっとよろしく!
ファイル名は2022-08-20-The-second-post.md
としました。
全角文字を使ってもたぶん良いと思います。
2つの記事はホーム画面のコンテンツの下にリンクとして現れます。
まとめ
このように、ブログの仕組みがテーマに用意されていれば、記事の投稿は簡単です。 また、Leap dayも良かったのですが、Minimal Mistakeは洗練されたデザインでこれも使ってみたくなりました。 しかもざっと見ただけですが、機能が豊富です。
インターネットを見ると、「はてな」からJekyll+GitHubに移行した人もいました。 ある程度スキルが必要ですが、テーマを使えば敷居は低いように思います。
次回は、前回紹介したLiquidについて取り上げたいと思います。