Colorchanging header

Technical Q&A
1

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!

2

Hi @CorazonRTS ,

To fix the issue, try this:

  1. Use index instead of index.json:

    {% if template == 'index' %}
   .header__icon {
      color: white !important;
   }
{% endif %}

  2. Ensure the class .header__icon is correct by inspecting the element.

  3. Place the code inside a block:

    <style>
{% if template == 'index' %}
   .header__icon {
      color: white !important;
   }
{% endif %}
</style>
3

Hi Codingfifty!

Thank you so much for your help with the setup, I had tried this solution earlier, but realised I had placed inside the {%if}

Sometimes I am surprised of my own stupidity haha.

Never the less, Thank you so much - It worked perfectly!

4

Please mark and like the solution @CorazonRTS