Auto-highlighting the selected nav item?

Hello. Is there a way to make the page name in the navigation menu for the page you are on always be highlighted or bold? I am having to modify HTML file by file after exporting the site to do this now and would love for this to be set in Blocs somehow.

Thank you.

e.g.:

Nav1 Nav2 Nav3 Nav4 Nav5

Hi,

It’s not completely auto, but it’s not that difficult to make. The video below shows how to make it in Blocs 2, but it is the same in Blocs 3 as well.

Cheers,
Eldar

1 Like

That worked! Thank you. : )

I agree, this would be a really useful new feature. A navigation menu that shows the visitor in a visual way which page he/she is on is very user-friendly. I always did this in the past, but haven’t since working with blocs because it is just too time consuming to duplicate and edit the menu for every single page.

I agree that it would be nice to have this option, but I would say that using the method I provided above you don’t need to do this for every single page. You need to do that only for navigation items, and unless you have all of your pages in navigation menu, it is usually just a few pages.

Cheers,
Eldar

Hmm … why would I not have a page in the navigation?

Been playing around with the pseudo class “target”

#montana:target {
color:#ff0000;
}

Take a look at this test: https://vmedia.de/test/index.html

Then click on the link “MONTANA”’

There are some big drawbacks though:

  1. Since it uses the target tag, when the page is loaded, it scrolls to the target, which in this case, is the navigation. So it looks like the top of the page is a little bit cut off, because it scrolled down a few pixels when loaded.
  2. All your urls would look something like this: mypage.html#mytarget. It’s because of this drawback that I pretty much gave up on the idea.