hugo/docs/content/en/content-management/summaries.md

title	linkTitle	description	categories	keywords	menu	weight	toc	aliases
Content summaries	Summaries	Create and render content summaries.	content management	summaries abstracts read more	docs parent weight content-management 160	160	true	/content/summaries/ /content-management/content-summaries/

You can define a content summary manually, in front matter, or automatically. A manual content summary takes precedence over a front matter summary, and a front matter summary takes precedence over an automatic summary.

Review the comparison table below to understand the characteristics of each summary type.

Manual summary

Use a <!--more--> divider to indicate the end of the content summary. Hugo will not render the summary divider itself.

{{< code file=content/sample.md >}} +++ title: 'Example' date: 2024-05-26T09:10:33-07:00 +++

Thénardier was not mistaken. The man was sitting there, and letting Cosette get somewhat rested.

The inn-keeper walked round the brushwood and presented himself abruptly to the eyes of those whom he was in search of. {{< /code >}}

When using the Emacs Org Mode content format, use a # more divider to indicate the end of the content summary.

Front matter summary

Use front matter to define a summary independent of content.

{{< code file=content/sample.md >}} +++ title: 'Example' date: 2024-05-26T09:10:33-07:00 summary: 'Learn more about Les Misérables by Victor Hugo.' +++

Thénardier was not mistaken. The man was sitting there, and letting Cosette get somewhat rested. The inn-keeper walked round the brushwood and presented himself abruptly to the eyes of those whom he was in search of. {{< /code >}}

Automatic summary

If you have not defined the summary manually or in front matter, Hugo automatically defines the summary based on the summaryLength in your site configuration.

{{< code file=content/sample.md >}} +++ title: 'Example' date: 2024-05-26T09:10:33-07:00 +++

Thénardier was not mistaken. The man was sitting there, and letting Cosette get somewhat rested. The inn-keeper walked round the brushwood and presented himself abruptly to the eyes of those whom he was in search of. {{< /code >}}

For example, with a summaryLength of 10, the automatic summary will be:

Thénardier was not mistaken. The man was sitting there, and letting
Cosette get somewhat rested.

Note that the summaryLength is an approximate number of words.

Comparison

Each summary type has different characteristics:

Type	Precedence	Renders markdown	Renders shortcodes	Strips HTML tags	Wraps single lines with <p>
Manual	1	✔️	✔️	❌	✔️
Front matter	2	✔️	❌	❌	❌
Automatic	3	✔️	✔️	✔️	❌

Rendering

Render the summary in a template by calling the Summary method on a Page object.

{{ range site.RegularPages }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
  <div class="summary">
    {{ .Summary }}
    {{ if .Truncated }}
      <a href="{{ .RelPermalink }}">More ...</a>
    {{ end }}
  </div>
{{ end }}