section-templates.md (3494B)
1 ---
2 title: Section Page Templates
3 linktitle: Section Templates
4 description: Templates used for section pages are **lists** and therefore have all the variables and methods available to list pages.
5 date: 2017-02-01
6 publishdate: 2017-02-01
7 lastmod: 2017-02-01
8 categories: [templates]
9 keywords: [lists,sections,templates]
10 menu:
11 docs:
12 parent: "templates"
13 weight: 40
14 weight: 40
15 sections_weight: 40
16 draft: false
17 aliases: [/templates/sections/]
18 toc: true
19 ---
20
21 ## Add Content and Front Matter to Section Templates
22
23 To effectively leverage section page templates, you should first understand Hugo's [content organization](/content-management/organization/) and, specifically, the purpose of `_index.md` for adding content and front matter to section and other list pages.
24
25 ## Section Template Lookup Order
26
27 See [Template Lookup](/templates/lookup-order/).
28
29 ## Page Kinds
30
31 Every `Page` in Hugo has a `.Kind` attribute.
32
33 {{% page-kinds %}}
34
35 ## `.Site.GetPage` with Sections
36
37 `Kind` can easily be combined with the [`where` function][where] in your templates to create kind-specific lists of content. This method is ideal for creating lists, but there are times where you may want to fetch just the index page of a single section via the section's path.
38
39 The [`.GetPage` function][getpage] looks up an index page of a given `Kind` and `path`.
40
41 You can call `.Site.GetPage` with two arguments: `kind` (one of the valid values
42 of `Kind` from above) and `kind value`.
43
44 Examples:
45
46 - `{{ .Site.GetPage "section" "posts" }}`
47 - `{{ .Site.GetPage "page" "search" }}`
48
49 ## Example: Creating a Default Section Template
50
51 {{< code file="layouts/_default/section.html" download="section.html" >}}
52 {{ define "main" }}
53 <main>
54 {{ .Content }}
55 <ul class="contents">
56 {{ range .Paginator.Pages }}
57 <li>{{.Title}}
58 <div>
59 {{ partial "summary.html" . }}
60 </div>
61 </li>
62 {{ end }}
63 </ul>
64 {{ partial "pagination.html" . }}
65 </main>
66 {{ end }}
67 {{< /code >}}
68
69 ### Example: Using `.Site.GetPage`
70
71 The `.Site.GetPage` example that follows assumes the following project directory structure:
72
73 ```
74 .
75 └── content
76 ├── blog
77 │ ├── _index.md # "title: My Hugo Blog" in the front matter
78 │ ├── post-1.md
79 │ ├── post-2.md
80 │ └── post-3.md
81 └── events #Note there is no _index.md file in "events"
82 ├── event-1.md
83 └── event-2.md
84 ```
85
86 `.Site.GetPage` will return `nil` if no `_index.md` page is found. Therefore, if `content/blog/_index.md` does not exist, the template will output the section name:
87
88 ```
89 <h1>{{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }}</h1>
90 ```
91
92 Since `blog` has a section index page with front matter at `content/blog/_index.md`, the above code will return the following result:
93
94 ```
95 <h1>My Hugo Blog</h1>
96 ```
97
98 If we try the same code with the `events` section, however, Hugo will default to the section title because there is no `content/events/_index.md` from which to pull content and front matter:
99
100 ```
101 <h1>{{ with .Site.GetPage "section" "events" }}{{ .Title }}{{ end }}</h1>
102 ```
103
104 Which then returns the following:
105
106 ```
107 <h1>Events</h1>
108 ```
109
110
111 [contentorg]: /content-management/organization/
112 [getpage]: /functions/getpage/
113 [lists]: /templates/lists/
114 [lookup]: /templates/lookup-order/
115 [where]: /functions/where/
116 [sections]: /content-management/sections/