I’m not sure you can help me because I can’t get links to pages/sectionIDs to work while in development mode (“page not found” errors) - although they work fine in my published website - but I thought I would try…
I have more than one scenario of the following and they all behave consistently: I have a page that I link to from the main menu. Accessing this page via the menu works fine and when accessed, the menu shows the current page as “current” (i.e., the menu item has a dark blue background). I also link to a section on this page via a link on the home page. Linking to the designated section on this page works fine - however the menu item for the current page doesn’t show as “current” - i.e., the dark blue background doesn’t display.
So, my problem is that when a page is accessed via a link to that page/sectionID, the menu item for that page doesn’t display the “current” attributes.
Specific example:
~ Select the “Your Leak” menu item: this displays the pool-repair-leak-questions-bucket-test.html page and the “Your Leak” menu item now has a dark blue background.
~ Go back to the home page; select the “Think your Swimming Pool is leaking? We can help!” link in the hero section. This displays the same pool-repair-leak-questions-bucket-test.html page, taking you directly to the Your Swimming Pool Leak section.
The only problem is that this time the “Your Leak” menu item does not have the dark blue background even though that page is the current page.
I think your problem could be in the using capital letters in the elements ID.
Different Servers handle capitalization differently
If your website is on a Windows server, then www.example.com/about will be handled exactly the same as www.example.com/About. The Windows server is case insensitive. If your website is hosted on Linux, then those two addresses will be seen as two different pages. That means that one will return the correct page, and the other will return a dead 404 page not found. So, if you originally host on a Windows server and move to a Linux server, you could be in for mass confusion and a lot of page errors for your users. Further, if you use capital letters for your URLs on a Linux server, users will get a dead page if they attempt to use all lowercase letters to access a page.
You have definitely helped me learn some things - and things I didn’t even know to ask about! And I will be changing the uppercase letters to lowercase.
But, putting any “page not found” errors aside…I still have the scenario where the menu item doesn’t show its “current” attribute(s) when the page is accessed via a link on another page; the page does display correctly - it’s just that the when the page is accessed via a link on a different page (instead of being accessed via the menu) the visual attributes of the menu item that represent the “current” page are not displayed. In my site, the “current” page’s menu item has a dark blue background with white letters. If you access the page via the menu, that page’s menu item shows with a dark blue background and white letters; if, however, you access the page via a link from another page, the page’s menu item doesn’t show as “current,” i.e., it shows the “non-current” attributes of a white background with dark blue letters. I hope that makes sense! (It’s a small, visual-only issue, but I would like to fix it if possible!)
Oookkk… I think I understood you. It is really weird
Let’s try to remove .html from links:
Example: /pool-repair-leak-questions-bucket-test.html#your-swimming-pool-leak-section
would become /pool-repair-leak-questions-bucket-test#your-swimming-pool-leak-section
Thanks for the suggestion! I did remove the .html (in that specific example you gave), but the result is the same: the menu item for the pool-repair-leak-questions-bucket-test page does not display its “current” attributes when accessed via the link from the home page.
It acts like whatever code is run when a page’s menu item is selected is not being run when that page is accessed via a link from another page - but I don’t know enough to know what that really means or how to fix it!
Hi @LPWebDes, I took a quick peek at the site, and the next thing I would check, is to remove the Transitions All styling on the Navigation Link class, I think that is interfering with the current class on the navbar, see my screenshot:
Thank you for the suggestion! (FYI: Your video of how to remove the Transition was very helpful!) I removed the Transition, but unfortunately, that didn’t change anything! Any other suggestions?