Trying to recreate Overlay Menu for use on post and archive pages

Hi,
I understand the overlay menu from the ‘Pagebuilder + Overlay Menu’ template isn’t available to post pages (which is weird??). I’m therefore trying to recreate it as a custom header, so that all pages are consistent across my site.

It should be easy enough, but it’s not working out, as the sticky menu bar overhangs the page, ie it’s not sitting within td-outer-wrap and I’m not sure why.

I’m using ‘Template 25 – Overlay’ as the base and I see someone else had the same issue, but no solution was provided in the forum. Can you tell me how to recreate the header/menu? Or perhaps I can add some of the classes used in the original template, so that the header looks and behaves in the same way?? The question is which ones and where to place them, as the structure of the custom header is very different to the Overlay Menu/header – can you help?

Many thanks.

Hi Calin,

Thanks for your response, but I’m still getting the same issue. I’ve checked my header settings are as per your images – still doesn’t work.

I’ve also imported a fresh ‘Template 25 – Overlay’, the imported settings are as per your images, but I get the exact same issue. The only change I made was to the background colour, so you can see it in the below image.

Hi,

What other details would you like? The nav bar fits the boxed layout fine, until you scroll down the page and see the sticky header/nav bar. The sticky header goes beyond the right-hand edge of the boxed layout in both tagDiv Composer (as per the above image) and the live page as well. Essentially it doesn’t respect the container width, padding or margins.

I can send you a link to a live page if you want to see it in action (it’s the same template, just different font/colour), just let me know and I’ll send a link via email as the site’s not public yet.

The setting you highlighted in your image shouldn’t have any effect, as it’s just a password manager browser extension and doesn’t actually add anything to the field unless clicked – not sure why it’s showing up, but the field is empty. The only way to avoid it, would be to use a private window or a browser that doesn’t have the extension, but as the field is empty, I can’t see this having an effect.

Thanks.