You can use this code on the theme.liquid
Better to create an asset js file, and then paste it.
Topic summary
Goal: show a white logo on the homepage and switch to a black logo on all other pages.
Proposed approach (JS): detect the homepage via window.location.pathname === “/” and swap the logo image source.
- Place JavaScript in a new theme asset (preferred) or theme.liquid. Target the .logo element and set logo.src to the white image on the home, and to the black image elsewhere.
- Example logic: if (isHomepage) use white; else use black. CSS isn’t needed if you’re swapping full images; classes are only for styling the same image.
Image handling: upload both PNGs in Shopify admin > Content > Files, then copy the CDN URLs and use those URLs in logo.src.
Clarifications:
- theme.liquid = main layout file for the storefront.
- Asset JS file = a separate script file in the theme’s Assets folder.
- Shopify CDN URL = the direct link you get from Files for each image.
Alternative solution: a video tutorial was shared suggesting updating inner page templates (collection, product, cart, page) with code.
Status: guidance provided; no confirmation of success yet. Discussion remains open.