O WooCommerce conta agora com blocos que facilitam a criação de páginas personalizadas de produtos e uma das vantagens ao usar os blocos é a facilidade de alinhar o último elemento (por padrão, o botão) de cada produto listado.

Essa opção, porém, não está disponível para sites ainda utilizando o shortcode [products]
Nesse caso, ou você usa um plugin como o Woo Align Buttons ou adiciona um código CSS ao seu site:
/* WooCommerce Products Shortcode: bottom-align buttons -- https://wp.me/paOFn3-TO */
@media screen and (min-width: 768px) {
ul.products {
display: flex;
flex-wrap: wrap;
}
ul.products li.product {
display: flex;
flex-direction: column;
justify-content: space-between;
}
ul.products li.product .button {
align-self: center;
}
}
E segue o resultado:

Caso queira mudar o alinhamento dos botões, mude o valor do align-self
para um outro qualquer.
Deixe um comentário