ここでは、更新情報のうち、最初の3件をトップページに表示することを考えます。
まず、更新情報は以下のように個別の.mdファイルとしてコンテンツを作成することにしましょう。
+++ date = "2016-01-01" +++ あけましておめでとうございます！
+++ date = "2016-01-02" +++ もうお正月も二日目。
+++ date = "2016-01-07" +++ 七草粥で健康に。...
+++ date = "2016-03-05" +++ そんなこんなで3月になりました。
次に作成したコンテンツの一覧ページを作成しましょう。更新情報を保存したwhats-newフォルダに対応させてレイアウトを作成します。
<html>
<body>
<p>更新情報の一覧:</p>
{{ range .Data.Pages }}
<p>{{ .Date.Format "02 Jan 2006"}}</p>
<p>{{ .Content}}</p>
{{ end }}
</body>
</html>
hugoを実行してレンダリングすると以下のようなページが作成されます。
<html> <body> <p>更新情報の一覧:</p> <p>01 Jan 2016</p> <p>あけましておめでとうございます！</p> <p>02 Jan 2016</p> <p>もうお正月も二日目。</p> <p>07 Jan 2016</p> <p>七草粥で健康に。</p> ... <p>05 Mar 2016</p> <p>そんなこんなで3月になりました。</p> </body> </html>
このリストの一部だけをトップページに表示するため、以下のようにindex.htmlのレイアウトを作成します。（トップページのみコンテンツ（.mdファイル）は存在せずレイアウトのみであることに注意してください。）
記事のデータを.Data.Pagesで参照し、Sectionが"whats-new"であるもののみを抽出、そのうち、最初の3件についてrangeで繰り返し処理して出力します。
<html>
<body>
<h1>トップページ</h1>
<p>更新情報（最新３件）：</p>
{{ range first 3 (where .Data.Pages "Section" "whats-new" }}
<p>{{ .Date.Format "02 Jan 2006"}}</p>
<p>{{ .Content}}</p>
{{ end }}
<a href="whats-new/">...more</a>
</body>
</html>
レンダリングされたトップページは以下のようになり、更新情報の最初の3件が出力されました。なお、ここで最初の、としていますが、記事の順番は記事に指定されたdate、weight、ファイル名などによって決まりますので、希望する順番になるように適切にこれらを設定してください（通常はdateを設定しておけば、新しいものから順に並ぶ）。<html> <body> <h1>トップページ</h1> <p>更新情報（最新３件）：</p> <p>01 Jan 2016</p> <p>あけましておめでとうございます！</p> <p>02 Jan 2016</p> <p>もうお正月も二日目。</p> <p>07 Jan 2016</p> <p>七草粥で健康に。</p> <a href="whats-new/">...more</a> </body> </html>
No comments :
Post a Comment