The presence of a content/index.html file makes a menu item incorrect

hugo env:
hugo v0.126.2+extended linux/amd64 BuildDate=2024-07-18T00:00:00+00:00 VendorInfo=Fedora:0.126.2-3.fc41
GOOS=“linux”
GOARCH=“amd64”
GOVERSION=“go1.23rc1”
github.com/sass/libsass=“3.6.5”
github.com/webmproject/libwebp=“v1.3.2”

Hello, I am using Hugo on a local server. I am using what I call the “built-in” theme created using:

hugo new theme

In the site’s hugo.toml I have:

[menus]
  [[menus.main]]
    name = 'Home'
    pageRef = '/'
    weight = 10
  [[menus.main]]
    name = 'Articles'
    pageRef = '/passwords/articles/'
    weight = 20

And this creates the 2 menu items correctly, ie the Articles URL is:

<li>
       <a href="/passwords/articles/">Articles</a>
</li>

When I create an empty index.html in the site’s content folder, in order to create the content for a home page, this Articles link changes to:

<li>
       <a>Articles</a>
</li>

IE the URL is removed from the Articles anchor tag and menu item.

I have tried having and not having _index.html in the /content/passwords/articles/ directory and this does not seem to make a difference.

I put in the site’s hugo.toml:

[menus]
  [[menus.main]]
    name = 'Home'
    pageRef = '/'
    weight = 10

and

menus = ‘main’

in _index.html in the /content/passwords/articles/ directory to create a menu item for this section instead, but this uses the title parameter for the menu item and this title is too long for the menu item. (I need the title parameter to be multi-word to define the title of the list page).

I also tried

menus = ‘main’
name = ‘Articles’

as per

and this did not display the menu item. IE it seemed like the name parameter did not work.

However, I tried the same above again today, and no menu item shows up, with or without using the name parameter. It seems I am getting different results trying the same thing.

I have spent hours trying to figure this out, and have had no luck.

I have searched the net and Hugo forum as well and have not found any relevant posts.

Any help on this would be much appreciated. Thank ahead of time.

sounds like theres some config or layout problems with your setup

snippets won’t help. to much effort to guess what’s all set.

mind to share your repo?

1 Like

It must be named _index.html, and it must have front matter.

1 Like

@irkode - Thanks very much for your reply. I am a retired engineer and so not an IT guy nor a web developer and so I am a little embarrased to say that I do not understand git (I have tried) and so I just develop locally and intend to upload to a webhosting platform using rsync. So I am not able to share my repo unfortunately.

@jmooring - Thanks once again for taking the time to help out. I put _index.html with:

+++
date = 2024-02-02T04:14:54-08:00
draft = false
title = ‘Example’
weight = 10
+++

HHHH

in it and the HHHH is displayed on the front page with a list of pages below.

However the same issue occurs:

<li>
       <a>Articles</a>
</li>

IE the URL is lacking in the anchor.

I was under the impression though that _index.html can be used to modify the output of list.html, but index.html could be used to create content without the list.html template being used, Am I mistaken about this?

I am going to create a fresh site and theme and go thru the steps to try to recreate this issue and see where it may happen…

Yes.

Good idea.

1 Like

I was able to reproduce this issue in a few steps - not to imply that it is a bug, I may be doing something wrong…

hugo new site menuissuetestsite

hugo new theme menu-issue-test-theme

In site’s hugo.toml:

baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'menu-issue-test-theme'

[menus]
  [[menus.main]]
    name = 'Home'
    pageRef = '/'
    weight = 10
  [[menus.main]]
    name = 'Articles'
    pageRef = '/passwords/articles/'
    weight = 20

This does display an Articles menu item but with the same issue:

<li>
       <a>Articles</a>
</li>

IE the URL is removed from the Articles anchor tag and menu item, which is my issue.

I thought maybe the menu item link would only be correct if I actually had content there so I created:

/menuissuetestsite/content/passwords/articles/

in there put:

hugo_markdown_file_with_sample_front_matter.md

containing:

+++
date = 2024-02-02T04:14:54-08:00
draft = false
title = 'Example'
weight = 10
+++

Hello

I then restarted the server and this did not create a correct Articles menu item.

Just to make sure, I went to:

http://localhost:1313/passwords/articles/hugo_markdown_file_with_sample_front_matter/

and this page is displayed.

Also this page is displayed in the list of pages on the home page, and I can click on its title to view that page.

But still the Articles menu item is:

<li>
       <a>Articles</a>
</li>

IE the URL is removed from the Articles anchor tag and menu item, which is my issue.

Does /passwords/articles/ actually exist?

1 Like

@jmooring - Good question :slight_smile: I was adding that point to my post as you wrote yours :slight_smile: Please see my previous post that describes what I did…

Right, so to answer my question, a page with the logical path /passwords/articles does not exist. Your menu entry points a section, not to a page.

You want this:

content/
└── passwords/
    └── articles/
        ├── _index.md
        └── hugo_markdown_file_with_sample_front_matter.md
1 Like

@jmooring - Thank you for pointing out that there needs to be an _index.html file in the section, in order for the menu item to work. This fixed the issue :slight_smile:
Moreover, it fixed the issue in the original site that I was having the issue with :slight_smile:
I did not understand that this was mandatory - I very much appreciate you helping me out once again and for helping me learn more about Hugo

1 Like

If you dont mind, I would just like to make sure I understand re using _index.html vs index.html in the /content folder.

If I use eg:

+++
date = 2024-02-02T04:14:54-08:00
draft = false
title = ‘’
weight = 10
+++
Front page _index.html

If I use _index.html, the home page shows the contents of this file (Front page _index.html) and then a list of posts and pages.

If I rename it to index.html, then the home page shows just the content of the file, which I what I want, in order to create a full front landing page. IE using index.html does work.

But my impression is that you are saying index.html cannot be used? Could you please clarify? If index.html cannot be used, is there another way to create a home page that does not list the site’s posts and pages?

The home page, regardless of what you want it to render, must be named content/_index.foo where foo is one of md, html, adoc, org, rst, or pdc depending on content format.

If you don’t want the home page to render a list of pages, remove the corresponding code from the home page template.

1 Like

Got it, thanks very much for your great support :slight_smile:

1 Like

Part of the confusion on my part is that there are 3rd party eg vids on Youtube saying that one can use index.html…

I’m not a big fan of alternate facts.

1 Like

LOL - Thats a good way of putting it :slight_smile: I will be more discretionary…

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