Medios: imagen

En el panel Page Builder, expanda Media y arrastre un marcador de posición Image al contenedor de destino.

Puede agregar una imagen a una fila, columna o pestaña. En el ejemplo siguiente, la imagen se arrastra a una columna vacía.

{width="600" modal="regular"}

Utilice uno de los siguientes métodos para agregar el recurso de imagen:

{width="500" modal="regular"}

• ​ Cargar una nueva imagen ​: use este método para cargar un nuevo archivo de imagen desde el sistema.

  • Haga clic en Upload Image.

  • Busque y elija la imagen para agregarla a la galería y al contenedor de destino.

  Como alternativa, también puede arrastrar un archivo de imagen desde el sistema y soltarlo en el icono Cámara ( {width="20"} ).

• ​ Seleccionar un recurso existente ​: utilice este método para seleccionar un recurso de imagen existente del almacenamiento o galería de medios.

  • Haga clic en Select from Gallery.

  • Utilice el árbol para desplazarse a la imagen.

  • Haga clic en la miniatura y luego en Add Selected.

    {width="600" modal="regular"}

• ​ Busque y seleccione una imagen de Adobe Stock ​: Utilice este método para encontrar una imagen de Adobe Stock.

  note note
  NOTE
  Este método requiere una integración de Adobe Stock configurada para su administrador.

  • Haga clic en Search Adobe Stock y busque una imagen.

  • Guarde la vista previa o la imagen con licencia en la galería.

    Consulte Uso de imágenes de Adobe Stock para obtener más información sobre cómo trabajar con recursos de Adobe Stock.

  • Seleccione la miniatura del recurso en la galería y haga clic en Add Selected.

La imagen aparece en el contenedor de destino en la ubicación del marcador de posición. A diferencia de una imagen de fondo, puede mover la imagen a una posición diferente dentro del contenedor actual o a un contenedor diferente.

{width="500" modal="regular"}

Pase el ratón sobre el contenedor de imágenes para ver el cuadro de herramientas y elija el icono Configuración ( {width="20"} ).
El nombre, las dimensiones y el tamaño del archivo aparecen debajo de la imagen actual.

{width="600" modal="regular"}

Para cambiar el(la) Image actual(a), realice una de las siguientes acciones:

• ​ Cargar una nueva imagen ​: use este método para cargar un nuevo archivo de imagen desde el sistema.

  • Haga clic en Upload Image.

  • Busque y elija la imagen para agregarla a la galería y al contenedor de destino.

• ​ Seleccionar un recurso existente ​: utilice este método para seleccionar un recurso de imagen existente del almacenamiento o galería de medios.

  • Haga clic en Select from Gallery.

  • Utilice el árbol para desplazarse a la imagen.

  • Haga clic en la miniatura y luego en Add Selected.

    {width="600" modal="regular"}

• Busque y seleccione una imagen de Adobe Stock: Utilice este método para encontrar una imagen de Adobe Stock.

  note note
  NOTE
  Este método requiere una integración de Adobe Stock configurada para su administrador.

  • Haga clic en Search Adobe Stock y busque una imagen.

  • Guarde la vista previa o la imagen con licencia en la galería.

    Consulte Uso de imágenes de Adobe Stock para obtener más información sobre cómo trabajar con recursos de Adobe Stock.

  • Seleccione la miniatura del recurso en la galería y haga clic en Add Selected.

Para agregar un(a) Mobile Image, utilice los mismos métodos descritos en el paso anterior para seleccionar una imagen que se utilizará para su visualización en dispositivos móviles.

{width="600" modal="regular"}

Si es necesario, especifique un Link para la imagen.

El vínculo es la página de destino que aparece cuando el cliente hace clic en la imagen. Puede utilizar uno de los tres tipos de vínculos:

• URL: vínculos a una dirección URL relativa o completa.

• Product: identifica la página de destino según el nombre o el SKU del producto. Busque el producto por nombre en función de un nombre parcial o completo. Elija el producto de la lista de resultados de búsqueda.

  {width="600" modal="regular"}

• Category - Identifica la página de destino como una categoría o subcategoría específica en el árbol de categorías. Busque la categoría en función de un nombre parcial o completo. Elija la categoría de la sección expandida del árbol mostrado.

  {width="600" modal="regular"}

• Page - Identifica la página de destino como una página de contenido específica. Busque la página en función de un nombre parcial o completo. Elija la página en la lista de resultados de la búsqueda.

  {width="600" modal="regular"}

Si desea evitar que el visitante salga de su tienda, active la casilla de verificación Open in new tab. Cuando se desactiva la casilla de verificación, el destino vinculado se abre en la misma pestaña del explorador, lo que podría sacar al visitante de la tienda.

Para agregar un Image Caption, escriba el texto que desea que aparezca debajo de la imagen.

El formato del pie de ilustración viene determinado por la hoja de estilo asociada a la temática actual.

El pie de ilustración suele aparecer debajo de la imagen y proporciona información sobre la imagen para visitantes y motores de búsqueda. Si el sitio está disponible en varios idiomas, puede utilizar la misma imagen, pero traducir el pie de ilustración. En HTML, la etiqueta <figcaption> es un subconjunto de la etiqueta <figure>. <figcaption>This is the image caption</figcaption>

Actualice cualquiera de las otras opciones según sea necesario:

• Optimización del motor de búsqueda
• Avanzadas

Una vez finalizado, haga clic en Save para aplicar la configuración y volver al área de trabajo Page Builder.

Pase el ratón sobre el contenedor de imágenes para ver la caja de herramientas y elija el icono Mover ( {width="20"}).

{width="500" modal="regular"}

Seleccione y arrastre la imagen a la nueva posición, justo debajo de la guía roja.

{width="500" modal="regular"}

Pase el ratón sobre el contenedor de imágenes para mostrar la caja de herramientas y elija el icono Quitar ( {width="20"} ).

Cuando se le pida que confirme, haga clic en OK.