Hi there!
I’m working on this page: https://acecoachtraining.com/intensive/
All the one page menu items highlight correctly except for two:
“Chat” - none of the menu items get the x-currently-active class applied
“Register” - It applies to class for “Details” instead of applying it to “Register”
Can you help me track this down?
I’ll attach my credentials below.
Hi @blanchardjeremy,
Thank you for writing in, the Register to me goes to the correct section.
With regards to the Chat, you have multiple div with an ID of chat, it supposed to be unique for each page.
Please remove the ID chat to other section.
Hope it helps,
Cheers!
Thank you for the help with the Chat multiple ids!
For “register” it does go to the right section. But as you can see “details” is highlighted instead of “register”
Any suggestions for fixing that?
Thanks!
I also tried the fix of removing the second “chat” ID. And it still doesn’t work. Same problem as “register” … the .x-currently-active class isn’t being applied.
Hello @blanchardjeremy,
The “chat” id must be in the section that contains the global block. At the moment, the “chat” ID were added inside the global block. The ID must be relocated to the parent section container instead.
Please let us know how it goes.
Hmmm. That still isn’t working. I removed the global block entirely and it’s still not functioning properly. Any other ideas? Thank you!
Hi
The problem is that your page still has errors and unclosed tags and duplicate IDs here and there which is causing the issue that you are experiencing.
Please check the validation check that I performed on the URL you provided:
https://validator.w3.org/nu/?doc=https%3A%2F%2Facecoachtraining.com%2Fintensive%2F&checkerrorpages=yes
Ignore the Warnings, and try to fix the Errors such as unclosed tags and duplicate IDs. This is happening if you added custom HTML in the page and forgot to close the tag.
Few examples of the Error numbers that might be the problem cause:
54, 57, 62, 63, 66, 77.
I suggest that you add a new page and add sections with the same IDs that you have on the current page. And check if the menu works. If yes, then it shows there is some HTML problem on the page that you have.
Thank you.
@christopher.amirian - Thanks for your reply! I went ahead and fixed all the errors you highlighted. Which was a great thing to do no matter what!
However, the error is still occurring.
I think it goes without saying that it would work if I created a blank page with IDs. 
The question at hand is, what’s up with this page that’s causing the error.
Any ideas where I should look next?
I really appreciate your support!! 
Hey @blanchardjeremy,
I’m sorry but it’s currently hard to trace where the issue is coming from because there are lots of elements in the page. Would you mind saving your page as a template using the Template Manager then load the template in a test page?
In the test page, replace all the contents with Gap elements to create the page’s height while simplifying the page’s structure.
Please then give us your site’s WordPress Login URL, Username and Password in a Secure Note.
Thanks.
@christian_y - Thanks for your help!
I went ahead and setup this page as you instructed: https://acecoachtraining.com/mle-temp-page/#overview
You can find my username/password in the very first post in this thread.
Thanks!
Hello @blanchardjeremy,
In the new page, I went ahead and edited the page. I ended up swapping the chat and register section. The chat section should come first before the register section which should be the last section since it is also the order in your menu.
Please check it now.
Well hot dang! Thanks!!
Glad we could help.
Cheers!
Hmmm.
Well it doesn’t appear to be working on the actual page yet, so there is more to debug. Here is the live page with the original problem still: https://acecoachtraining.com/intensive/
Here is where it is working (all elements removed): https://acecoachtraining.com/mle-temp-page/
And here is my attempt to slowly remove elements to find the cause of the problem: https://acecoachtraining.com/mle-test-page-2/
Can you help me know the difference is between 1 and 2 so I can get the live page working?
Thanks!
Hello @blanchardjeremy,
I found out that you are using CloudFlare. Please log in to your CloudFlare account and purge your site cache. It is also helpful if you disable or turn on the Development mode so that all the latest changes will be loaded and not the cache version of your site.
Hope this helps. Please let us know how it goes.
Thanks for that idea!
The site is now in development mode.
It doesn’t appear that has changed anything. The problem I described in my last reply above is still the case.
Where could I look next?
Thanks so much for your support in tracking this down. It seems like we are very close!!
Hi @blanchardjeremy,
Ok after a thorough investigation of your page elements this buttons right here on your first section are the once that is causing the conflict.
I understand what you’re trying to do with those buttons, but unfortunately, that is not possible yet. I advise linking those buttons on a separate page instead or replace those with Content Area Modal element, as long as it has nothing to do with the scrolling menu your one-page navigation should work fine.
Have a nice weekend,
Cheers!
THAT DID IT!
I found a good workaround: I changed the href anchor links to be to IDs that were no in the one page navigation. I made other elements with IDs at the top of each section. so instead of linking to #chat (the ID of the section) I linked to #chatnow (the ID of an element at the top of the same section). Works like a charm.
What an odd bug. So glad you helped me track it down. Thank so much for all your time and support!
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.