Cómo agregar texto encima de una imagen en WordPress (3 métodos)

Agregar texto en la parte superior de una imagen es una técnica popular para mejorar el atractivo visual de su contenido o sitio web. Además, es una excelente manera de hacer que sus imágenes sean más informativas y atractivas.

En este artículo, hemos encontrado tres formas fáciles de agregar texto sobre una imagen en WordPress. Ya sea que prefiera usar el Editor de Bloques, un plugin o código personalizado. ¡Vamos a descubrirlo!

Por qué es importante agregar el texto en la parte superior de las imágenes

Antes de avanzar hacia los métodos, debe conocer la razón detrás de por qué es importante agregar texto en la parte superior de las imágenes.

1. Captar la Atención

Si los usuarios se desplazan rápidamente por el contenido, agregar imágenes por sí solo puede no ser suficiente para captar su atención. Es por eso que necesita agregar texto sobre una imagen para ayudar a captar la atención de los usuarios y transmitir su mensaje de manera más efectiva.

2. Mejorar la experiencia del usuario

Es cierto que las imágenes pueden proporcionar mucho valor por sí solas, sin embargo, agregar texto encima de ellas, como leyendas, citas u otro contenido basado en texto, puede hacerlas aún más útiles. Además, los usuarios pueden entender el contexto de la imagen y cómo se relaciona con su contenido.

3. Mejorando la Accesibilidad

También puede ayudar a mejorar la accesibilidad para los usuarios que pueden tener dificultades para ver la imagen en sí. Al proporcionar una alternativa de texto, puede asegurarse de que su contenido sea accesible para un rango más amplio de usuarios.

4. Mejorando el SEO

Agregar palabras clave relevantes a los pies de foto o al texto alternativo puede mejorar el posicionamiento de tu sitio web en los motores de búsqueda. Esto se debe a que los motores de búsqueda utilizan esta información para comprender el contenido de tu sitio web y determinar su relevancia para las consultas de búsqueda de los usuarios.

3 métodos Cómo agregar texto sobre una imagen en WordPress

1. Utilice el editor de bloques de WordPress

Primero, vaya a la página o publicación en la que va a agregar el texto sobre la imagen.

Elegir Portada para escribir el texto sobre la imagen.

Después de eso, comenzará a aparecer en su pantalla. Le muestra la imagen predeterminada, pero puede cambiar la imagen como desee.

También puede reemplazar la imagen predeterminada con su imagen personalizada. Haga clic en el botón de reemplazar y luego cargue la imagen o simplemente elija de la biblioteca de medios.

Se verá así, luego puede escribir el texto sobre la imagen como desee.

Haga doble clic en el texto, obtendrá la opción de edición para el texto. Puede ajustar el tamaño, el color y muchos más según su requerimiento.

Por último, haga clic en el botón de actualizar, o si ha agregado la nueva entrada o página, haga clic en el botón de publicar.

2. Usar CSS

Abra el Editor de Bloques de WordPress y seleccione el bloque de imagen donde desea agregar texto. En la barra lateral derecha, haga clic en la pestaña Avanzada .

En el campo Clase CSS Adicional , agregue una clase personalizada para el bloque de imagen.

Guardar los cambios y publicar o actualizar la página o entrada

.clase-personalizada { posición: relativa; } .clase-personalizada p { posición: absoluta; arriba: 50%; izquierda: 50%; transformar: traducir(-50%, -50%); tamaño-de-fuente: 24px; color: #ffffff; sombra-de-texto: 2px 2px 2px #000000; } 

En el código anterior, sustituya "custom-class" por la clase personalizada que añadió al bloque de imagen. También puede personalizar el tamaño de la fuente, el color y otras opciones de estilo según sus preferencias.

3. Utilice el plugin de WordPress

Si deseas tener la libertad de crear diseños de página totalmente personalizados, necesitarás un plugin de creación de páginas. Uno de los plugins de creación de páginas para WordPress es SeedProd, que te permite añadir texto sobre cualquier imagen en todo tu sitio web.

Primero, instala y activa el plugin SeedProd. Tras la activación, deberás introducir una clave de licencia. Inicia sesión en tu cuenta de SeedProd y haz clic en la Descargar pestaña

Una vez hecho esto, copia la clave en la de licencia .

Ahora puedes pegar esta clave en el área de administración de WordPress accediendo a la página SeedProd » Ajustes.

Una vez allí, pega la clave en el campo Clave de licencia. A continuación, simplemente haz clic en Verificar clave.

A continuación, diríjase a SeedProd » Páginas de destino y haga clic en Agregar nueva página de destino.

Después de eso, elija una plantilla. No importa qué plantilla de SeedProd elija, puede personalizar cada parte de la plantilla para que se adapte perfectamente a su sitio web y su marca.

Sin embargo, si prefiere comenzar con una pizarra en blanco, entonces haga clic en la plantilla en blanco.

Una vez que hayas encontrado una plantilla, coloca el cursor del ratón sobre ella. A continuación, puedes hacer clic en el icono de Vista previa.

Si te gusta el aspecto de esta plantilla, haz clic en el botón "Elegir esta plantilla".

En el nombre de la página campo, escriba un nombre para la página.

Si desea cambiar la URL creada automáticamente, edite el texto en el URL de la página campo.

Haz clic en el «Guardar y empezar a editar la página» . Esto abrirá la plantilla en el editor de arrastrar y soltar de SeedProd.

En la barra lateral izquierda, verás todos los bloques y secciones que puedes añadir a tu página mediante la función de arrastrar y soltar.

A menos que uses la plantilla en blanco, tu página de SeedProd ya tendrá algunos bloques y secciones. Para editar este contenido, haz clic para seleccionar el bloque o la sección.

El menú de la izquierda de SeedProd mostrará todas las opciones de configuración disponibles para personalizar este bloque o sección.

La forma más sencilla de añadir texto sobre una imagen es utilizando una de las secciones Hero prediseñadas de SeedProd.

Estas secciones incluyen una imagen de fondo de ancho completo con un texto de ejemplo superpuesto. Simplemente puedes reemplazar la imagen y el texto predeterminados con tu propio contenido.

Haz clic en la pestaña «Sección» del menú de la izquierda.

A continuación, haz clic en «Hero» para ver todas las secciones Hero prediseñadas que puedes añadir a tu página.

Para seguir adelante y agregar esta sección de héroe a su diseño, simplemente haga clic en Elegir esta sección.

Haz clic en la imagen de archivo para seleccionarla si deseas reemplazar la imagen predeterminada de la plantilla con tu propia imagen.

Pasa el cursor sobre de la imagen de fondo hasta que aparezca el icono de la papelera. Luego, haz clic en este icono para eliminar la imagen de marcador de posición.

A continuación, haz clic en « Usar tu propia imagen». Podrás elegir una imagen de la biblioteca multimedia de WordPress o usar una imagen de archivo.

Una vez que hayas añadido la imagen, podrás reemplazar el texto de ejemplo.

Haz clic para seleccionar el bloque de texto. En el área de texto, simplemente escribe el texto que quieras usar.

Algunas plantillas principales de SeedProd incluyen contenido adicional, como botones de llamada a la acción.

Si deseas modificar este contenido, haz clic para seleccionar el bloque y luego realiza los cambios en el menú de la izquierda de SeedProd.

Otra opción es eliminar el bloque de la plantilla de héroe.

Para hacer esto, haga clic para seleccionar el bloque y luego haga clic en el icono de la papelera.

Si estás satisfecho con el diseño de tu página, haz clic en el botón Guardar.

Desde aquí, puedes elegir publicar la página o guardarla como plantilla.

Conclusión

Esos son los tres métodos para añadir texto sobre una imagen en WordPress. ¿Fácil, verdad? Elige el método que mejor se adapte a tu nivel de habilidad y preferencias de diseño.

Además, organiza, optimiza y gestiona tus archivos multimedia como un profesional con WP Media Folder. ¡Es hora de despedirte de las bibliotecas desordenadas!