Componentes | Imagen

El componente "Imagen" permite insertar una imagen en el contenido.

Por defecto, se añade dentro de las secciones (Ver aquí) y los popups (Ver aquí), aunque también se podrá añadir en el interior de otros componentes (por ejemplo, dentro de un destacado, un acordeón, una fila, etc.)

Encontraremos este componente en el grupo de componentes "Imagen".

Componentes internos

Una imagen puede albergar en su interior dos componentes:

Créditos, que cuentan con propiedades específicas para definir su color y su posición en la imagen (arriba, abajo, derecha, izquierda...)
Pie de foto, que se sitúa en la zona inferior de la imagen. Este componente cuenta con propiedades especificas que también tiene el componente "Texto". (Para conocer el comportamiento de estas propiedades, visita el aquí)

Propiedades de la imagen

PROPIEDAD DESCRIPCIÓN Estilo

Permite definir la posición de la imagen con respecto a la columna central de contenidos:

Centrada al contenido.
Desborda a la derecha
Desborda a la izquierda
Ancho contenido
Desborda ambos laterales.

Título Título de la imagen. Texto alternativo Texto descriptivo de la imagen. Se mostrará cuando el usuario sitúe el ratón sobre la imagen o, en caso de que ésta no se cargue, se verá este texto en su lugar. Recurso Fichero de imagen que se visualizará. Pulsaremos "Examinar" para acceder a la carpeta de Recursos de la unidad (ver aquí) y seleccionar en ella la imagen deseada. Se admiten imágenes con formato jpeg, png y gif. Enlace a popup Permite convertir la imagen un elemento interactivo, enlazándola a un popup (Ver cómo crear y gestonar popups aquí). Esta propiedad es excluyente con respecto a las propiedades "Enlace a recurso" y "Enlace externo", es decir, si se enlaza la imagen a un popup, no podrá enlazarse al mismo tiempo a, por ejemplo, un recurso. Enlace a recurso Permite enlazar la imagen a un fichero PDF o ZIP. Pulsaremos "Examinar" para acceder a la carpeta de Recursos de la unidad (ver aquí) y seleccionar en ella el fichero que se desea enlazar. Esta propiedad es excluyente con respecto a las propiedades "Enlace a popup" y "Enlace externo", es decir, si se enlaza la imagen a un recurso, no podrá enlazarse al mismo tiempo a, por ejemplo, un popup. Enlace externo Permite enlazar la imagen a una url Esta propiedad es excluyente con respecto a las propiedades "Enlace a popup" y "Enlace a recurso", es decir, si se enlaza la imagen a una web no podrá enlazarse al mismo tiempo a, por ejemplo, un popup. Posición del icono del link

Si hemos añadido un enlace en la imagen (ya sea a un popup, a un recurso o a una url), se añadirá automáticamente un icono sobre la imagen para indicar que es interactiva. Con esta propiedad podremos decidir dónde se colocará el icono: en la zona superior izquierda, superior derecha, inferior inzquierda o inferior derecha.

Icono del enlace (40x40px) Por defecto, cuando añadimos en enlace a una imagen, se incluye el siguiente icono:

Esta propiedad nos permitirá sustituirlo por cualquier otra imagen que deseemos. El nuevo icono deberá tener un tamaño máximo de 40x40 píxeles y se recomienda que sea un fichero png con fondo transparente, para que se ajuste bien a la imagen.

Ancho

Permite modificar el espacio que ocupa el componente dentro de la columna central de contenidos. Por defecto, ocupa el 100% del espacio disponible, pero puede reducirse utilizando otros porcentajes predefinidos o puede disponerse a "full-size". En algunos estilos de las citas, el tamaño "Full" hace que ésta sobrepase al ancho de la columna central.

Alinear Permite situar el componente alineado a la derecha, a la izquierda o al centro de la columna central de contenidos. Solo tiene efecto cuando aplicamos un "Ancho" menor al 100%. Flotar

Permite que la imagen quede "enmarcada" en torno a un texto.

Primero, en la propiedad "Ancho", marcamos un tamaño menor al 100% (por ejemplo, el 25%).
En la propiedad "Flotar" decidimos en qué posición queremos que quede flotada la imagen (a la izquierda o la derecha del texto).
Movemos la imagen con sus flechas para colocarla sobre el texto.