Transparent header

Bring attention to your media

Extend your hero banner or video banner right into the header area. Adding transparency to the header can give you a more sleek appearance and enhances the visual appeal of your store. Also bringing more attention to your brand and products:

When you activate transparency along with the sticky header feature in Pipeline, a frosted header background effect is applied:

In the above example, a white logo is added to the Header settings under "Transparent header logo". The regular logo for the header is the dark logo. The dark logo is used on all regular pages (unless you choose to use transparency on pages outside of the homepage).

Example of a regular Product page:

Transparency can be activated on select page styles, this can work well if you used banners on all of those page types:

Fix top gap when using a transparent header

When using an Image banner, Slideshow, Video banner, or similar section as your first section. You might notice a gap or padding at the top that affects the transparent header:

Simply, adjust the top padding on the section settings for your Image banner, slideshow, video banner, or other section:

Last updated