<header><h1id="tag_Multiple Index Pages in Hugo">Multiple Index Pages in Hugo</h1></header>
<article>
<divstyle="text-align: center;">
<h2id="this-is-how-to-create-multiple-index-pages-in-hugo">This is how to create multiple index pages in Hugo</h2>
</div>
<p>I wanted to order <ahref="/hackbook">Hackbook</a> in reverse (i.e. oldest to newest) so that it’s easier for the reader to start at the correct page.</p>
<p>I ran into the following problem - the default <strong><code>list.html</code></strong> does them from newest to oldest.</p>
<p>So I found <ahref="https://discourse.gohugo.io/t/two-home-pages/31312/9">this forum post</a> and I created a file in the <strong><code>_default</code></strong> directory as follows:</p>
<pretabindex="0"><code>layouts
|----**_default**
|-------**hackbook**
|-----------**order-by-oldest.html**
|-------baseof.html
|-------index.html
|-------list.html
|-------single.html
</code></pre>
<figure><imgsrc="/img/custom-index-directory.PNG"alt="Picture of the directory"></figure>
<p>I named my file order by oldest because I plan on reusing it in other places. This is what’s contained inside it:</p>
{{- range .Param "authors" }} by {{ . }}{{ end -}}
{{ end -}}
</li>
{{- end }}
</ul>
{{- end }}
</code></pre><h4id="if-you-want-to-display-the-date-on-the-left-of-the-titles-you-have-to-add-datesinlisttrue-in-your-configtoml-or-datesinlist-true-in-your-configyaml">if you want to display the date on the left of the titles, you have to add <strong><code>datesinlist=true</code></strong> in your config.toml or <strong><code>datesinlist: true</code></strong> in your config.yaml</h4>
<h5id="you-probably-dont-need-enablegitinfo--true-as-that-will-crash-your-website-i-have-no-idea-what-it-does-you-dont-need-it">You probably don’t need <strong><code>enableGitInfo = true</code></strong> as that will crash your website, I have no idea what it does, you don’t need it.</h5>
<divstyle="text-align: center;">
<h2id="using-your-custom-_indexhtml">Using your custom _index.html</h2>
</div>
<p>After creating your custom _index.html you’d use it as follows:</p>
<ol>
<li>Create an _index.md file in your desired directory</li>
<li>Add <strong><code>layout: "hackbook/order-by-oldest"</code></strong> to your preamble (if you named your folder and or file something else, you have to change it here)</li>
</ol>
<figure><imgsrc="/img/layout-custom-index.PNG"alt="Picture of the layout in the preamble"></figure>
<p>And now you should have a custom _index.html for your pages! :)</p>
<p>Here is a verbose copy paste of the original hugo forum answer in case it gets deleted:</p>
<pretabindex="0"><code>Content structure:
content
├── better
│ └── _index.md
├── post
│ ├── post-1.md
│ ├── post-2.md
│ └── post-3.md
└── _index.md
content/better/_index.md
+++
title = "Better"
date = 2021-03-04T17:02:42-08:00
draft = false
type = "post"
layout = "posts-by-lastmod"
+++
Template structure:
layouts
├── _default
│ ├── baseof.html
│ ├── list.html
│ └── single.html
├── post
│ └── posts-by-lastmod.html
└── index.html
layouts/post/posts-by-lastmod.html
{{ define "main" }}
{{ .Content }}
{{ range (where .Site.RegularPages "Type""post").ByLastmod.Reverse }}
<ahref="https://vodoraslo.xyz/">Homepage</a><br><br><ahref="/index.xml"><imgsrc="/rss.svg"style="max-height:1.5em"alt="RSS Feed"title="Subscribe via RSS for updates."></a>