hugo/docs/content/layout/views.md

2.5 KiB

title date groups groups_weight
Content Views 2013-07-01
layout
70

In addition to the single content view, Hugo can render alternative views of your content. These are especially useful in index templates.

To create a new view simple create a template in each of your different content type directories with the view name. In the following example we have created a "li" view and a "summary" view for our two content types of post and project. As you can see these sit next to the single content view template "single.html"

▾ layouts/
  ▾ post/
      li.html
      single.html
      summary.html
  ▾ project/
      li.html
      single.html
      summary.html

Hugo also has support for a default content template to be used in the event that a specific template has not been provided for that type. The default type works the same as the other types but the directory must be called "_default". Content views can also be defined in the "_default" directory.

▾ layouts/
  ▾ _default/
      li.html
      single.html
      summary.html

Hugo will pass the entire page object to the view template. See page variables for a complete list.

Example li.html

This content template is used for spf13.com.

{{% highlight html %}}

  • {{ .Title }}
    {{ .Date.Format "Mon, Jan 2, 2006" }}
  • {{% /highlight %}}

    Example summary.html

    This content template is used for spf13.com.

    {{% highlight html %}}

    {{ .Title }}

    {{ .Date.Format "Mon, Jan 2, 2006" }} - {{ .FuzzyWordCount }} Words

    {{ .Summary }}

    Read more →
    {{% /highlight %}}

    Example render of view

    Using the summary view inside of another (index) template.

    {{% highlight html %}}

    {{ .Title }}

    {{ range .Data.Pages }} {{ .Render "summary"}} {{ end }}
    {{% /highlight %}}

    In the above example you will notice that we have called .Render and passed in which view to render the content with. Render is a special function available on a content which tells the content to render itself with the provided view template.