How to change the text color in only collections and product pages (Gravity Theme)

Solved
MITACJ
Tourist
10 0 3

How do I change the text color to black only on collection and product pages, without changing it on the whole site?

https://meninthearena.org/collections/all

https://meninthearena.org/products/helmet-t-shirt 

Accepted Solution (1)

Accepted Solutions
suyash1
Shopify Partner
3688 407 606

This is an accepted solution.

please add this css

.template-collection .product-card__title{color: #000;}
.product-form__item label {color: #000;}
.template-product .product-single__description p{color: #000;}

 

You are welcome to contact me, my email - suyash.patankar@gmail.com
My timezone is GMT+5:30

View solution in original post

Replies 8 (8)
dmwwebartisan
Shopify Partner
9731 2223 3051

@MITACJ 

Please add the following code at the bottom of your assets/theme.css file. 

Click to expand...
body. template-product, body. template-collection{
color: #000 ! important;
}

Hope this works. 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
MITACJ
Tourist
10 0 3

Hi @dmwwebartisan, thanks so much for the help! I tried adding this. Unfortunately, it didn't work. =/ 

suyash1
Shopify Partner
3688 407 606

@MITACJ- try this

.template-product, .template-collection{
color: #000 ! important;
}
You are welcome to contact me, my email - suyash.patankar@gmail.com
My timezone is GMT+5:30
MITACJ
Tourist
10 0 3

Thank you for your help, @suyash1!

Interestingly, that worked a little bit, but not completely, and also broke something:

1. It turned the product name on the product page black, but not the description text: https://meninthearena.org/products/men-in-the-arena-leather-wallet

2. It also turned some of the top bar navigation items black, but not all of them, on both the product and collection pages, but not elsewhere on the site. (Edit: I just noticed that the navigation elements it turned black are all of the ones that have pull-down menus.)

3. It did not change anything on the collection page, other than the top bar navigation items: https://meninthearena.org/collections/all

Check it out!

I really appreciate your help!

suyash1
Shopify Partner
3688 407 606

@MITACJ- please remove above given css and add this

.template-product .product-single__title{color: #000;}
.template-product .price-item{color: #000;}
.template-product .product-single__description{color: #000;}

.template-collection .grid-view-item__link{color: #000;}
.template-collection .price-item{color: #000;}
You are welcome to contact me, my email - suyash.patankar@gmail.com
My timezone is GMT+5:30
MITACJ
Tourist
10 0 3

@suyash1 Thank you again for your help!

This solution is much closer! Pull-down menus are now all consistent.

Collection page: https://meninthearena.org/collections/all
- Prices are now black!, but product titles still grey. 

On SOME individual product pages, most text black! except "Color" and "More payment options"
Examples: https://meninthearena.org/products/men-in-the-arena-engraved-buck-knife
https://meninthearena.org/pro...


But on other product pages, title and price black!, but description text still grey.
Example: https://meninthearena.org/products/men-in-the-arena-t-shirt  
https://meninthearena.org/products/doub...

Thank you again for working with me on this!

suyash1
Shopify Partner
3688 407 606

This is an accepted solution.

please add this css

.template-collection .product-card__title{color: #000;}
.product-form__item label {color: #000;}
.template-product .product-single__description p{color: #000;}

 

You are welcome to contact me, my email - suyash.patankar@gmail.com
My timezone is GMT+5:30

View solution in original post

MITACJ
Tourist
10 0 3

@suyash1 Just wanted to say thank you so much for all of your help!