How do I remove the sticky navigation bar from my vegan theme?

bloombliss
Tourist
4 0 2

https://bloombliss.com/

 

This is what I tried but it is not working.

 

#shopify-section-header {
position: fixed;
z-index:1000;
left:0;
right:0;
-webkit-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
-moz-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
-ms-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
-o-box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
box-shadow:0px 2px 4px 0px rgba(0,0,0,.1);
background-color: {{ settings.color_body_bg }};
}

#PageContainer {
padding-top: 80px;
}

@media screen and (max-width: 590px) {
#PageContainer {
padding-top: 70px;
}
}

.fix-header {
position: relative!important;
}
.headerSpace {
height: 0!important
}

 

dmwwebartisan
Shopify Partner
5716 1307 1678

@bloombliss 

Do you want to completely remove it?

Or

Just remove the sticky option from the navigation?

If yes then please add the following code at the bottom of your assets/theme.scss.liqiud file.

#shopify-section-header{
position: relative !important;
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
Natztech
Shopify Partner
600 155 371

@bloombliss  please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

#shopify-section-header{
position: relative !important;
}
#PageContainer{
	padding-top: 0 !important;
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
LitExtension
Shopify Partner
641 66 119

Hi @bloombliss

To solve your problem. Please go to the file name “theme.scss” and follow:

Step 1: Find this selector “#shopify-section-header” to remove some property style as:

position: fixed;
z-index: 1000;
left: 0;
right: 0;

Screenshot to refer: https://prnt.sc/1191ndx

Result expect:

#shopify-section-header {

    -webkit-box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 10%);

    -moz-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);

    -ms-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);

    -o-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);

    box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 10%);

    background-color: #ffffff;

}

Step 2: Find this selector “#PageContainer” to add this snippet:

#PageContainer {

    padding-top: 0 !important;

}

Screenshot to refer: https://prnt.sc/1191szj

Hopes this helps. If you can not do that, you can as me as a staff, I'll check it for you.

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes