I’m new to hugo and the content of my site has a couple of sections. I decided to include subsections to one of these new sections. I wanted to ask how to target a particular section to display a particular partial. Looking at what we have below I want the page to be displayed differently when in the blockchain subsection. The various pages in the subsection should be listed differently from how they are listed out when we are in the first-level sections. I want to use an if statement to target these particular sections to have them display differently but I think I am missing something because I keep getting errors. Please how do I achieve this?
Do you mean “a particular template” instead?
Do you mean “displayed differently” instead?
I am trying to figure out whether you want to render things differently on list pages, or on content pages, or both.
It would be easier to help you if you were to share your code. See:
Let us see your code
Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick
git cloneon your repo, then run
hugo serverin your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.
If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.
I think your simples approach would be to set a specific
cascade to match the sub section and all its pages and then create layout file(s) for that below
Here’s the code GitHub - Idadelveloper/inventory: UNICEF Open Source Inventory. A UNICEF Global Innovation knowledge base of best practices and resources for working and leading Open. and the theme is a submodule in the main repo. So here’s the theme’s repo (GitHub - Idadelveloper/inventory-hugo-theme: Theme used with UNICEF Open Source Inventory portal. Forked from Dot, a Hugo theme by ThemeFisher.). So currently I am trying to add a new section known as
cohorts which will have multiple subsections like
drones, etc. And in these subsections, we will have content files. There is already a standard way for listing out the content. You can see how it is displayed here (Documentation)
These new subsections I am trying to add take the same format so I am trying to figure out how I can target just these subsections and have them display differently.
content └── cohorts │├── blockchain ││ ├── _index.en.adoc ││ └── sample.en.adoc │├── drones ││ └── _index.en.adoc ││ └── sample.en.adoc │└──_index.en.adoc │ ├── communities │ └── _index.en.adoc │ └── sample.en.adoc │ ├── data └── _index.en.adoc └── sample.en.adoc
So the directory tree stucture will look somwhat like the above. I want to condition the list display of
drones different from the list display of
PS: I’m currently working on this nested section feature so it’s not yet in my repo.
Expanding upon bep’s answer…
[[cascade]] type = 'foo' [cascade._target] path = '/cohorts/*/**'
Then create the required/desired templates:
mkdir -p layouts/foo cp themes/inventory/layouts/_default/single.html layouts/foo/ cp themes/inventory/layouts/_default/list.html layouts/foo/
@jmooring for some weird reason
themes/inventory/layouts/_default/single.html instead of
I don’t know what I am missing…
Without seeing your code, neither do I.
Please update your repository with your most recent changes.
To add context for the look-and-feel we are going for, see the below screenshots. A Figma board we are working from with wireframes has more context too.
Splitting this up into two posts since I am a new user, and I can only embed a single image/screenshot into a post:
For the themes since it’s a submodule, my changes will go to the main repo here GitHub - Idadelveloper/inventory-hugo-theme at teams
I added a cohorts.html partial and that’s what I expected to be displayed. There’s an if condition there for the content pages which for now I expect to see an h3 title “About”. But like I earlier said it’s rather
themes/inventory/layouts/_default/single.html being used instead of
layouts/foo/single.html for the content pages (eg content/cohorts/blockchain/kotanipay.en.adoc)
I will also like to have the
cohorts.html partial be in the inventory repository and not in the themes repo since the themes repo is being utilized by another project and this particular change I am working on is specific to this project. How could I achieve this, please?
I did this:
git clone --recurse-submodules https://github.com/Idadelveloper/inventory/ cd inventory/ git checkout teams hugo
and got this:
Error: Error building site: failed to render pages: render of “section” failed: “/home/jmooring/temp/inventory/layouts/foo/list.html:3:3”: execute of template failed: template: foo/list.html:3:3: executing “main” at <partial “cohorts.html” .>: error calling partial: partial “cohorts.html” not found
- The “cohort” partial is missing. Perhaps it is in another branch.
- The “foo/list.html” template is called.
I also noticed that you set the
cascade values in both of these files:
It should only exist in config.toml.
Place it in the project’s
layouts/partials directory. Hugo will look in the themes/modules first, then in the project directory.
I placed the cascade values in the config.toml file initially and it did not work. That’s why I later placed them in
Yes, it did. Placing it in the site configuration file is sufficient.
It did not apply to files such as “content/cohorts/blockchain/grassroots.en.adoc” because you have already set the
type in front matter. The
cascade does not overwrite existing values.