How to make header transparent over video? (prestige theme)

Store Design
1

I want to make my header transparent so it goes over a custom liquid video, at the moment it only works transparent on slideshow (prestige theme)

2

Hi @PM999 ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file → Save

.shopify-section.shopify-section-group-header-group.shopify-section--header {
    position: fixed !important;
    width: 100vw !important;
    top: 0;
}

@media only screen and (min-width: 700px) {
    .header {
        background-color: transparent !important;
    }
}

Here is result:

BSSTechVenture_0-1716646788739.png
BSSTechVenture_0-1716646788739.png1918×879 139 KB

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

3

Hi @PM999 ,
For home page, pls following steps:

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Inside head tags → Insert the below code → Save

BSSTechVenture_0-1716649700216.png
BSSTechVenture_0-1716649700216.png1919×886 83.3 KB

{% if template.name == 'index' %}
    
{% endif %}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you :heart_eyes:

1 Like