Hi I currently am using the Refresh theme. I would really appreciate getting help on what code I can use, and where, to customize the color of my header for certain product pages. For example, https://goalittlenuts.com/products/walnut-cracker, on this product page, I want the header yellow to match the rest of the page.
Does anybody have any suggestions on how I can accomplish this? Thanks in advance.
Hi @TessTess
You can do that as I’ll guide you how to do that.
Just follow the guide and you can set the color of the header what you want to walnut Cracker product page.
First Edit your theme code and find theme.liquid under Layout folder.
Then find the code <body
Now, as you find this paste the below code before the ending double quote ". Like below.
{% if template contains 'product' %}{{ product.title | handleize }}{% endif %}
then, paste the below css just before
It’ll match the header color with the reas of the page.
Thanks
Sheesh B
Hi Sheesh B,
Thank you so much for the detailed response and help. I input the code snippets you suggested but unfortunately I’m not seeing the header color changes like the screenshot you’ve shown. I’m attaching what the code looks like on my end after trying your edits, please let me know if I’ve done something wrong or need to make further changes.
Thank you again!
Tess
Hi @TessTess
You did a fantastic job. The title of the product is different from the product slug so I’m sharing the updated CSS below. Remove the above one and paste below CSS.
I tested it and working at my end. Let me know if you feel any issues.
Thanks
Sheesh B
Hi Sheesh B,
That worked perfectly, I can’t thank you enough!!
Tess