A user wanted to make the header transparent only on the home page of their Dawn 12.0 theme, but their CSS code was applying the transparency across all pages.
Solution provided:
background: transparent; CSS rule from the header wrappertheme.liquid file that targets only the home page using {% if template == 'index' %}</body> tag (not below it)Resolution:
The original poster successfully implemented the fix by inserting the conditional CSS/markup code in the correct location within theme.liquid. The initial attempt failed because the code was placed below the <body> tag instead of above it.
Additional video resources were shared showing how to create transparent headers specifically for the home page.
Hi @nadiamejilla , First you need to remove
background: transparent;
from your style , we will only added on the home page, go to theme.liquid file and add the following code in the bottom of the file above tag,
{% if template == 'index' %}
{% endif %}