Hey Folks!

During March of 2020, and possibly April, answers may be delayed more than it usually happens. This is caused by my personal situation that requires a lot of time from me to be dedicated elsewhere, and also because of the local things that are happening currently cause of the all things connected to "Corona Virus".

Please be patient, all answers are coming as soon as possible, even if I have to stay late at night :-)

Sorry for any inconvenience.

Before you ask please READ THIS

Colors in WooCommerce product category

in Rife Posts: 10,288
Willie asked me on e-mail about various colors in the product category.

ScreenShots attached.
1463 x 451 - 47K
1183 x 619 - 52K


  • AirAir
    Posts: 10,288
    Hey WIllie:-)
    I want to change color and size(this is reading off of the description of category)
    You can target this part added by plugin with this custom CSS:
        color: #0000ff;
        font-size: 20px;
    However, for this to work you will have to remove styling that you have added to it while editing category.

    Please see:

    So you can either style it with custom CSS, that I gave you above, or right from editor in above link.
    I want to change color of the button
    Please use this custom CSS:
    .woocommerce ul.products li.product .button {
        background-color: #fff;
        color: #222;
    .woocommerce ul.products li.product .button:hover {
        background-color: #222;
        color: #fff;
    I dont want to display categories
    In child theme in file functions.php please add such code:
    add_action('after_setup_theme', function(){
        remove_action( 'woocommerce_before_shop_loop_item_title', 'apollo13framework_wc_loop_single_product_categories', 13);
    I want to change color and size
    Please use such custom CSS:
    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        color: #0000ff;
        font-size: 20px;
    I also want to change the page number font
    Do you mean font-size & colors?

    With kind regards.
  • Posts: 2
    yes, font size and colors.
  • AirAir
    Posts: 10,288
    OK :-)

    Here is custom CSS for page navigation:
    /* all links in navigation */
    .navigation a, .navigation span {
        font-size: 10px;
        color: #3D3D3D;
    /* current page */
    .navigation .current, .navigation a:hover {
        color: #fff;
        background-color: #bbb;
    /* next/prev */
    .navigation .next, .navigation .prev {
        color: #222;
    .navigation .next:hover, .navigation .prev:hover {
        background-color: #222;
    Hope this will help.

    With kind regards.
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!