Tbpgr Blog

Employee Experience Engineer tbpgr(てぃーびー) のブログ

Go言語製のWebサイトエンジンHugoの機能整理 - Ordering

f:id:tbpg:20150811225844p:plain

Go言語製のWebサイトエンジンHugoの機能整理をします。
今回はOrderingです。

Hugoとは?

Go言語製のWebサイトエンジンHugoの疎通確認

Ordering

Hugoはコンテンツの並び順をフレキシブルに設定可能です。
デフォルトではweight,date(降順)の順にソートされます。
しかしtitleやlinktitleなど、その他の項目によるソートも可能です。

weight,dateともにオプショナルであり、weightが省略されるとdate順に並ぶことになります。

+++
title = "suzuki"
date = "2014-09-17"
name ="suzuki"
age =23
type ="member"
weight =2
+++

## 趣味
鈴木の会

並び替えサンプル

hugo_theme_beg のテーマをベースに編集します

テスト用Contentデータ

  • content/member/tanaka.md
+++
title = "tanaka"
date = "2015-08-10T15:52:38+09:00"
name ="tanaka"
age =23
type ="member"
weight=3
+++

## 趣味
田中の会
  • content/member/suzuki.md
+++
title = "suzuki"
date = "2015-08-11T15:52:38+09:00"
name ="suzuki"
age =43
type ="member"
weight=2
+++

## 趣味
鈴木の会
  • content/member/nonomura.md
+++
age = 99
date = "2015-08-12T15:52:38+09:00"
name = "nonomura"
title = "nonomura"
weight=1
+++

## 趣味
趣味を書く

List layout

  • themes/hugo_theme_beg/layouts/indexes/member.html
{{ partial "default_head.html" . }}

<div class="member">
        {{ range .Data.Pages }}
        {{ .Render "li"}}
        {{ end }}
</div>

{{ partial "default_foot.html" . }}
  • themes/hugo_theme_beg/layouts/member/li.html
<article class="member">
    <header>
        <h1 class="member-title">
            <a href="{{ .Permalink }}">{{ .Date }} - w:{{ .Weight }} - {{ .Title }} - {{ .Params.name }}({{ .Params.age }})</a>
            <a href="{{ .Permalink }}" class="btn btn-default">
                READ ON
            </a>
        </h1>
    </header>
</article>
<hr>

Default(Weight, Date)

デフォルトのまま。

f:id:tbpg:20150812230948p:plain

Title

Titleでソートします

{{ partial "default_head.html" . }}

<div class="member">
        {{ range .Data.Pages.ByTitle }}
        {{ .Render "li"}}
        {{ end }}
</div>

{{ partial "default_foot.html" . }}

f:id:tbpg:20150812230948p:plain

Title(降順)

Titleの降順でソートします

{{ range .Data.Pages.ByTitle.Reverse }}
<li>
  <a href="{{ .Permalink }}">{{ .Title }}</a>
</li>
{{ end }}

f:id:tbpg:20150812230956p:plain

外部資料