Adding Fixed Menu/Scrolling Menu to website in Debut theme - HELP!

Tourist
6 0 1

Hi, I'm trying to add a fixed/scrolling menu to my site: www.plantfuelled.co

I am using debute theme

0 Likes
Excursionist
19 3 4

1.Go to themes in left side bar of your admin dashboard
2.Than select dropdown and select (edit code) option 
3.Than Search for theme.scss.liquid file open it and in the end of file add this css and save it...


.site-header{
    position: fixed !important;
    top: 0px !important;
    z-index: 1 !important;
}

#PageContainer{
    margin-top: 75px !important;
}
 

0 Likes
Tourist
6 0 1

Thanks maulikp, you hero!

1 Like
New Member
5 0 0

It works but for my mobile view my nav bar shrinked to the left a bit leaving some gap on the right

0 Likes
Tourist
29 0 1

This is new. I used the inspect fuction on google chrome and played around with the code.. The code below shows the Menu. The previous code showed the header including the logo of your site. with this new code there is no logo just the menu. Go to Themes, and Edit code. then Assets. Open 

theme scss liquid and paste the code at the very bottom. save and text it out

 

.site-nav {
position: right !important;
top: 140px !important;
z-index: 1 !important;
}

#PageContainer{
margin-left: 75px !important;
}

0 Likes
Tourist
29 0 1

This is new. I used the inspect fuction on google chrome and played around with the code.. The code below shows the Menu. The previous code at the showed the header including the logo of your site. with this new code there is no logo just the menu. Go to Themes, and Edit code. then Assets. Open 

theme scss liquid and paste the code at the very bottom. save and text it out

 

.site-nav{
position: fixed !important;
top: 140px !important;
right: 200px !important;
z-index: 1 !important;
}

#PageContainer{
margin-top: 75px !important;
}

0 Likes