ここでは、更新情報のうち、最初の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>更新情報(最新3件):</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>更新情報(最新3件):</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