sualizar dos column...
 
Avisos
Vaciar todo

sualizar dos columnas de productos en version movil de prestashop 1.7.4.2

2 Respuestas
2 Usuarios
0 Reactions
5 Visitas
Respuestas: 9
Active Member
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Hola!

Estoy siguiendo los varios consejos que voy encontrando pero no logro mi objetivo, a ver si algún puede echarme un cable!

Necesito que se visualicen dos columnas verticales de productos en la versión móvil de mi prestashop 1.7.4.2, he probado modificando el codigo de custom.css pero no consigo ningún cambio.

Alguien que conozca o sepa como hacerlo?

 

Muchas gracias de antemano!

Contenido solo visible a usuarios registrados


 
Respondido : 13/03/2022 4:12 pm
Tags del tema
Karen Rios
Respuestas: 19409
Illustrious Member Moderator
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Hola Alejandro, 

Generalmente, para modificar esto necesitas añadir algo de CSS personalizado que te permite adapta lo que necesitas, en este caso puedes probar el siguiente código CSS que debes añadir en el archivo global.css o custom.css 

@media only screen and (max-width: 767px) {


#products .product-miniature, .featured-products .product-miniature {
margin: 0 auto;
max-width: 50%;
}

.featured-products .thumbnail-container, .product-miniature .thumbnail-container {
height: 234px;
width: 170px;
}

.featured-products .product-description, .product-miniature .product-description {
width: 170px;
height: 94px;
}
#products img, .featured-products img, .product-accessories img, .product-miniature img {
margin-left: 4px;
width: 100%;
}
span.discount-amount.discount-product {
top: -145%!important;
}

}

Verifica esto y nos comentas como ha ido todo

Un Saludo 


 
Respondido : 13/03/2022 4:35 pm