Page jump when linking to accordion item via ID

[scwfit]

Hello,

I have a website that uses accordions extensively, and I’d like to be able to link to the individual items. I’ve been able to do this successfully via the accordion item ID (example: https://scwfit.com/dc/friday/#FR2A)

However, I’m using a fixed top menu, and when I link directly to the accordion item, it jumps to the very top of the browser window and gets completely obscured by the menu.

Is there any way to force it to jump to the base of the menu instead so the accordion item is actually visible? Or is my only option to use a static menu?

Thanks in advance!

[alexander]

Hi @carlyas,

May I ask what browser you’re using? I’ve checked your site, and on all screen sizes the accordion sits either at the top of the screen, or right under the navigation. X is designed to account for the fixed header when using anchor navigation like that.

A brief aside, you may also be interested in the “Toggle Hash” feature. If you Inspect the Accordion Item you will find this setting on the Customize tab. Set the toggle hash to FR2A (matching the ID) and it will automatically open that accordion item for you. This allow for deep linking from other pages to specific accordion items.

[scwfit]

Hi,

When I tested in Chrome originally, for me it jumped to the top of the screen underneath the menu. I was logged in and it seems like the WP admin bar also affects it somewhat, but I guess I’m not too worried about that because it’s not an experience our customers would have. I just tested it again in Chrome logged out, and I see that it eventually shows up under the menu, but it jumps to the top of the screen first and then jumps again below the menu after a bit of a lag. The lag was long enough that I didn’t notice the correction the first time.

I just tested in Firefox and there too it jumps to the top of the screen and then corrects itself, but the lag was much less than in Chrome. Safari works properly

Toggle Hash sounds perfect for our needs so thank you for the suggestion! Unfortunately I inherited the site built in page builder rather than Cornerstone, so I don’t think I have the Toggle Hash feature available, unless I’m just not seeing it?

[alexander]

That makes sense - I wasn’t seeing that since it was loading fast enough, but I it would make sense that it was a delayed “snap” back into place. Regretfully, there isn’t much we can do at the theme level to address this. Reducing the amount of content would help, or using page caching and maybe even faster hosting to reduce response time.

Yes, the toggle hash feature is only available when using the Accordions in the content builder. I’m sorry about that. You would unfortunately need to rebuild the page in that case.

[scwfit]

Ok thank you for the explanation!

[friech]

You’re more than welcome, glad we could help.

Cheers!