Custom layout trouble

Hi,

I have a very simple site (or so I thought) with nothing but posts. Posts are tagged - tags work fine. My site uses the Beautiful Hugo theme, and that’s fine, too.

Then I added votes, so I can rank posts (stories I call them) by popularity. Votes are quite crude at present - an html form is captured by an external service, I get an email, I edit params in front matter. Suits me for now - not the problem.

My problem is with the custom layout for the listing by popularity.

Following the solution to this question, I created a page content file: popularstories.md, which specifies layout: popular in its front matter (but has no content).

Then I created layouts/-default/popular.html, which should collect all the pages and sort them by vote ranking. I know this layout works, because I used this excellent solution, and tried it as the default list.html.

But I can’t get it to work as a custom layout.

I have hugo installed locally, and I can see that hugo builds a directory called popularstories - which I have pointed a menu item at - but there is nothing there (although the paginated files are built! - I can see them if I build a local ‘public’ set of files). I tried a lot of things…

Anyway, I have made a nice dummy version of the site in a public repo on gitlab with some sample posts.

So rather than try to explain lots of stuff which might be irrelevant, I’ll hope to be asked some questions!

Thanks for reading.

I assume you want completely specific layout template without inheriting structure from themes/beautifulhugo/layouts/_default/baseof.html , because you write all those html doc header

<!doctype html> 
  ...  etc..

you need to remove all the {{ define <name> }} ... {{ end }} wrap inside layouts/_default/popular.html.

BTW, op writes the repo clone url link, somehow it doesnt work. (Maybe new user limited-features??).
Here’s the link for anyone want to check:

Thanks @pamubay

I think I’ve done what you suggest with popular.html.

But I’ve broken something which makes hugo refuse to build with a paginator error message:

Error: Error building site : failed to render pages: render of “page” failed: “/Users/pro/gitla/writersitedummy/layouts/_default/popular.html:40:29” : execute of template failed: template: _default/popular.html:40:29: executing “_default/popular.html” at <(.Paginate $p).Pages>: error calling Pages: runtime error: invalid memory address or nil pointer dereference

In case it adds light, Netlify’s version of that error message is:

1:39:27 PM: Error: Error building site: failed to render pages: render of “page” failed: “/opt/build/repo/layouts/_default/popular.html:40:16”: execute of template failed: template: _default/popular.html:40:16: executing “_default/popular.html” at <.Paginate>: error calling Paginate: Paginators not supported for pages of type “page” (“Popular Stories”)

My guess from this was that Paginator only wants to sort ‘post’ type pages. So I tried adding (where .Site.RegularPages "Section" "post") into the code that builds the sorted list. But that doesn’t seem to make any difference.

Any suggestions?

It’s because Paginator/Pagination is List Page-only features.

.Paginator is provided to help you build a pager menu. This feature is currently only supported on homepage and list pages (i.e., taxonomies and section lists).

Pagination Documentation


currently content/page/PopularStories.md is a Regular Page

You need to convert it into List Page by turning it in to Branch Bundle like this:

.
└─ content/
    └─ page/
        └─ PopularStories/
            └─ _index.md
1 Like

That did it!

Thank you so much!

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.