Caution This is an advanced tutorial and is not supported by Shopify . It is specific to an unedited version of the Debut theme, released 7th of March. We cannot guarantee results for themes that have been modified with custom coding and/or apps. We suggest hiring a Shopify Expert if you are not com…

I am using Minimal theme and the code above did not seem to work properly for me, although I do see that it works well on the sample site provided. So take that as you will. I also prefer the slight drop shadow that Sean’s original code gives to the header, so I wanted to find a way to make the orig…

hi Above code absolute perfect . We provide that code for debut theme . If there you change the selector that code will also work perfect. For that pushing effect you need to add initial padding-top in css.

Code works great, just would like to remove it from the cart page as it is blocking my upsell. Thanks in advance.

Thank you Sean! It works really well. I´m a Shopify noob. I found out how I adjust the height but it is only the height of the “background” how do I adjust the position of the Navigation, Logo, Search etc. in relation to the height of the "background? Hope this does make sense. Any help is apprecia…

Hi, I still didn’t get how to solve the problem of content getting pushed/adjusted after a few seconds. Want everything to get loaded in one shot. Seems very unpleasant to the eye that the entire page moves down after a second.

I am having an issue with the color of the header on my homepage. It is the only page where the background of the header is transparant. All other pages the header has the same color as the background of my website, as it should be. I now installed a 3rd party app to install a mega menu. Its not pr…

Great!!! I was just sitting and thinking how to do this and the first discussion I find in the forum is this one :-D. Fixed option 1 and all works tip top, will launch this new version now!!

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…

Fixed All. Header Bar, Header and Navigation. Select Online Store > Themes, Actions > Edit Code > Assets > theme.scss.liquid Copy and paste this code at the very bottom of the page. underneath [data-shopify-buttoncontainer] { justify-content: flex-end; } < Undernearh this www.quintessencessenti…

Sticky/Fixed Header and Navigation for Debut Theme

Store Design

TanCloths September 7, 2019, 3:41pm 19

I am using Narrative theme. And it’s pretty easy to this in that theme. Just follow the steps mentioned above.

Topic		Replies	Views
Sticky header (transparent on home page, white background with black on other) Technical Q&A	23	129	March 27, 2023
Debut Theme -Page moving behind Sticky header when scrolling down Store Design	6	39	November 16, 2022
Hopefully someone can help? Main menu/ Navigation issues Technical Q&A	9	114	August 9, 2022
Debut Theme sticky header without announcement bar Store Design	0	18	October 4, 2021
How to change header-menu layout Envy Theme Store Design	18	101	July 21, 2022

Sticky/Fixed Header and Navigation for Debut Theme

Related topics