Shopify themes, liquid, logos, and UX
Hi
I would like to create a sticky/fixed navigation menu on the mobile version of my site. I'm using the debut theme.
I've browsed through a lot of threads without any luck to solve this issue.
Thank you.
Please share your store URL & screenshot what do you want!
Thanks!
@dmwwebartisan my shop is: www.flaph.dk password: twayzi
When I scroll down on my mobile I want the header/navigation menu to be fixed/sticky, so that I shows all the time - this goes for all pages.
Hope this makes sense - otherwise please get back to me. 🙂
Please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/theme.css-->paste below code at the bottom of the file.
.site-header {
position: fixed !important;
background-color: var(--color-body);
width: 100% !important;
z-index: 100;
}
Thanks!
Fantastic buddy! I've searched for days on/off trying to solve this issue.
Thank you so much!
Oh I was a bit too fast.
When I look closer the header is now on top of the pictures and not moving up all the way. See enclosed picture.
Please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/theme.css-->paste below code at the bottom of the file.
@media only screen and (max-width: 749px){
#MainContent{margin-top: 3rem!important}
}
@media only screen and (min-width: 750px){
#MainContent{margin-top: 5rem!important}
}
Thanks!
@dmwwebartisan this almost did the trick. It still cuts off a microscopic piece of the picture. Anyway to fix this?
Otherwise this would still be a totally acceptable solution.
Cheers.
Please share screenshot
@dmwwebartisan Pictures enclosed - the difference is, as I said, reeeeeally small.
I just discovered that the header is also sticky in laptop mode etc. The changes should ONLY affect the mobile view.
Hi mate,
I am having a similar issue with my website using Debut Theme.
I'm trying to fix the Header in place however on scroll it moves down the page.
See screenshots for reference.
Cheers mate!
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024