What's your biggest current challenge? Have your say in Community Polls along the right column.

How to target specific page

Solved

How to target specific page

Velvah
Tourist
4 0 1

Hey everyone,

I want to change the textcolor of a header on a certain page, just the product page:

https://velvah.com/products/velvah-genesis (passcode: "VELVAH101", the Genesis product)

 

I want to set the color of the text on the header on that page to black and keep the other headers white.

Does anyone have any suggestions?

 

Thanks

Accepted Solution (1)

dev_solutions
Shopify Partner
17 3 4

This is an accepted solution.

Hello @Velvah 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

 

 

{% if tempalte contains 'product' %}
<style>
.header {
    background-color: #000 !important;
}
</style>
{% endif %}

 

 

 It will work for the product page but as i can see your other page header not showing correct it's white without the text?

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

- Need a Shopify Expert? Chat on WhatsApp

View solution in original post

Replies 7 (7)

Moeed
Shopify Partner
6348 1721 2079

Hey @Velvah 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

{% if template contains 'product' %}
<style>
sticky-header.header-wrapper.color-scheme-a80d9fd7-daea-45c6-a118-e8e33eeb2c21.gradient {
    background: black !important;
}
</style>
{% endif %}

RESULT:

Moeed_0-1731433978678.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Boost Your Sales with Affiliate Marketing - UpPromote: Affiliate & Referral


Velvah
Tourist
4 0 1

Thanks a lot mate!

dev_solutions
Shopify Partner
17 3 4

If you need any other help feel free to ask here.

Best Regards

- Need a Shopify Expert? Chat on WhatsApp
Moeed
Shopify Partner
6348 1721 2079

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Boost Your Sales with Affiliate Marketing - UpPromote: Affiliate & Referral


dev_solutions
Shopify Partner
17 3 4

This is an accepted solution.

Hello @Velvah 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

 

 

{% if tempalte contains 'product' %}
<style>
.header {
    background-color: #000 !important;
}
</style>
{% endif %}

 

 

 It will work for the product page but as i can see your other page header not showing correct it's white without the text?

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

- Need a Shopify Expert? Chat on WhatsApp
Velvah
Tourist
4 0 1

Amazing! I spent literally 2 hours trying to figure it out with chatgpt, and you two saved me so much pain. Thank you so much

dev_solutions
Shopify Partner
17 3 4

You're Welcome @Velvah 

If you need any other help feel free to ask here.

Best Regards

- Need a Shopify Expert? Chat on WhatsApp