Tags: Hugo

Zenn の記事へのリンクを RSS から取得して表示する

Zenn の記事へのリンクを RSS から取得し、通常の記事と混ぜてトップページに表示する。

今回は

  • 通常の記事 5件
  • Zenn の最新記事 5件

を公開日時降順で並べてトップページに表示する。

そのために、まず同じ構造の Dictionary に通常の記事と Zenn の最新記事を詰める。

Zenn の RSS からデータを取得するには resources.GetRemote を使う。
取得した記事の公開日時は time.AsTime に通すことによって Time 型に変換でき、Format 関数を使うことができるようになる。

{{ $data := slice }}

<!-- 通常の記事を取得して Dictionary に詰める -->
{{ $paginator := .Paginate (where .Site.RegularPages "Section" "posts") 5 }}
{{ range $paginator.Pages }}
    {{ $data = $data | append (dict "Title" .Title "Summary" .Summary "RelPermalink" .RelPermalink "Date" .Params.Date "Params" .Params)}}
{{ end }}

<!-- Zenn の RSS の内容を Dictionary に詰める -->
{{ with resources.GetRemote "https://zenn.dev/k1350/feed" | transform.Unmarshal }}
    {{ range first 5 .channel.item }}
        {{ $date := (time.AsTime .pubDate) }}
        {{ $data = $data | append (dict "Title" .title "Summary" .description "RelPermalink" .link "Date" $date "Params" (dict "Date" $date "IsZenn" true)) }}
    {{ end }}
{{ end }}

データを詰めたら range sort で日付降順の並べ替えを行い、データを表示する。
同一の構造のデータにしたことにより同一の partial を使って簡潔に書くことができる。

<section class="ListMainSection">
    <!-- 通常の記事の .Params.Date を .Date にもコピーしたのは、ここでソートに使うため -->
    {{ range sort $data "Date" "desc" }}
        {{ partial "baseof/summary.html" . }}
    {{ end }}
</section>

注意点として、resources.GetRemote の結果はキャッシュされる。
caches.getresource のデフォルト値ではキャッシュの保存期間が無限であるため、キャッシュが残っているマシンでビルドを実行した場合、RSS 側が更新されてもデータの更新が行われなくなる。
よって特にローカル環境では maxAge の調整をしたほうがいい。

https://gohugo.io/getting-started/configuration/#configure-file-caches

以上