Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi,
Ive setup a website for the Company Corazon RTS.
I have designed a transparent header with a black title & black icon, because the website is white.
The problem occurs because the landingpage consists of a dark image. I have tried changing the color using {% if}
But I am unsurten if I have set it up correctly, the code is placed in the header but I am not sure how to target the 'Index.json'
Currently I followed what what other people have done, when reading here on the forums
{%if template == 'index.json'}
.header__icon{
color: white !Important;
}
{%endif}
Please let me know if any of you see the problem, which I cant seem to solve!
Solved! Go to the solution
This is an accepted solution.
Hi @CorazonRTS,
To fix the issue, try this:
Use index instead of index.json:
{% if template == 'index' %} .header__icon { color: white !important; } {% endif %}
Ensure the class .header__icon is correct by inspecting the element.
Place the code inside a <style> block:
<style> {% if template == 'index' %} .header__icon { color: white !important; } {% endif %} </style>
This is an accepted solution.
Hi @CorazonRTS,
To fix the issue, try this:
Use index instead of index.json:
{% if template == 'index' %} .header__icon { color: white !important; } {% endif %}
Ensure the class .header__icon is correct by inspecting the element.
Place the code inside a <style> block:
<style> {% if template == 'index' %} .header__icon { color: white !important; } {% endif %} </style>
Hi Codingfifty!
Thank you so much for your help with the setup, I had tried this solution earlier, but realised I had placed </style> inside the {%if}
Sometimes I am surprised of my own stupidity haha.
Never the less, Thank you so much - It worked perfectly!
Please mark and like the solution @CorazonRTS
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025