My site is pretty much ‘all blog’, so I’ve not bothered with organising my content into a “posts” subdirectory, or anything like that [So I can keep the URLs that wee bit shorter]. However, I would like to add a static “About” page and I’m wondering how to go about this.
At the minute I’ve got type="post" in the front-matter of all the blog posts and type="staticpage" in the front-matter of the About page. I’m not quite clear on how:
I filter out the ‘About’ page so it doesn’t show up on the index page in amongst the list of blog posts. Some template code needed for the index to only list pages where type="post"
Populate my navigation menu with only links to pages [or in this case a solitary page] where type="staticpage"
I know the ‘conventional’ way to do it would be to have ‘posts’ and ‘about’ subdirectories, but it seems a bit clunky to have to lengthen every URL on my site with an extra /posts/ element, just for the sake of adding one extra ‘About’ page.
Can anyone help me with some necessary template code magic?
I’ve just noticed that this seems to have broken, since upgrading to the latest version of Hugo with the ‘Paginator’ function.
Where before, in my index.html template, I had:
{{ range where .Data.Pages "Type" "post" }}
working to filter out my static page, so it was not listed amongst the blog entries, the equivalent code with the new paginator function isn’t working:
The paginator seems to be taking no notice of the type=..." in the front matter and is listing my static page alongside the blog posts, even though its type is set to type="staticpage" rather than post.
As I implemented the paginator thingy, I suggest you are doing something wrong
My best guess is that you access the .Pagiantor or .Paginate earlier in the template chain (by including the paginator.html partial, maybe?). The paginator is static (one per Node) and the first will win, so to speak.
Have you remembered to set your ‘About’ page to be a type which isn’t 'post" in its frontmatter?
Here’s what I’ve currently got and it works fine:
example frontmatter for blog post:
+++
date = "2015-08-04T09:50:25+01:00"
mdrbyeline = "A change of [virtual] scenery"
mdrpagetype = "blogpage"
mdrposticon = "/icons/cogs.png"
tags = ["frankfurt","germany","deutschland","linode","server","datacentre"]
title = "Ich Bin Ein Frankfurter!"
type = "post"
+++
frontmatter for ‘About’ page:
+++
date = "2015-01-01T17:00:51Z"
type = "staticpage"
mdrbyeline = ""
tags = [""]
title = "About"
+++
list view temple: themes/mytheme/layouts/_default/list.html
{{ template "theme/partials/header.html" . }}
<body>
{{"<!-- index layout //-->" | safeHTML}}
{{"<!-- begin [banner] header //-->" | safeHTML}}
<header class="banner">
{{"<!-- begin [banner] navbar //-->" | safeHTML}}
<div class="navbar">
{{ template "theme/partials/navbar.html" . }}
</div>
{{"<!-- end [banner] navbar //-->" | safeHTML}}
<a href="{{ .Site.BaseURL }}">
<img src="{{ .Site.BaseURL }}/grafix/themsgoodbrothlogo.png" />
</a>
</header>
{{"<!-- end [banner] header //-->" | safeHTML}}
{{ $paginator := .Paginate (where .Data.Pages "Type" "post") }}
<div class="paginatorheading">Page {{ .Paginator.PageNumber }} of {{ .Paginator.TotalPages }}</div>
{{"<!-- begin main //-->" | safeHTML}}
<main class="indexpage">
{{ range $paginator.Pages }}
{{"<!-- begin main > article //-->" | safeHTML}}
<article class="indexpage">
{{"<!-- begin main > article > header //-->" | safeHTML}}
<header>
<a href="{{ .Permalink }}">{{title .Title }}</a> <div class="headerpostdate">{{.Date.Format "02 Jan 2006"}}</div>
</header>
{{"<!-- end main > article > header //-->" | safeHTML}}
{{"<!-- Posticon. Show one if defined //-->" | safeHTML}}
<div class="posticon">
{{ if isset .Params "mdrposticon" }}
<img src="{{.Params.mdrposticon }}" />
{{"<!-- Posticon. Otherwise show default //-->" | safeHTML}}
{{ else }}
<img src="/icons/default.png" />
{{ end }}
</div>
{{"<!-- begin main > article > summary //-->" | safeHTML}}
{{ .Summary }}...
<span class="readmore">[ <a href="{{ .Permalink }}">Read More</a> ]</span>
{{"<!-- end main > article > summary //-->" | safeHTML}}
<div class="clearing"></div>
</article>
{{"<!-- end main > article //-->" | safeHTML}}
{{ end }}
{{ template "theme/partials/pagination.html" . }}
</main>
{{"<!-- end main //-->" | safeHTML}}
{{ template "theme/partials/footer.html" . }}
</body>
</html>
That’s weird. On the face of it, you seem to have the exact same setup as me. But it’s working fine on mine.
Now I come to think of it though, I seem to remember it breaking once a while back, but I can’t for the life of me remember what the cause was… possibly a Hugo update, or something I did while tweaking the template.
I’ll have a look back through my git history and see if there’s anything in the commit messages that might shed light on it. If so, I’ll get back to you.
I didn’t find anything in my git history to remind me what I broke/fixed when wrestling with this before, but I’ve just noticed something that might shed some light on it.
When you view your site’s frontpage, the template in:
themes/yourtheme/layouts/index.html
is used.
When you view a list of related posts, for example by clicking on a tag to see all posts with that tag, the template used is the one in
themes/yourtheme/layouts/_default/list.html
So you actually have two template files producing ‘list of posts’ type pages. you’d need to make sure that you had your static page excluding code in both. In fact, the snippets I posted above might have been misleading, since I gave you what was in my themes/yourtheme/layouts/_default/list.html rather than my ```themes/yourtheme/layouts/index.html file –even though both are essentially the same in my theme.
Now that I come to think of it, that may have been the gotcha I ran into that I’ve been trying to remember. I think I had just changed one of the templates and was puzzled that sometimes my static page showed up and sometimes it didn’t –because I mistakenly thought any kind of page which gave listings of posts used the same template.
As regards this:
when I moved both files (li.html, list.html) from theme directory to local layout directory, any idea why?
I’d imagine that it’s to do with how Hugo prioritises generic templates vs theme templates [or vice versa] but it would need someone better versed in Hugo’s internals to say for sure.
This was a problem with priority when rendering a home page,. The template that I use is also listing posts on the home page so I had to apply this change in index.html file as well.
With your help I managed to exclude static pages from pagination on the pages where all the excerpts are shown. But they are still paginated when you have opened a single blog post at the bottom (navigating to newer or older posts).
Example:
On https://blog.mdosch.de/ the static page https://blog.mdosch.de/chat/ is not shown (although it would be the second latest created) so it works so far.
But when you open same_domain_only_two_links_allowed/2017/11/20/testweise-umstellung-auf-hugo/ it links to the chat static page and not to the next older blog post.
I added the checking for Type=Post almost everywhere now where it could have an impact but now I don’t know anymore what else to try.
Blog posts are in content/post and static pages are in content/page.
