AX - Imagen

Resumen

AX - Imagen es un componente de Experience Cloud que muestra imágenes en páginas de Experience Sites con control sobre el tamaño, el recorte, la alineación y el comportamiento de carga.

Úsalo para mostrar fotos de productos, logotipos, banners, fotos de perfil o cualquier contenido visual de Salesforce Content Documents, recursos estáticos o URL externas. Configura cómo se muestran, recortan y escalan las imágenes en Experience Builder sin código.

Perfecto para galerías de productos, encabezados con marca, secciones de contenido visual, perfiles o cualquier lugar donde tu portal necesite una presentación de imágenes flexible con tamaño adaptable.

Tutoriales

Nombre	Descripción
Configura el mapa para mostrar información de detalles del registro	Aprende a mostrar registros en Experience Cloud usando Avonni Map.

Configuración

🎛️ Propiedades

Nombre	Descripción	Uso
Imagen de CMS o URL de imagen	Especifica el origen de la imagen, ya sea desde un CMS o directamente mediante una URL de imagen.	Selecciona la fuente que mejor se adapte a tus preferencias de gestión de imágenes y que garantice un acceso y actualizaciones sencillos.
Ancho y alto	Determina el ancho y el alto de la imagen mostrada.	Establece dimensiones que garanticen que la imagen encaje armoniosamente en el diseño de la página sin perder nitidez.
Posición	Ajusta la alineación de la imagen.	Alinea la imagen dentro de su contenedor para mantener un diseño de página equilibrado y estéticamente agradable.
Imagen estática	Opción para establecer la imagen como estática.	Usa esta configuración cuando la imagen no requiera ajustes adaptativos y permanezca constante en distintos tamaños de pantalla.
Fluido y Fluido ampliable	Estas opciones permiten que la imagen ajuste su tamaño de forma adaptable.	Activa estas opciones para que las imágenes se adapten suavemente a diferentes tamaños de pantalla, mejorando la capacidad de respuesta de la página web.
Miniatura	Muestra la imagen como una miniatura.	Utiliza esta opción para presentar la imagen de forma compacta, adecuada para galerías o como vista previa.
Carga diferida	Elige entre la carga automática o diferida de la imagen.	Optimiza los tiempos de carga de la página seleccionando un método de carga que equilibre la visibilidad inmediata y el rendimiento general de la página.
Tamaño de recorte, ajuste del recorte, posición del recorte X e Y	Personaliza el recorte de la imagen para centrarte en las partes relevantes.	Define los parámetros de recorte para garantizar que la imagen muestre de forma destacada las áreas esenciales, mejorando la comunicación visual.
Tipo de lupa	Selecciona el estilo de ampliación que se aplicará al ver los detalles de la imagen.	Mejora la interacción del usuario eligiendo un tipo de lupa que permita explorar la imagen en detalle.
Imagen de comparación de CMS o URL de comparación	Personaliza los atributos de la función de comparación.	Perfecciona la funcionalidad de comparación con atributos que determinen la orientación, la interacción y el etiquetado, garantizando una experiencia de comparación fácil de usar.
Atributos de comparación	Define los detalles específicos de la función de ampliación.	Personaliza el comportamiento y la apariencia de la lupa para garantizar que los usuarios puedan explorar fácilmente los detalles de la imagen.
Atributos de la lupa	Ajusta el redondeo de las esquinas de la imagen.	Suaviza o acentúa las esquinas de la imagen estableciendo un radio de borde adecuado, lo que contribuye a la presentación estilística de la imagen.

🎨 Estilo