Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hello
I created a sticky header with SiteOrigin CSS. It is working ok on desktop but on mobile, it hides a menu item.
Hi Unet
Thanks for posting your question.
Do you have a public URL where we can take a look at what’s going on?
HelloThe link of the site is https://shoppingpal.soundtrip.store . The menu items not showing are Home and Store. If you check in the desktop version the menu has the home and store items.
Thanks for the update.
I take it Astra put the sticky header in their premium product?
A sticky header requires some sort of sentinel, something to take up space behind the header. Without that, the header overlaps anything at the top of the page. To rectify the issue you’re facing you’ll either need to develop a masthead sentinel or you’ll need to add additional Custom CSS to adjust the position of the mobile menu list.
How do I add additional custom css to the menu to adjust the position of the mobile menu?
It’s, unfortunately, beyond our free support scope to directly assist with a task like this. We do our best to assist with the resources we have. This is the sort of small customization task we can assist with within our premium support scope where the budget allows for it. You’d need to open your site up outside of SiteOrigin CSS, open your developer console, change to responsive mode. Inspect the mobile menu, take a look at how it’s positioned, locate the selector used and then look at how you can adjust that selector for your fixed header.