ステップバイステップチュートリアル

8. ブログ

データベースなしでブログを持つ方法について疑問に思われるかもしれません。Jekyllの真骨頂として、ブログはテキストファイルのみで動作します。

投稿

ブログ投稿は_postsというフォルダに配置されます。投稿のファイル名には特別な形式があります。公開日、タイトル、拡張子の順です。

最初の投稿を_posts/2018-08-20-bananas.mdに以下の内容で作成してください。

---
layout: post
author: jill
---

A banana is an edible fruit – botanically a berry – produced by several
kinds of large herbaceous flowering plants in the genus Musa.

In some countries, bananas used for cooking may be called "plantains",
distinguishing them from dessert bananas. The fruit is variable in size,
color, and firmness, but is usually elongated and curved, with soft
flesh rich in starch covered with a rind, which may be green, yellow,
red, purple, or brown when ripe.

これは、以前に作成したabout.mdと似ていますが、作成者と異なるレイアウトがあります。authorはカスタム変数であり、必須ではなく、creatorのような名前を付けることもできます。

レイアウト

postレイアウトは存在しないため、_layouts/post.htmlに以下の内容で作成する必要があります。

---
layout: default
---
<h1>{{ page.title }}</h1>
<p>{{ page.date | date_to_string }} - {{ page.author }}</p>

{{ content }}

これはレイアウト継承の例です。投稿レイアウトは、デフォルトレイアウトで囲まれたタイトル、日付、作成者、コンテンツ本文を出力します。

date_to_stringフィルターにも注目してください。これは日付をより見やすい形式にフォーマットします。

投稿一覧

現在、ブログ投稿に移動する方法はありません。通常、ブログにはすべての投稿を一覧表示するページがあります。次にそれを作成しましょう。

Jekyllはsite.postsで投稿を利用できるようにします。

ルートにblog.html（/blog.html）を以下の内容で作成してください。

---
layout: default
title: Blog
---
<h1>Latest Posts</h1>

<ul>
  {% for post in site.posts %}
    <li>
      <h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
      {{ post.excerpt }}
    </li>
  {% endfor %}
</ul>

このコードにはいくつか注意すべき点があります。

post.urlは、投稿の出力パスにJekyllによって自動的に設定されます。
post.titleは投稿のファイル名から取得され、フロントマターでtitleを設定することで上書きできます。
post.excerptは、デフォルトではコンテンツの最初の段落です。

また、メインナビゲーションからこのページに移動する方法が必要です。_data/navigation.ymlを開き、ブログページのエントリを追加します。

- name: Home
  link: /
- name: About
  link: /about.html
- name: Blog
  link: /blog.html

その他の投稿

ブログは投稿が1つだけではあまり面白くありません。いくつか追加してみましょう。

_posts/2018-08-21-apples.md:

---
layout: post
author: jill
---
An apple is a sweet, edible fruit produced by an apple tree.

Apple trees are cultivated worldwide, and are the most widely grown
species in the genus Malus. The tree originated in Central Asia, where
its wild ancestor, Malus sieversii, is still found today. Apples have
been grown for thousands of years in Asia and Europe, and were brought
to North America by European colonists.

_posts/2018-08-22-kiwifruit.md:

---
layout: post
author: ted
---
Kiwifruit (often abbreviated as kiwi), or Chinese gooseberry is the
edible berry of several species of woody vines in the genus Actinidia.

The most common cultivar group of kiwifruit is oval, about the size of
a large hen's egg (5–8 cm (2.0–3.1 in) in length and 4.5–5.5 cm
(1.8–2.2 in) in diameter). It has a fibrous, dull greenish-brown skin
and bright green or golden flesh with rows of tiny, black, edible
seeds. The fruit has a soft texture, with a sweet and unique flavor.

http://localhost:4000を開いて、ブログ投稿を確認してください。

次に、各投稿の作成者用のページの作成に焦点を当てます。

戻る