En Warehouse, bajo Prestashop 1.7, nos aparecen las imágenes de productos con tamaños distintos y muy desorganizadas  

 
Sergio
 Sergio
Usuario experto

Hola a todos de nuevo:

.... Pues aquí seguimos migrando de 1.6 a 1.7. En la migración, escogimos la plantilla Warehouse, por que nos permite que la nueva página sea muy visual e intuitiva, pero nos estamos encontrando con problemas que no sabemos ya cómo solucionar. El tema está en que al sacar las imágenes de los productos dentro de las categorías (también los productos destacados en la página principal), algunos aparecen con el tamaño cuadrado que le hemos dado en Diseño--> Ajustes de imágenes, pero otros aparecen con el mismo ancho, pero mucho más altas. En la plantilla anterior que utilizábamos de Prestashop 1.6 (y en la de por defecto de 1.7), las imágenes las lleva a una medida estandarizada, de manera que aparecen todas cómo si fuera una cuadrícula, totalmente colocada. Con esta plantilla, por algún motivo, aparecen de esta manera. Ya decimos que hemos modificado en Diseño--> Ajustes de imágenes y les hemos dado un tamaño de 125x125 y hemos hecho la regeneraciónd de miniaturas, pero las que tenemos subidas que tienen un tamaño alto, aparecen con esos 125 px de ancho, pero claro, más altas. Nos ocurre también con las categorías ..... ¿Alguna idea?

Adjuntamos algunos pantallazos .....

URL del sitio: Contenido solo visible a usuarios registrados

Citar
Respondido : 24/11/2019 3:07 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Sergio.

La Web esta en mantenimiento y no podemos revisarlo.
Necesitamos que abras la web para por ver si podemos hacer algo.

Por lo que puedo ver las imágenes tiene tamaños distintos y re-dimensiona a un alto completo.
Hay que respetar los tamaños e intentar que todas las imágenes que subas tengan el mismo tamaño.

Un saludo

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 24/11/2019 4:45 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Sergio
 Sergio
Usuario experto

Estimado Pepe:

Gracias por responder. He quitado la página de mantenimiento (aunque he activado el modo catálogo, para evitar que puedan hacerse compras).
Sabemos que deberían de subirse todas las imágenes con el mismo tamaño, pero la página viene de una migración (de Contenido solo visible a usuarios registrados

Lo mismo ocurre con todo lo que tiene menos altura de lo normal: Los fabricantes, las categorías, los productos ...... todo. En la versión 1.6 nos los redimensiona a cuadrado y en la versión de 1.7 (plantilla warehouse) no redimensiona nada, lo pone con su altura (para más o para menos) normal.

¿Sabéis por que no redimensiona a cuadrado?¿Hay alguna manera de que lo haga? A lo peor es algo intrinseco de la plantilla y no tiene solución, pero así queda todo muy mal......

ResponderCitar
Respondido : 24/11/2019 6:27 pm
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Sergio.

Puedes añadir un tamaño máximo para el alto de la imagen, pero pienso que la mejor solución sigue siendo que subas la imagen con los mismos tamaños.

Añade lo siguiente al final del archivo de estilos css de la plantilla, no se si usas un archivo custom ya que carga en cache y no puedo verlo.

.product-miniature-default .product-thumbnail img {
    max-height: 150px;
}

Ten en cuenta que las imágenes se redimensioan a su ancho y al reducir el alto, la imagen puede quedar achatada

Prueba a regenerar las miniaturas accediendo a Diseño -> Ajustes de Imágenes

Un saludo

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 24/11/2019 7:09 pm

Cursos Gratuitos WordPress

Sergio
 Sergio
Usuario experto

Estimado Pepe:

Gracias de nuevo. Efectivamente, al aplicar el CSS, las imágenes aparecen achatadas. ¿Existiría un código CSS que lo que haga es que "encuadre" de alguna manera las imágenes, es decir, que la que tenga más ancho que largo le meta algo más de largo (centrándola) y la que tenga más largo que ancho, le meta más ancho? Es que hay ciertas cosas que no entiendemos:

* Por un lado, no entedemos por qué, si en la configuración de ajustes de imágenes, le ponemos que le medida de imágenes es 125x125, no respeta esto. También es verdad que no sabemos muy bien manejar esta configuración, pero creemos que la tenemos correctamente configurada (de todas maneras, mandamos un pantallazo, ya que puede ser que el problema radique ahí).

* Por otro lado, no entendemos por qué cualquier otra plantilla automáticamente sí que reajusta directamente el encuadre y redimensionado de las imágenes, y esta, que se supone que es más avanzada, no nos lo está haciendo. ¿Podría ser un bug en la plantilla?

Las imágenes están ya todas subidas. ¿Existe alguna aplicación o o módulo que nos permita de manera automática redimensionar todas ellas a un formato cuadrado y que las deje centradas?

Sé que son muchas dudas, pero es que no controlamos ya hasta este punto .....

Gracias de nuevo.

ResponderCitar
Respondido : 24/11/2019 11:24 pm
Sergio
 Sergio
Usuario experto

.... perdón: Se nos olvidó adjuntar el pantallazo en el mensaje anterior:

ResponderCitar
Respondido : 25/11/2019 7:39 am

wpdoctor-revisa-la-salud-de-tu-wordpress

Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Sergio.

Por un lado, no entedemos por qué, si en la configuración de ajustes de imágenes, le ponemos que le medida de imágenes es 125x125, no respeta esto.

Lo respeta pero a un alto alto del 100%, es decir las medidas a parte de estar en el media son definidas el los estilos CSS por ejemplo para las imágenes de las miniaturas :

.elementor img {
    height: auto;
    max-width: 100%;
}

Si te das cuenta el ancho de la imagen es del 100% y el alto es automático, es decir que mostrará todo el alto de la imagen.

Si modificamos el ancho para que sea por ejemplo del 50%, las imágenes se ajustarán al alto pero serán muy pequeñas, por eso le pusimos en el anterior código un alto máximo, pero como puedes ver se achatan las imágenes.

como te digo por defecto se generan las imágenes a un alto automático, puedes cambiarlo para que se ajusten a un Ancho automático pero seguirás con el mismo problema, en este caso al ancho:

Eso pasa con cualquier plantilla tanto de prestashop, como de WordPress o Joomla, las imágenes no se recortan, se redimensionan.

Tienes el siguiente modulo, pero ya sabes que prestashop es todo de pago:
-> https://addons.prestashop.com/es/fotos-productos/18490-cambiar-el-tamano-de-fotos-crop.html

Un saludo

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 25/11/2019 11:21 am
Sergio
 Sergio
Usuario experto

Hola. Mezclando un poco las dos respuestas, veo que me funciona con el siguiente código:

.product-miniature-default .product-thumbnail img {
height: 125px;
width: auto;
}

Con esto, sí redimensiona correctamente. Quisiera utilizar lo mismo para las subcategorías y los fabricantes. Imagino que habrá que ambiar la primera parte ( .product-miniature-default .product-thumbnail img). No conocemos prácticamente nada de CSS. Disculpadnos. ¿Cual sería el código correcto para cada uno de estos? Gracias de nuevo y perdonad nuestra ignorancia.

Un cordial saludo.

ResponderCitar
Respondido : 25/11/2019 8:39 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

Jhon Marreros Guzman
 Jhon Marreros Guzman
Soporte CMS Webempresa Moderator

Hola

Con respecto a las subcategorías, prueba con el siguiente código CSS:

.product-list-subcategories .subcategory-image a{
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}

Puedes comprobarlo refrescando el navegador, por ejemplo en.
Contenido solo visible a usuarios registrados

Saludos.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 25/11/2019 8:53 pm
Sergio
 Sergio
Usuario experto

Perfecto. Con eso quedan genial. Voy a ver si aprendemos algo de CSS, que parece que nos va a hacer bastante falta con esta plantilla. La anterior que teníamos para 1.6 era la Cilene (la montamos de Webempresa) y nos iba genial, todo automático, pero esta parece que necesita toques algo personales. Que pena que la Cilene no esté para 1.7, nos habría ahorrado muchísimo trabajo.

Gracias por vuestra extraordinaria ayuda, cómo siempre.

ResponderCitar
Respondido : 25/11/2019 10:24 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Bulmaro
 Bulmaro
Soporte CMS Webempresa Moderator

Hola Sergio,

Me alegra que hallas podido solucionar el problema, recuerda que estamos para resolver tus dudas y problemas que surjan en tus proyectos de desarrollo.

Saludos 🙂

Bulmaro Arellano N.

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio

¡Gracias!.

ResponderCitar
Respondido : 25/11/2019 11:06 pm

Por favor Iniciar Sesión o Registro