🖼️Imágenes

Registra las imágenes de tus productos en el portal.

Es hora de hablar de las imágenes de nuestros productos.

En este listado, podemos ver que hay una animación: al mover el ratón, la imagen cambia. Este cambio es perceptible e indica que el cursor está sobre el producto, además de mostrar otra vista del mismo.

Ahora, accedamos al producto. Al entrar, vemos la foto principal y las fotos adicionales.

Aprendamos cómo registrar estas imágenes en el catálogo de productos. Tenemos la pestaña Imágenes; al acceder a ella, se muestran todas las fotos vinculadas a este producto.

Podemos observar que hay algunas fotos adicionales. Estas imágenes son las responsables de la animación que vimos anteriormente en la lista.

Observe que están marcadas como imágenes aleatorias .

Es necesario vincularlos dos veces, ya que son los que aparecen en nuestro catálogo, realizando ese intercambio visual.

Dentro del producto:

• Esta es la foto principal .

• Y estas son las dos fotos adicionales .

La foto principal se muestra en todo el sistema: se redimensiona para aparecer en el carrito de compra, en la factura y sirve de base para todas las visualizaciones de productos. Es importante destacar esto.

Ahora, aprendamos cómo agregar una imagen adicional . Esta imagen no tendrá el mismo peso que las marcadas como aleatorias en la lista. Recuerda: al agregar un producto por primera vez, no es necesario marcar las imágenes como adicionales , solo las aleatorias. El sistema identifica automáticamente cuáles son las imágenes adicionales y cuál es la principal.

También podemos invertir la posición de la imagen en la portada : basta con mantener pulsada la celda deseada y arrastrar. El cambio se aplicará en cuanto guardemos.

Ahora, aprendamos cómo agregar una imagen destacada . Esta imagen modificará ligeramente el diseño del producto.

Antes de insertarlo, revisemos el producto: al acceder a él, vemos la imagen principal, las imágenes adicionales y ninguna otra imagen en el cuerpo, ¿correcto?

Vamos a insertar una nueva imagen. Seleccionamos la imagen en el ordenador, accedemos al panel de administración y la arrastramos al grupo. Ahora marcamos esta nueva imagen como destacada y guardamos los cambios.

Nuestro portal utiliza un sistema de almacenamiento en caché ; aún no hemos hablado de él, pero ahora vamos a aprender a usarlo.

Seleccionamos la URL del producto , accedimos al panel de administración , pulsamos el botón para actualizar la caché , pegamos la URL seleccionada, volvimos al producto, recuperamos el SKU y lo vinculamos al campo "ID del producto". Después, lo actualizamos.

Al realizar este proceso, borramos la caché del producto y necesitamos actualizar la página.

Ahora, veamos la actualización: las imágenes siguen siendo las mismas, ¡y aquí está la nueva imagen destacada ! Observen que no aparece con las imágenes adicionales; se mostró en una ubicación específica porque seleccionamos esa opción en el panel de administración.

Al volver al registro, accedemos de nuevo a la pestaña de imágenes y vemos que está marcada como imagen destacada , a diferencia de las imágenes adicionales.

Con esto, concluimos esta etapa del producto. Estas son las opciones para categorizar las imágenes según las necesidades de diseño de tu maquetación.