Transparent header

Header

Theme retirement Ira is no longer available on the Shopify theme store. Theme support and updates for current users will end after May 18, 2024. Learn more here.

Make your store's header transparent on your Home page and collection pages to display the full height of your Slideshow.

STEPS

In your theme editor (Customize):

  1. Click the Header section and scroll down the the Transparent header settings.

  2. Check the Enable on home page and/or Enable on collection pages checkbox to turn on the transparent header.

    Ensure that you have a Slideshow section as the first section.

  3. Choose the colors (Text color, Icon color, and Border color) that should be used for the header content.

    These colors will need to contrast with your slides or video to ensure visibility.

  4. Use the Border opacity slider to make the border more or less visible.

    0 is completely invisible and 10 is completely opaque.

  5. Add a Logo image to be used specifically with the transparent header.

    Use an edited logo image with alternate colors to contrast with your slideshow images. For example, you may need a dark-colored version of your logo to look good on light-colored backgrounds.

    This image only displays when the header is transparent. Your main logo image will automatically display when the header is no longer transparent.

  6. Click Save.

Settings reference

Click on the Header section to find the following settings:


Related links

Header

Last updated