Change Icon Color

Topic summary

A user wants to change their icon color based on the page being viewed:

Current behavior:

  • Icon displays white on the landing page
  • Icon remains white on all other pages

Desired behavior:

  • Icon stays white on landing page
  • Icon changes to black on all other pages

Proposed solution:
Another user provides CSS customization steps:

  • Navigate to Shopify admin → Online Store → Themes
  • Click Actions → Edit code on the desired theme
  • Locate the theme.liquid file and find the </body> tag
  • Insert CSS code that applies styling conditionally using {% unless template.name == 'index' %} to exclude the landing page

The solution uses Shopify’s Liquid templating to target all pages except the index/landing page.

Summarized with AI on November 9. AI used: claude-sonnet-4-5-20250929.

Hey,

i want my icon to change color when i switch from my landing page to the other sites. currently its white.

is there a way where it stays white when im on the landing page, but changes color to black when im on my other pages?

url: sixdreamz.com

1 Like

Hi @sixdreamz

Check this one.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “theme. Liquid” file. Find the tag and paste the code below before the tag.

{% unless template.name == 'index' %}

{% endunless %}

And Save.