Avisos
Vaciar todo

[Resuelto] Reducir columnas de productos Woocommerce en versión Mobile

4 Respuestas
2 Usuarios
0 Reactions
9 Visitas
Respuestas: 43
Eminent Member
Topic starter
 

Hola, necesito reducir las columnas de los productos que aparecen en mi tienda: https://juegosmontessori.com/tienda , y en las secciones "También te recomendamos..." y "Productos relacionados" de los productos individuales, por ejemplo, https://juegosmontessori.com/producto/soporte-colgador-de-perlas-montesori-11-al-19/ .

En versión móvil salen dos columnas y se ve feo; la idea es que salgan únicamente en una columna, para que sea más bonito y visual.

Lo ideal es que se pueda hacer mediante CSS adicional. Muchísimas gracias!

Contenido solo visible a usuarios registrados


 
Respondido : 01/09/2023 4:36 pm
Karen Rios
Respuestas: 18826
Illustrious Member Moderator
 

Hola Jésica, 

Prueba si con el siguiente código se ajusta la columna como deseas en móvil

@media only screen and (max-width: 600px) {
.woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product {
width: 100%;

}

}

Verifícalo y nos comentas como va todo. 

Un saludo 


 
Respondido : 01/09/2023 5:14 pm
Respuestas: 43
Eminent Member
Topic starter
 

@karen Funcionó a la primera, mil gracias!


 
Respondido : 01/09/2023 5:24 pm
Karen Rios
Respuestas: 18826
Illustrious Member Moderator
 

Hola Jesica, 

Enhorabuena funciona como deseas, es un placer siempre poder ayudarte. 

No dudes en escribirnos si tienes cualquier otra consulta. 

Un Saludo 😊 


 
Respondido : 01/09/2023 5:25 pm