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 títulos de las imágenes o al texto alternativo puede ayudar a mejorar la posición del 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 su sitio web y determinar qué tan relevante es 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

.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, reemplace "clase-personalizada" con la clase personalizada que agregó al bloque de imagen. También puede personalizar el tamaño de fuente, el color y otras opciones de estilo para que coincidan con sus preferencias.

3. Utilice el plugin de WordPress

Si desea tener la libertad de crear diseños de página completamente personalizados, necesitará un plugin de creación de páginas. Uno de los plugins de creación de páginas para WordPress es SeedProd, que le permite agregar texto sobre cualquier imagen en todo su sitio web.

Primero, instale y active el plugin SeedProd. Al activarlo, deberá ingresar una clave de licencia. Inicie sesión en su cuenta de SeedProd, luego haga clic en la descarga pestaña.

Una vez hecho esto, copie la clave en la sección de clave de licencia.

Ahora puede pegar esta clave en el área de administración de WordPress yendo a la página de configuración de SeedProd ».

Una vez que esté aquí, continúe y pegue su clave en el campo de clave de licencia. Luego, simplemente necesita hacer clic en Verificar clave

A continuación, vaya 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 haya encontrado una plantilla, pase el mouse sobre ella. Luego puede hacer clic en el icono de Vista previa.

Si está satisfecho con la apariencia de esta plantilla, continúe y haga 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.

Haga clic en el botón Guardar y comenzar a editar la página. Esto abrirá la plantilla en el editor de arrastrar y soltar de SeedProd.

En la barra lateral izquierda, verá todos los bloques y secciones que puede agregar a su página usando arrastrar y soltar.

A menos que esté utilizando la plantilla en blanco, su página de SeedProd ya tendrá algunos bloques y secciones. Para editar cualquiera de este contenido, haga clic para seleccionar el bloque o sección.

El menú lateral izquierdo de SeedProd ahora mostrará todas las configuraciones que puede utilizar para personalizar este bloque o sección.

La forma más fácil de agregar texto sobre una imagen es utilizando una de las secciones de Hero prediseñadas de SeedProd.

Estas secciones tienen una imagen de fondo con marcador de posición de ancho completo, con algún texto de marcador de posición agregado encima. Puede reemplazar fácilmente la imagen de fondo y el texto predeterminados con su propio contenido.

Haga clic en la sección en el menú de la izquierda.

Luego, haga clic en Hero para ver todas las secciones de héroe prediseñadas que puede agregar a su 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.

Haga clic en la imagen de stock para seleccionarla si desea reemplazar la imagen de stock del template con su propia imagen.

Pase el cursor Imagen de fondo vista previa hasta que aparezca un icono de papelera. Luego puede seguir adelante y hacer clic en este icono para eliminar la imagen de marcador de posición.

A continuación, haga clic en Usar su propia imagen. Luego puede elegir una imagen de la biblioteca de medios de WordPress o usar una imagen de archivo.

Una vez que haya agregado una imagen, estará listo para reemplazar el texto del marcador de posición.

Haga clic para seleccionar el Bloque de texto. Luego, en el área de texto, simplemente escriba el texto que desea usar.

Algunas de las plantillas de héroe de SeedProd tienen contenido adicional, como botones de llamada a la acción.

Si desea cambiar este contenido, haga clic para seleccionar el bloque y luego realice sus cambios en el menú lateral izquierdo 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á satisfecho con el diseño de su página, haga clic en el botón Guardar.

Aquí puede elegir publicar la página o guardarla como plantilla.

Conclusión

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

Además, organice, optimice y gestione sus archivos multimedia como un profesional con WP Media Folder. ¡Es hora de decir adiós a las bibliotecas desordenadas!