Hello, Let me start by saying I have uploaded a few different pics of the issues I am having with customization with category colors for text . For some reason, I can customize everything in woo commerce and Soledad theme but the category colors for products, buttons on the store and product pages. I have made a detailed report per photo below, to try and help you understand the issues I am facing.
Image 8 - is the actual landing page, everything has customized with no problem but the categories above the product titles.
Image 9 - Is the store front. The title colors will not change at all, and neither will the buttons on the store front (They are fine on the landing page)
Image 10 - Is the product page. The entire hierarchy show above the product image will not change color at all, the title will not change color at all, the buttons will not change color at all, and the categories, SKU and Tags will not change color.
Is there a work around for this? I have tried custom CSS, either I am adding it wrong, or the theme is not taking it. Could you please assist me on this.
Hello, Let me start by saying I have uploaded a few different pics of the issues I am having with customization with category colors for text . For some reason, I can customize everything in woo commerce and Soledad theme but the category colors for products, buttons on the store and product pages. I have made a detailed report per photo below, to try and help you understand the issues I am facing.
Image 8 - is the actual landing page, everything has customized with no problem but the categories above the product titles.
Image 9 - Is the store front. The title colors will not change at all, and neither will the buttons on the store front (They are fine on the landing page)
Image 10 - Is the product page. The entire hierarchy show above the product image will not change color at all, the title will not change color at all, the buttons will not change color at all, and the categories, SKU and Tags will not change color.
Is there a work around for this? I have tried custom CSS, either I am adding it wrong, or the theme is not taking it. Could you please assist me on this.
Hi,
Can you please make your site live to I can help you check it?
Or send me the admin account to I can login to see it - in a private reply.
Best Regards,
PenciDesign
Hi,
1/ For categories on the homepage - you can change here
2/ On shop page, you can change color for only the title & buttons by add more this code to Customize > Custom CSS:
.woocommerce ul.products li.product h3, .woocommerce ul.products li.product .woocommerce-loop-product__title{ color: #ff0000; } .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{ color: #ffffff; background: #201296; } .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{ color: #ffffff; background: #ff0000; }Change color codes above: ff0000, ffffff, 201296... to color codes as you want for each color/background - you can get a color code here
3/ On Single Product, you can add more this code to Customize > Custom CSS to change the colors for it:
.woocommerce div.product .product_title{ color: #ff0000; } .woocommerce div.product p.price ins, .woocommerce div.product span.price ins, .woocommerce div.product p.price, .woocommerce div.product span.price{ color: #ff9000; } .woocommerce div.product div[itemprop="description"], .woocommerce div.product div[itemprop="description"] p, .woocommerce div.product .woocommerce-tabs #tab-description, .woocommerce div.product .woocommerce-tabs #tab-description p, .woocommerce-product-details__short-description, .woocommerce-product-details__short-description p{ color: #ffffff; } .woocommerce div.product .stock{ color: #ff37dd; } .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{ color: #ffffff; background: #ff0000; } .woocommerce .widget_shopping_cart p.buttons a:hover, .woocommerce.widget_shopping_cart p.buttons a:hover, .woocommerce .widget_price_filter .price_slider_amount .button:hover, .woocommerce div.product form.cart .button:hover{ color: #ffffff; background: #00ff2b; } .woocommerce div.product .product_meta > span, .woocommerce div.product .product_meta > span a{ color: #fff087; }Change color codes as you want like above.
Best Regards,
PenciDesign