Product grid customization

  • Hi,

    I am reading this page : https://wpastra.com/docs/shop-woocommerce-2/ and I can’t find how to adjust such things as products alignment, “add to cart” button size.

    For example, we see here that the rightmost product “Bag over the shoulder handbag” title is longer than other products title so that it causes a shift on the position of category, price, rating and action button.
    Is it possible to modify the arrangement of the elements so that they are always in the same place regardless of the size of the product title?

    One more question. Is it possible to automatically stretch the “add to cart” button so that it occupies the whole width of the box?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter kureman

    (@kureman)

    I found a css solution for the button display

    .add_to_cart_button {
		display:block;
		width:100%;
}

    I still can’t figure how to fix my main alignment problem ??

    Hi @kureman,

    As of now, there’s no feature to align the Add to Cart buttons evenly at the same level. It will depend on the image size and product title’s length.

    Anyway, if you can share with us your site URL, we might be able to share with you a CSS code to make it happen.

    Kind regards,
    Herman ??

    Thread Starter kureman

    (@kureman)

    Thank you @bsfherman for your answer ??

    Sorry, I can’t share my site url yet, I am still working on it…
    I added the following CSS code. It works most of the time, but it’s not a perfect fix.

    .ast-woo-product-category {min-height: 40px}
.woocommerce-loop-product__title {min-height: 50px}

    Hi @kureman

    You can try and modify the following CSS

    .woocommerce ul.products li.product h2 {
	line-height: 2.5ex;
	height: 5ex;
	overflow: hidden;
}

    I hope it helps.

    Kind regards,
    Herman ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Product grid customization’ is closed to new replies.