Return to previous page

Improving images in the product archive.

This topic has 2 replies, 2 voices, and was last updated 7 months, 3 weeks ago ago by Rose Tyler

lew-shop

Participant

April 3, 2024 at 08:34

How to align all products without cropping the image?

#389778 Copied Theme version: 9.3.2

1 Answer

Rose Tyler

Support staff

April 3, 2024 at 09:06

Hello,

Thank you for reaching out to us with your query.

It is recommended to use a graphics editor and prepare product images (make them the same size) before uploading images to your media gallery and for products.

Also, you can try to use the next custom CSS code:

.main-products-loop .product, .products-loop .product, .carousel-area .product-slide .product {
    display: flex;
    justify-content: center;
}
.products-loop .ajax-content, .products-loop {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
}
.content-product {
    flex-direction: column;
    justify-content: space-between;
    display: flex;
    flex: 1;
}
.content-product .quantity-wrapper {
    margin-right: auto;
    margin-left: auto;
}
.swiper-container {
    display: flex;
    align-items: stretch;
}
.product-slide .product {
    display: flex;
    height: 100%;
}
.swiper-wrapper {
    height: auto;
}

Best Regards,
8Theme’s Team

#389793 Copied

Tagged: archive image enhancement, best woocommerce themes, boost sales with better images, high quality product archive images, improve product images, woocommerce image optimization, woocommerce theme improvements
Viewing 2 results - 1 through 2 (of 2 total)