Jump link to ID and subtract header height

[fbrugger]

Hi there

Is there a possibility to subtract the header height, when jumping to a #ID ?

Thank you very much for your help!

Kind regards,
Felix

[prakash_s]

Hello Felix,

Thanks for writing to us.

The navigation Link Offset has been already fixed in case you want to subtract the header height I would suggest you please add this custom JS code under the global JS.

window.csGlobal.csHooks.filter('hash_scrolling_offset', (offset) => {
return offset - 120;
} );

You must change the offset value as per your header height, the purpose of providing the custom Javascript is to show you how to add Javascript code to your site. Writing custom is outside the scope of our theme support. If you need more customization, you need to learn Javascript https://www.w3schools.com/js/ In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[fbrugger]

Hi Prakash

Thank you very much for your reply and help! Sorry, I meant of course, I want to add the header height, so the header don’t overlap the section with the #ID.

However, I have used the JS with + and - before the value but in one case the overlap was even bigger and in the other case (with +) it had no effect at all.

Is there no way to add a offset in the theme, for example as i can set the scroll-down arrow offset in Slider Revolution?

Thank you very much for your help!

Kind regards,
Felix

[ruenel]

Hello There,

To better assist you with your issue, please provide us with your site URL so we can check it. We would also love if you can give us WP access. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[fbrugger]

Hi Ruenel

Thank you very much for looking into this. Here are the login data and the site URL:

[fbrugger]

Yes, I confirm, that you can make changes to my website.

I would like to acheive the following:
With the given site URL the viewport jumps to the section with the ID #Interior-design-consulting.

This ID starts at the very top of the Display but the sticky header overlaps this section with 70px. I would like to add 70px offset on top of this ID position, so the section beginns right after the sticky header instead behind it.

I hope I could explain understandable enough what I mean.

Thank you very much for your help!

Kind regards,
Felix

[ruenel]

Hello Felix,

Please remove the ID “Interior-design-consulting” of the Headline element. You should be adding it to the Section element instead.

Best Regards.

[fbrugger]

Hi Ruenel

I am really sorry, this was my mistake!

Thank you very much for looking into this. Now it works perfect!

Thanks again for your great support!

Kind regards,
Felix

[ruenel]

You are most welcome, Felix.