Organizing Content, Navigation for flat URLs

support
,
1

Hello everyone,
until now searching for docs and this forum was helpful enough to avoid asking anything specific. Now I think I’ve hit the wall.

Here is how my content has been organized until now:

content
     └──industryAA
          └── _index.de.md
          └── _index.en.md
          └── _index.fr.md
     └──industryAB
          └── _index.de.md
          └── _index.en.md
          └── _index.fr.md
     └──industryAC
          └── _index.de.md
          └── _index.en.md
          └── _index.fr.md

All of those sections had flat urls, like .../industry-aa, .../industry-ab, etc. With a url and aliases in frontmatter of the _index.de.md I was even able to create translated urls, like .../de/branche-aa instead of ../de/industry-a.

Those pages have been configured in config.toml as a part of navigation, like

[[languages.de.menu.industries]]
   name = "Branche AA"
   weight = 100
   url = "de/branche-aa"

So far so good.

Now I’ve added a new page, Industries (just like any other of those pages), having the URL like .../industriesor .../de/branchen, added it to the main navigation and now I need to make those industryA[X] pages to act like children of the new Industries page, while keeping their flat URLs intact. “Children” meaning that when navigating to those flat URLs, defined within every industry page, the main navigation should highlight the parent (“Industries”). I’d also would be glad to organize the content differently, so all those single industry folders are within the “industries” folder of the parent section.

content
     └──industries (url: /industries)
          └── _index.de.md
          └── _index.en.md
          └── _index.fr.md
          └── industryAA (url: /industryAA)
                └── _index.de.md
                └── _index.en.md
                └── _index.fr.md
          └── industryAB
                └── _index.de.md
                └── _index.en.md
                └── _index.fr.md
          └── industryAC
                └── _index.de.md
                └── _index.en.md
                └── _index.fr.md

Any ideas would help.

2

Just in case you feel limited by the search dropdown I get better results with “gohugo search term or string” on Google. I think the search shows not enough results sometimes or links to the same result. With gohugo as search term you will mostly always hit the docs in the first results.

about your question:

What you describe sounds to me more like a taxonomy. Fruits: apples, pears… something like this? You could define industry: industries under the taxonomies section of the config and then you can have a structure like content/industries/industryAA and use filters and links for taxonomies.

Which basically sounds like your new setup, so I am not sure if there is any issue. What’s the question?

if it’s just about highlighting the main navigation item if a subitem is loaded, then have a look at this:

.Parent might be the one you are looking for: “if the current pages parent is taxonomies then mark this menu item active”.

3

Is industryAA a section or a single page?

4

It’s a single page. I hope. Or not? Now I am lost.
This is how I select the content in the template:

{{ with .Site.GetPage "section" "industries/industryAA/hero" }}

This is how my content for Industry AA looks like:


content
   └──industries
      └── _index.de.md
      └── _index.en.md
      └── _index.fr.md
      └──industryAA
          └── hero
              └── _index.de.md
              └── _index.en.md
              └── _index.fr.md
          └── _index.de.md
          └── _index.en.md
          └── _index.fr.md

This is the contents of the content/industries/industryAA/_index.de.md

---
title: "Branche AA"
date: 2017-11-21T21:28:43+01:00
description: ""
keywords: ""
draft: false
layout: single
url: branche-aa
aliases:
- industry-aa
---

and this is the content/industries/industryAA/hero/_index.de.md

---
title: "Branche AA Headline"
date: 2017-11-21T21:28:43+01:00
draft: false
headless: true
featured_image: "branche-aa.png"
---
5

davidsneighbour would I be able to use flat URLs with such taxonomies? This is critical.

6

I think that is where I don’t get you. What is a flat URL? /industries/industryAA? then yes.

7

davidsneighbour
nope, I mean this kind of URL structure:

/industries
/industryAA
/industryAB

basically, the top-level

8

Have a look at frontmatter url here:

You can force your site to have any url for any page where ever it is by declaring it in the frontmatter.

9

davidsneighbour
This is what I use (see code sample above). The problem I have is that instead of the page defined in
content/industries/industryAA with the URL /industryAA it shows the page defined in content/industries which has its own (different) url parameter – /industries.

So basically, I’ve moved all the old content within content/industries folder, haven’t changed a thing – and it is broken, as it shows the same page for every URL defined within those folders. And of course the navigation is not highlighting the main navigation item (why would it):

{{ $currentPage := . }}
{{- range .Site.Menus.main -}}
<li {{ if $currentPage.IsMenuCurrent "main" . }}class="selected"{{ end }}><a href="{{ .URL | absLangURL }}">{{ .Name | markdownify }}</a></li>
{{ end -}}
10

as soon as I’ve added

type: industry-aa

in the frontmatter, it started showing the correct page, as expected. O_o
Now let’s see how to tweak the navigation…

11

Perhaps I’m not seeing enough of the site structure to understand this completely, but if a directory represents a single page, its “index” file should be named index.md instead of _index.md. That would allow you set the URLs in site configuration with permalinks instead of setting the url parameter in the front matter of each page.

The difference between index.md and _index.md is described here:
https://gohugo.io/content-management/page-bundles

Additionally, if you are defining the menu in your site configuration, use pageRef instead of url for the menu entries that point to internal pages. This will allow you to leverage the .IsMenuCurrent and .HasMenuCurrent methods.

1 Like