Con el editor de imagen y texto de HostPapa, puedes agregar imágenes a tus documentos, ya sean blogs, catálogos, guías o presentaciones. Nuestro Creador de sitios web te ayudará a lograr resultados increíbles con imágenes que impresionarán a tus clientes y visitantes.
Para saber cómo acceder a tu Creador de sitios web, visita este artículo.
Antes de comenzar, es importante entender que un elemento inline es el que se muestra dentro de la misma línea. Esto significa que el elemento añadido no obliga al texto posterior a comenzar en una línea nueva. Como ejemplo, al poner en negrita más de una palabra en una oración, ninguna de las palabras comenzará en una línea nueva.
Agregar imágenes a tus páginas web
Existe más de una manera de agregar una imagen a tu página web en nuestro Creador de sitios web, y este artículo cubre esas tres opciones:
- Preferencia #1: en la categoría Text & Images, como elemento inline mediante el elemento Texto.
- Preferencia #2: por medio del elemento Image & Text, donde puedes agregar imágenes adicionales también como elementos inline
- Preferencia #3: una vez más desde la categoría Text & Images, pero como un único elemento de imagen.
Ten en cuenta que si eliges la preferencia #3 como tu método preferido, no podrás agregar elementos de contenido adicionales simultáneamente, como texto o video. Este no es el caso con las preferencias #1 ni #2
Subir tus imágenes para comenzar
Para subir tus imágenes, sigue estos pasos:
- Abre el panel de propiedades.
- Arrastra y suelta tus imágenes o haz clic dentro del área de la imagen para elegir un archivo de tu disco duro o almacenamiento en la nube.
- También puedes elegir la opción Add from URL:
Esta opción te permite utilizar una imagen que ha sido publicada en otro sitio. Si eliges hacer esto, los pasos son:
- Copia la dirección URL de la imagen que deseas utilizar.
- Pega la dirección dentro del campo URL.
- Haz clic en la opción Add Image.
Nota: si la imagen tiene un símbolo de almohadilla (#) o un signo de interrogación (?) en la dirección URL, necesitarás utilizar la opción arrastrar y soltar para subir la imagen.
Otro método que puedes usar es la pestaña Biblioteca de imágenes, de donde puedes escoger entre una amplia variedad de imágenes de stock.
Una vez que tu imagen se ha subido, se ajustará automáticamente en un tamaño predeterminado. Puedes elegir entre:
- Establecer tu imagen a uno de cuatro tamaños: pequeño, mediano, grande, tamaño real o un tamaño personalizado de tu elección.
Toda imagen alterada se mostrará en alta resolución y la imagen original se conservará en caso de que sea necesario modificarla nuevamente.
Si haces clic en tu imagen, se abrirá un panel de edición en el lado derecho de tu pantalla. Aquí se te darán opciones como:
- Personalización
- Ajuste de tamaño
- Borde
- Estilos y efectos de ajuste
Si deseas que el texto aparezca una vez que se coloque el cursor del mouse sobre la imagen:
- Coloca el cursor en el cuadro Mouse-over Caption.
- Escribe la descripción de la imagen con el texto de tu elección. Ya que los subtítulos emergentes están relacionados con la optimización para motores de búsqueda (SEO), es importante que los subtítulos expliquen claramente qué muestra la imagen.
Agregar modificaciones adicionales a tus imágenes
Hay una gran selección de cambios que puedes realizar en tus imágenes. Aquí te mostramos una lista de lo más importante en el cuadro Propiedades de la imagen.
Aplicación de alineación, enlaces y efectos de la imagen
- Si seleccionas la opción Image Alignment, puedes decidir tener el texto a la derecha o a la izquierda de tu imagen.
- La selección Link te permite agregar un vínculo. Al hacerlo, aparecerá un submenú, que explicaremos en la siguiente sección.
- El menú desplegable Image Effects te permite agregar inclinación, reflejo y otros efectos a tu imagen.
Como mencionamos anteriormente, al seleccionar la opción Link, en la parte inferior derecha del menú aparece el siguiente submenú.
Bordes y relleno
Puedes modificar el espacio alrededor de tu imagen realizando lo siguiente:
- Selecciona el relleno superior, inferior, izquierdo y derecho en pixeles.
- También tienes la opción de agregar un Borde a las imágenes. Puedes hacerlo realizando lo siguiente:
- Especificar el ancho del borde de tu imagen en pixeles y seleccionar el color deseado.
- Hacer clic en el ícono Border Color para abrir el cuadro de herramientas de color donde podrás aplicar o quitar el color del borde.
Imagen al pasar el cursor
En la parte inferior del menú Image Properties, verás la opción Mouse-over Image.
La herramienta Mouse-over Image indica a los visitantes del sitio que algo ocurrirá al hacer clic en una imagen. Esto también aplica a un vínculo añadido sobre una imagen.
Transiciones
Si deseas agregar una transición a una imagen al pasar el cursor, sigue estos pasos:
- Carga un segundo archivo de imagen en la opción Mouse-Over Image.
- Selecciona el efecto de transición que se usará entre dos imágenes en tu página web.
Si necesitas ayuda con tu cuenta de HostPapa, abre un ticket de soporte desde tu Escritorio.