Align WooCommerce Add to Cart Buttons in Storefront

I get this request a lot – you have a lot of products but the “Add to Cart” buttons don’t line up together.  You probably have some product titles that span 2 lines, others than span 1.  Some of your images are taller than others, or maybe some are on Sale and others aren’t.  That’s ok!  Here’s what you need to do:

1. Measure how big you want ALL your product heights to be.  Do you want all your products to have a height of 200 pixels or 500 pixels?
2. Make sure you have the right image settings under WooCommerce > Settings > Products > Display.  From there you can actually set an  image size that will be uniform for your whole store.
3. Use Custom CSS to set a specific height for your products:
   

I typically use Jetpack’s Custom CSS module to add CSS to your site but you can do it whichever way you want.

Before:

After:

Want more Storefront or WooCommerce tips? Leave a comment below with a suggestion!