コンテンツサマリー

Hugo はコンテンツの要約 (サマリー) を生成します。

On this page

.Summary ページ変数を使用すると、Hugo はコンテンツのサマリーを生成し、サマリービューで短縮版として使用することができます。

サマリー分割のオプション

自動サマリー分割
手動サマリー分割
フロントマターサマリー

サマリー (要約) にオリジナルのコンテンツへのリンクを付けるのは自然なことで、このリンクを「続きを読む…」(“Read More …”) ボタンの形で表示するのが一般的なデザインパターンとなっています。詳細は、RelPermalink、.Permalink、.Truncated ページ変数を参照してください。

自動サマリー分割

デフォルトでは、Hugo はコンテンツの最初の 70 語を要約として自動的に取得し、テンプレートで使用するために .Summary ページ変数に保存します。サマリーの長さは、サイト設定で summaryLength を設定することでカスタマイズできます。

手動サマリー分割

あるいは、記事を分割したい場所に <!--more-> という要約区切り文字を追加することもできます。

Org モードのコンテンツの場合、記事を分割したいところで # more を使います。

要約区切り文字の前に来るコンテンツは、そのコンテンツのサマリーとして使用され、すべての HTML フォーマットをそのままに .Summary ページ変数に保存されます。

長所: 自由で正確、そしてレンダリングの向上。すべての HTML タグと書式は保持されます。
短所: コンテンツ作成者は、各コンテンツファイルに <!--more-> (または、org コンテンツには # more) を追加することを覚えなければならないので、余計な仕事が増えることになります。これは、アーキタイプのフロントマターの下に要約区切り文字を追加することで自動化することができます。

フロントマターサマリー

要約を、記事の冒頭のテキスト以外のものにしたい場合があります。この場合、記事のフロントマターの summary 変数に別の要約を指定できます。

長所: 記事の内容に依存しない完全なテキストの自由度があります。サマリー内でマークアップが使用できます。
短所: コンテンツ作成者は、記事の要約として完全に別のテキストを書く必要があるため、追加の作業が必要です。

サマリー選択順序

要約を指定する方法は複数あるため、.Summary が返すテキストを決定する際に、Hugo が従う選択の順序を理解しておくと便利です。それは以下のとおりです。

記事の中に <!--more-> 要約区切り文字がある場合、区切りまでのテキストは手動サマリー分割方式に準じて提供されます。
記事のフロントマターの中に summary 変数がある場合、その変数の値はフロントマターのサマリーメソッドに従って提供されます。
記事冒頭のテキストは、自動サマリー分割方式で提供されます

例: 要約付きの最初の 10 件の記事

以下のコードで、コンテンツのサマリーを表示できます。たとえば、セクションテンプレートの中で、以下のスニペットを使うことができます。

page-list-with-summaries.html

{{ range first 10 .Pages }}
    <article>
      <!-- this <div> includes the title summary -->
      <div>
        <h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
        {{ .Summary }}
      </div>
      {{ if .Truncated }}
      <!-- This <div> includes a read more link, but only if the summary is truncated... -->
      <div>
        <a href="{{ .RelPermalink }}">Read More…</a>
      </div>
      {{ end }}
    </article>
{{ end }}

ブール変数 .Truncated を使って、コンテンツが切り捨てられないとき、つまり、要約が記事全体を含んでいるときに、「続きを読む…」(“Read More …”) リンクを隠すことができることに注意してください。