Add to cart button on SHOP page

  • Resolved arianelariviere

    (@arianelariviere)


    3 years, 1 month ago

    Hey there!

    I wish I could customize the Add to Cart buttons on my shop page.

    They’re too big and I wish it was just the icon, in red, no background.

    Is there CSS to do that?

    Thank you!

    Ariane

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Kaira

    (@kaira)

    3 years, 1 month ago

    Hi @arianelariviere

    Try adding the following custom CSS to Customize -> Additional CSS and see if that does what you’re wanting.

    body.wcz-btns.wcz-woocommerce ul.products li.product a.button {
    background: none !important;
    color: #b52943 !important;
    }
    /* and to made the Add To Cart font bigger */
    .card-product .footer .stats div.tooltip div {
    font-size: 20px !important;
    }

    StoreCustomizer won’t be able to do this as your theme is overriding the templates and changing the html & CSS classes.

    Thanks
    Zack

    Thread Starter arianelariviere

    (@arianelariviere)

    3 years, 1 month ago

    Thank you Zach, that worked perfectly!

    Can I also ask you if it’s possible to make the products images bigger?

    Thank you!
    Ariane

    Plugin Author Kaira

    (@kaira)

    3 years, 1 month ago

    Hi @arianelariviere

    Try adding this CSS for that:

    .card-product>.card-image {
    display: block;
    }
    .woocommerce ul.products li.product a img {
    width: 100% !important;
    }

    And you might need to recut the images to be larger:
    https://www.businessbloomer.com/woocommerce-single-product-image/

    If that doesn’t work properly then it’ll be best to contact the theme developers to see if they can help 🙂

    Thanks

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Add to cart button on SHOP page’ is closed to new replies.