WooCommerce Add to Cart button positioning – Themeco Community

WooCommerce Add to Cart button positioning

anthonytkim — Sat, 30 May 2015 23:55:06 +0000

I can’t find any settings to edit the placement of this button, but I need to move it from being on the thumbnail image to being under the product price. I also would like to make the button full width of the thumbnail image. I’m assuming that I could edit it with some CSS hacks but can’t find the right class id’s to move.

Reply To: WooCommerce Add to Cart button positioning

Rue Nel — Sun, 31 May 2015 09:27:55 +0000

Hello There,

Thanks for posting in!

To move it from being on the thumbnail image to being under the product price, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.woocommerce li.product .entry-header .button, 
.woocommerce-page li.product .entry-header .button {
   position: relative;
   margin-top: 10px;
   display: block;
   top: auto;
   left: auto;
   opacity: 1;
}

Let us know if this has been helpful to you.

Reply To: WooCommerce Add to Cart button positioning

anthonytkim — Sat, 06 Jun 2015 01:39:38 +0000

Worked great, thanks!

Reply To: WooCommerce Add to Cart button positioning

Rue Nel — Sun, 07 Jun 2015 00:53:23 +0000

You are most welcome!
We are glad we were able to help you out.

Reply To: WooCommerce Add to Cart button positioning

NightFox — Sat, 11 Jul 2015 05:54:50 +0000

Hi there,

Can you please help me to get the add to cart button and the # picker on the same line?

Reply To: WooCommerce Add to Cart button positioning

NightFox — Sat, 11 Jul 2015 05:56:20 +0000

This reply has been marked as private.

Reply To: WooCommerce Add to Cart button positioning

Rad — Sat, 11 Jul 2015 06:09:53 +0000

Hi there,

Please add this too 🙂

.woocommerce .quantity, .woocommerce-page .quantity {
  display: inline-block;
}

Cheers!

Reply To: WooCommerce Add to Cart button positioning

MexConcept — Tue, 14 Jul 2015 11:22:13 +0000

Hi, this is awesome! could you just tell us how to place a little space between the #picker and button?

http://screencast.com/t/ubFTKT9yVRIS

thanks guys!

Reply To: WooCommerce Add to Cart button positioning

Thai — Tue, 14 Jul 2015 11:26:09 +0000

Hi There,

Please try following CSS:

button.single_add_to_cart_button {
    margin-left: 15px;
}

Hope it helps.

Reply To: WooCommerce Add to Cart button positioning

MexConcept — Tue, 14 Jul 2015 12:05:28 +0000

Rocks like a star! thanks!