Hi there
I would like to sets links on my website to content with a ID. The link would look soething likt this: /dienstleistungen/#wohnungsabnahmen.
This works very well but the beginning of the content lyes covered under the top bar menu, which has about a hight of 70 pixels. Is there a possibility to offset the beginning of the ID’s content according to this 70 pixels?
Thank you very much for your help!
Hello Felix,
Thanks for writing in! Are you using the X theme? Please go to X > Theme Options > Header > Navbar and make sure that the Navbar Top Height is at least 70 pixels. If this is NOT helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
To know how to create a secure note, please check this out: How The Forum Works
Best Regards.
Hi Ruenel
Thank you very much for your reply. I am using X-Pro. I will send you the login information of my website.
The page with the IDs in each section is this one:
I would like to set links to specific sections with a ID like this:
As you can see, the beginning of the IDs content is covered by the menubar.
Thank you very much for your help!
Hi @fbrugger,
I suggest that you will add your content ID in your section.
To achieve your goal please check this link and copy the code below on the link I provided.
Please add the JS code in your Pro > Theme Options then JS.
Please note that providing custom code is outside the scope of our theme support. Issues that will arise from the use of custom codes should be forwarded to a 3rd party developer.
Thank you.
Hi Cramaton
Thank you very much for your good advice. I did as you said and added all Content IDs in the sections. This made it better, because the sections are taking more room at the top.
I also added the code in the Global JS. But this had no effect to the position of the content as far i can see. Where do I have to set the offset? I tryed the following but it didn’t work out:
// top position relative to the document
var pos = $id.offset().top -70;
or
// top position relative to the document
var pos = $id.offset().top 70;
or
// top position relative to the document
var pos = $id.offset(70).top;
Thank you very much for your help!
Hey Felix,
Please remove the custom code as it is triggering an error. The issue is happening due to your second Bar which is hidden initially. On page load, the page scrolls to the section with the ID wohnungsreinigung before the header becomes visible because it is set to Hide Initially. When the initially hidden bar becomes visible it gives an impression that it is covering some part of your section.
To fix this, I’d suggest you to duplicate your header, keep one bar only which is visible all the time, also you’d need to make this bar sticky and remove the bar which is set to Hide Initially. Assign this header to the “Dienstleistungen” page only.
This should fix this problem. Let us know how this goes!
Hi Nabeel
Thank you very much for your reply and you goo advice. I thought, there would be a possibility to add a offset for the menu, like as example slider revolution does.
I quite like the menu as it is, as a higher version with bigger logo on top of page and shrinking to a smaller version when scrolling down.
But I think I have found a solution, so I can leave the menu as it is: I have set the ID in the section with the line above the actual section to which I want to jump. So I can define the offset with the margin and padding of the line section:
I think, this works.
Thanks again for your help
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.