# Change WooCommerce Add to Cart Button in Shapely

**URL:** <https://colorlibsupport.com/t/change-woocommerce-add-to-cart-button-in-shapely/19540>\
**Category:** Shapely\
**Created:** [December 29, 2017, 10:08pm UTC](https://colorlibsupport.com/t/change-woocommerce-add-to-cart-button-in-shapely/19540 "2017-12-29T22:08:55Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![burfordj4](https://colorlibsupport.com/user_avatar/colorlibsupport.com/burfordj4/32/1224_2.png) [@burfordj4](https://colorlibsupport.com/u/burfordj4)\
**Post date:** [December 29, 2017, 10:08pm UTC](https://colorlibsupport.com/t/change-woocommerce-add-to-cart-button-in-shapely/19540/1 "2017-12-29T22:08:55Z")

</div>

Hey Guys,

Right now my Add to Cart buttons look ghetto. How do I go about getting rid of these ugly gray boxes, and not having the price and the button squished together?

> **[Services - Private ACT, SAT, and PSAT Tutoring | Magnolia Prep](https://magnoliaprep.com/services/)**
>
> Information about our ACT, SAT, and PSAT group courses and private tutoring. Includes our prices, location and scheduling information, how long the sessions are, how much homework to expect, our different payment options, etc.

Just go to the link and scroll down to see what I mean.

Thanks!  
John

---

<div class="post-metadata">

**Author:** ![mikesupport17](https://colorlibsupport.com/letter_avatar_proxy/v4/letter/m/bc8723/32.png) [@mikesupport17](https://colorlibsupport.com/u/mikesupport17)\
**Post date:** [December 29, 2017, 10:31pm UTC](https://colorlibsupport.com/t/change-woocommerce-add-to-cart-button-in-shapely/19540/2 "2017-12-29T22:31:44Z")

</div>

Hey there,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -\> Appearance -\> Customize -\> Additional CSS

```auto

/* add margin to add to cart button */
a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
    margin-left: 20px;
}
a.button.product_type_subscription.add_to_cart_button.ajax_add_to_cart {
    margin-left: 20px;
}

/* change border color */
p.product.woocommerce.add_to_cart_inline {
    border: 4px solid green ;
}

```

Best regards,  
Support.