Transparent header
Blend the main header and navigation with your hero or slideshow section
Last updated
Blend the main header and navigation with your hero or slideshow section
Last updated
Activating the transparent header is Story is one from the Header section setting:
Use the Alternate logo option to provide an image that works best with your transparent header.
Choose which type of pages to display the transparent header. Most stores will display on the home page. You have to ability to also display on collection pages and blog post pages (article pages).
When using the sticky header feature, your customers will always have access to the header area while scrolling down the page. When you combine the transparent header feature with a sticky header, you can use two different logo images. The alternate logo image is used in the transparent header and the main primary logo image is used in the sticky header while your customer is scrolling:
In the above example, the main logo is dark and appears in the sticky header:
The alternate logo which is white, appears in the transparent header:
Additional tips when using a dark background as the header color:
