D3. Imágenes - Regeneración tamaños imágenes

Desde la sección del menú del gestor Otros->Apariencia->Tamaños de las imágenes puede ajustar el tamaño de las imágenes.

En una lista se muestran los tamaños de imágenes establecidas para cada tipo de visualización pública o desde el gestor de las imágenes en la tienda. 

Todas las imágenes subidas a la aplicación son redimensionadas según los tamaños aquí establecidos. Desde el panel se pueden crear nuevos tamaños y modificar los existentes.

Los tamaños establecidos son:

1. Thumb

Se visualiza en el gestor:

2. List

Ha de estar marcada como por defecto. Se visualiza en la vista del cliente en los productos vistos desde la categoría y en los valores de las características.

                                       

3. Preview

Se visualiza en la vista de la categoría en modo tarjeta.

4. Slider

Se visualiza en la ficha de producto.

 A tener en cuenta

Para que partes de la imagen no se vean, no queden espacios en blanco o pierdan calidad hay que subir la imagen en tamaño proporcional al especificado en Ajustes> Apariencia> Tamaños de imágenes> Tipo correspondiente.

Si se dispone de imágenes en un tamaño y proporción concreta que no se quiere modificar se puede modificar en Ajustes> Apariencia> Tamaños de imágenes> Tipo correspondiente, el tamaño de la visualización. El tamaño se expresa en pixeles de ancho y de alto. 

Una vez modificado el tamaño han de regenerarse todas las imágenes del tipo modificado. Y vaciar caché en el gestor y en el navegador.

¡Atención! No modificar los nombres los tamaños creados por defecto ya que pueden ocasionar pérdida de funcionalidades básicas.

A) Por defecto cuando se sube una imagen, el sistema crea las copias de la imagen redimensionadas en la vista pública y en la vista desde el gestor en función de los tamaños creados en esta lista.
Para ver más detalles de que tipo de redimensionamiento se está usando inspeccionar con el navegador el código de la imagen.

Ejemplo de inspeccionar la imagen de la categoría en la vista pública en modo tarjeta en la página de inicio.

Se puede ver en la url de la imagen, antes de la extensión del archivo, el tipo de redimensión. En este ejemplo leemos e interpretamos que se está usando el tipo "preview". 

B) Ancho en el que se redimensiona la imagen cuando es reproducida.
C) Alto Ancho en el que se redimensiona la imagen cuando es reproducida.
D) Definir si se quiere que la imagen ocupe todo el espacio disponible o se dejen espacios en blanco. 

e) Utilizar marca de agua. Sólo para uso por Soporte técnico.

F) Botón de ver ajustes de la imagen y acciones rápidas como actualizar o eliminar.
G) Selector de tipo de de imágenes a regenerar. Tres opciones. 

• • Tipo: Regenera todas.
  • Todos los productos:  Sólo regenera las de los productos.
  • Todas las categorías: Sólo regenera las de las categorías.
    
    

H) Si se selecciona uno de los dos tipos "Todos los productos" o "Todas las categorías" en el selecto anterior g) , es requerido seleccionar el tipo de visualización de imagen que queremos regenerar.

Si en el selector g) se selecciona la opción "Tipo" no será requerido seleccionar nada en el selector h).
Se regeneran las visualizaciones de todas las imágenes.  Aquellas en las que no se haya modificado el tamaño se regenerarán en el tamaño que tenían.

I) En la parte inferior de la pantalla, se muestra el botón de Regenerar. Al hacer clic en él se comenzará la regeneración de las imágenes. Es necesario regenerar las imágenes en estos dos supuestos.

I.1 Se cambian las medidas de  alguna de las dimensiones de las imágenes es necesario regenerar las imágenes del tamaño modificado en el tipo de vista que interese (selectores g) y h)).

I.2) Al Importar productos, es recomendable regenerar todas las imágenes, sin especificar el tipo de visualización.

J) Texto enlace para visualizar los reportes del último proceso de regeneración realizado. 

A partir de la V3.28.2

El sistema de regeneración de imágenes. Ahora se pueden pausar y continuar (reanudar) las tareas que se encargan de regenerar imágenes. 

Ejemplos de regeneración de imágenes

Tipo list producto en vista cliente página de incio por defecto ejemplo de regeneración.

Tamaño ajustado de la imagen list de productos en el gestor.

Imagen list de producto de 300 x 200 px. vista desde el cliente en página de inicio.

Se modifica y regenera la imagen tipo "list" de productos en el gestor a tamaño proporcional  de 600 x 400 px.

Se regeneran todos los productos el tipo "list". Se vacía caché.

Se refresca el  navegador en la vista pública y se ve la imagen de tipo "list" de productos desde el cliente en página de inicio redimensionada proporcionalmente.

La aplicación escalará las imágenes para adaptarlas al tamaño de vista.  
También al ser escaladas las imágenes es posible que en algunas de las vistas ciertas partes de la imagen no se vean. En el listado de tipos de imágenes se presenta el acceso a los ajustes de éstas. Con el botón "Llenar" se puede definir en cada tipo si se quiere o no que las imágenes sean adaptadas para llenar proporcionalmente el espacio de visualización . 

La imagen de categoría, vista del lado del cliente dentro de la categoría, se adapta siempre al 100% de la pantalla. El ancho de la pantalla varía si está ajustado en ancho encajado o en ancho completo . Aunque tenga establecido un tamaño menor en "Tamaños de imágenes", no le afectará.