Cómo agregar una imagen a tu sitio web
En el creador de sitios web de SendPulse, puedes agregar el widget Imagen, editarla, y aplicar varios efectos.
En este artículo, te enseñamos cómo personalizar las imágenes de tu sitio web.
Subir una imagen
Dentro del creador de sitios, haz clic en Agregar un nuevo widget y selecciona el elemento Imagen.
Luego, haz clic en Elegir archivo y selecciona o agrega la imagen deseada.
A continuación te mostramos lo que puedes hacer con tu imagen:
| Editar | Haz clic en el ícono de la imagen.
Más información: Cómo editar imágenes con el creador de sitios web. |
| Subir nuevo | Haz clic en el ícono de subir. |
| Ajustes | Haz clic en el ícono del lápiz. Puedes agregar textos, enlaces, y efectos a tu imagen. |
| Eliminar | Haz clic en el ícono de la papelera. |
Ajusta la apariencia de la imagen
Puedes ajustar el ancho y alto de tu imagen:
| Escala | Modifica el tamaño de la imagen según el ancho especificado en píxeles, conservando las proporciones originales de la imagen. |
| Llenar | Modifica el tamaño de la imagen, cubriendo todo el espacio del bloque según la altura especificada en píxeles. Las proporciones de la imagen pueden cambiar. |
También puedes agregar bordes, sombras, redondeado, y alineación a tu imagen. Los estilos para la versión móvil se configuran y sincronizan automáticamente. Por lo que, si deseas, realizar ajustes específicos en esta versión, deberás desactivar la sincronización.
Para activar la animación de movimiento, activa la opción correspondiente.
Luego, elige el tipo de animación, la dirección y velocidad deseada.
Leer también: Cómo personalizar los elementos de tu sitio.
Agrega efectos y atributos a la imagen
Haz clic en el ícono del lápiz situado a la derecha de tu imagen para añadir atributos, texto, enlaces o efectos. Puedes incluir un texto alternativo que aparecerá si se produce un error al cargar la imagen y también añadir enlaces a otras páginas o recursos para que los usuarios puedan obtener más información al hacer clic sobre ella.
Agrega atributos
Si la imagen no es visible, podrás añadir un texto alternativo que se mostrará en su lugar. De igual manera, también es posible agregar enlaces que permitan redireccionar al usuario a otro sitio que ofrezca más información, haciendo clic en la imagen.
Agrega efectos
Activa la opción Contenido de la imagen para cambiar el efecto de tu imagen. Y selecciona la condición que deseas visualizar:
| Siempre | Visualización estática |
| En desplazamiento | Visualización dinámica al deslizar el cursor. |
Efectos estáticos
En el campo de Superposición, selecciona una opción:
| Mostrar texto | Añade un texto superpuesto a tu imagen. También puedes ajustar el tamaño del texto, mayúsculas, hacer énfasis (negrita o cursiva), el color de texto y fondo, el espaciado interno y la posición.
El texto no puede tener más de 100 caracteres. |
| Aplicar forma | Recorta la imagen para darle forma. |
Luego, haz clic en Guardar.
Efectos de desplazamiento
En el campo de Acción, selecciona una opción de visualización dinámica:
| Mostrar en texto | Muestra el texto superpuesto. También puedes ajustar el tamaño del texto, mayúsculas, hacer énfasis (negrita o cursiva), el color de texto y fondo, el espaciado interno y la posición. |
| Cambiar imagen | Reemplaza tu imagen por otra seleccionada. |
| Aumentar | Amplía la imagen al deslizar el cursor por encima. |
| Reducir | Reduce la imagen al deslizar el cursor por encima. |
Haz clic en Guardar.
Copia el ID de tu elemento
Cada imagen tiene un ID con el que es identificado en la página. A través de él, puedes añadir estilos, scripts, mostrar ventanas emergentes y rastrear los eventos de este elemento.
Para copiar un ID, haz clic en él. Para editarlo, haz clic en el ícono del lápiz.
Más información: ID de Bloques y Widgets.
Última actualización: 07.03.2024
o