I would like to make the colors of the text and background of my product page different from my home page but when I change it, both pages change. Currently, the home page has white text on a blue background and on the product page the product information section also has a white background but all the text is also white, so you can’t see it. How can I change it so that the product information text is blue, while keeping the text on the home page white so that it can still be seen on the blue background?
Insert the following code at the bottom of the page and save. If it does not work, please try inserting it into another CSS file.
.product__description.rte.quick-add-hidden p {
color: $color !important;
}
Then you will replace $color with the color you want to display eg: red, yellow, orange, etc. If you want to change the title to the same color as the product description, you can add more
Thanks so much for the information, it did help, however there are more parts of the product page that are still in white on a white background that’s not visible. I’d like to change these to the same blue as the rest of the site. I’ll add screenshots showing the parts that need to change color.
Here I’ve added what the home page and the product page should look like, but I’m still not sure how to do that without changing the text colour of both… Is there a different code that I need to paste for each page? I’d appreciate the help!
If you want to change the text color of the homepage and still keep the text color of the rest of the pages, you should not customize the global color variable and should only customize the font color of homepage.