Impulse Overlaid Header - Logo

Hi

My logo is available in both white and brown. I am using the white logo on my home page using the overlaid style (the brown logo isn’t visible enough). However, being white, the logo is invisible on every other page, as my page background is white.

Is there any way I can use the brown logo on every page other than the home page?

Thanks for any help.

Hey @BonzaDogTreats ,

Yes, you can use your white logo on the home page and the brown logo on other pages by adding custom code to your Shopify theme.

Identify the Home Page:

We need to check if the current page is the home page using Shopify’s template condition.

Edit Header File:

  1. Go to your Shopify admin.

  2. Online Store > Themes > Edit Code

  3. Look for the header.liquid or theme.liquid file, depending on where your logo is placed.

  4. Modify the Code**:** Add a conditional check to load different logos based on the page.

{% if template == 'index' %}
  
{% else %}
  
{% endif %}

Upload Both Logos:

  1. Go to Setting > Files in your Shopify admin.

  2. Upload both white-logo.png and brown-logo.png.

  3. Replace the file names in the above code if your files have different names.

After saving, the white logo will appear on the home page, and the brown logo will appear on all other pages.

If I was able to help you, please don’t forget to Like and mark it as the Solution!

Best Regard,

Rajat Sharma

Hi @BonzaDogTreats

Could you share your store link so we can check?

I’m working on some updates, the version of the theme which I’m talking about isn’t live. But the website is https://www.bonzadogtreats.com.au

You can share preview of draft theme so I can check

Thank you - I probably should have mentioned that I’m using the Section Store app annd using the parallax banner section for my header image. Does that alter your suggestion?

https://o1nb9dcbutfyhpa4-14366236.shopifypreview.com

Do you have a brown logo version? Or you can add this code to the theme.liquid file of that theme, after in Online store > Themes > Edit code to make logo change to black version

{% unless template == 'index' %}

{% endunless %}

Yes, I have a brown logo in a PNG file

Could you please send me a message via email so we can discuss this further?

Thanks