Para mostrar los últimos productos publicados en WooCommerce con 4 columnas y asegurarte de que las imágenes tengan un tamaño cuadrado 1:1, puedes usar el siguiente shortcode:
[products limit="4" columns="4" orderby="date" order="DESC" class="custom-grid"]
Y para asegurar que las imágenes de los productos se muestren en un formato 1:1, puedes agregar un poco de CSS personalizado en tu tema o dentro del personalizador de WordPress (en la sección de CSS adicional):
.custom-grid .woocommerce-product-gallery img {
width: 100%;
height: 100%;
object-fit: cover;
aspect-ratio: 1/1;
}
Este CSS se asegura de que las imágenes se adapten al espacio de su contenedor, manteniendo siempre una relación de aspecto 1:1, lo que garantiza que todas las imágenes aparezcan cuadradas y uniformes.
Explicación:
limit="4": Muestra 4 productos.columns="4": Muestra los productos en 4 columnas.orderby="date"yorder="DESC": Muestra los productos en orden descendente según la fecha, es decir, los productos más recientes primero.object-fit: cover;: Asegura que la imagen se recorte para llenar el área del contenedor, manteniendo la relación de aspecto 1:1 sin deformarse.aspect-ratio: 1/1;: Mantiene la proporción cuadrada de las imágenes.