<html lang="es-es" dir="ltr"><head></head><body>### [Usando el campo de texto enriquecido](https://wpforms.com/docs/how-to-use-the-rich-text-field-in-wpforms/)

**Publicado:** 17 de noviembre de 2023
**Autor:** Umair Majeed

**Extracto:** Aprende a permitir que los visitantes den formato a sus envíos con enlaces, colores e imágenes.

**Contenido:**

El campo de texto enriquecido es una característica básica

 Desbloquea el campo de texto enriquecido y otras potentes funciones para hacer crecer tu negocio.

 [ Obtén WPForms Básico ](https://wpforms.com/pricing/) 

¿Te gustaría permitir que los usuarios personalicen los envíos de sus formularios? El campo de texto enriquecido proporciona una forma flexible para que los usuarios den formato a texto e imágenes antes de enviar sus formularios en línea.

Este tutorial te mostrará todo lo que necesitas saber para empezar a usar el campo de texto enriquecido en WPForms.

- [Añadir un campo de texto enriquecido a tu formulario](#add-rich-text-field)
- [Habilitar opciones avanzadas](#advanced-options)
- [Permitir cargas de medios](#allowing-media-uploads)
- [Usar el campo de texto enriquecido](#using-the-rich-text-field)
- [Incrustar archivos externos](#external-file)

---

Antes de empezar, primero deberás asegurarte de que WPForms esté [instalado y activado](https://wpforms.com/docs/install-wpforms-plugin/ "Cómo instalar el plugin WPForms") en tu sitio de WordPress y que hayas [verificado tu licencia](https://wpforms.com/docs/verify-wpforms-license/ "Cómo verificar tu licencia de WPForms"). Luego, puedes [crear un nuevo formulario](https://wpforms.com/docs/creating-first-form/ "Cómo crear tu primer formulario") o editar uno existente para acceder al constructor de formularios.

Explora nuestra [Plantilla de formulario de envío de tareas para educadores](https://wpforms.com/templates/homework-submission-form-template/ "Plantilla de formulario de envío de tareas para educadores") si deseas comenzar con una plantilla personalizable.

## Añadir un campo de texto enriquecido a tu formulario

Dado que el campo de texto enriquecido es una característica avanzada, lo encontrarás en **Campos de fantasía** en el constructor de formularios.

![Campo de texto enriquecido](https://wpforms.com/wp-content/uploads/2021/09/Rich-Text-field-2.png)Para añadir el campo de texto enriquecido a tu formulario, haz clic en él o arrástralo al área de vista previa.

![Arrastrar y soltar campo](https://wpforms.com/wp-content/uploads/2021/09/Click-and-drag-field-2.gif)A continuación, siéntete libre de cambiar la etiqueta del campo introduciendo el texto que desees en el campo **Etiqueta**.

![Etiqueta del campo de texto enriquecido](https://wpforms.com/wp-content/uploads/2021/09/Rich-text-field-label.png)## Habilitar opciones avanzadas

Para acceder a las opciones avanzadas del campo de texto enriquecido, navega a la pestaña **Avanzado** en el panel Opciones del campo.

![Opciones avanzadas del campo de texto enriquecido](https://wpforms.com/wp-content/uploads/2021/09/Rich-text-advanced-options.png)A continuación, repasaremos dos de las opciones avanzadas más notables: **Estilo del campo** y **Tamaño del campo**.

### Estilo del campo

El campo de texto enriquecido incluye dos opciones de estilo entre las que puedes elegir: **Básico** y **Completo**.

![Opciones de estilo de campo](https://wpforms.com/wp-content/uploads/2021/09/Field-style-options.png)#### Estilo de campo básico

El estilo de campo básico es bastante sencillo, ya que incluye una barra de herramientas simple con funciones mínimas.

![Campo de texto enriquecido estilo básico](https://wpforms.com/wp-content/uploads/2021/09/Basic-style-rich-text-field.png)Aquí tienes una lista de las opciones de la barra de herramientas para el estilo **Básico**:

- Negrita
- Cursiva
- Subrayado
- Tachado
- Lista con viñetas
- Lista numerada
- Cita
- Alinear a la izquierda
- Centrar
- Alinear a la derecha
- Deshacer
- Rehacer
- Insertar/editar enlace

#### Estilo de campo completo

El estilo de campo completo incluye todo lo disponible con el estilo de campo básico, y mucho más. Para mostrar las opciones adicionales, haz clic en el icono **Alternar barra de herramientas**.

![Icono de alternar barra de herramientas](https://wpforms.com/wp-content/uploads/2021/09/Toolbar-toggle-icon.png)Aquí tienes una lista de opciones adicionales que estarán disponibles cuando selecciones el estilo de campo **Completo**:

- Insertar etiqueta Leer más
- Línea horizontal
- Color del texto
- Pegar como texto
- Borrar formato
- Carácter especial
- Disminuir sangría
- Aumentar sangría
- Atajos de teclado

Además, los usuarios podrán seleccionar una gama de formatos de texto en el menú desplegable situado en la esquina superior izquierda.

![Opciones de texto](https://wpforms.com/wp-content/uploads/2021/09/Text-options.png)**Nota:** Para gestionar la longitud del contenido que los usuarios pueden enviar, puedes establecer un límite de caracteres para el campo de texto enriquecido. Consulta nuestra [documentación para desarrolladores](https://wpforms.com/developers/how-to-limit-characters-for-the-rich-text-field/) para obtener una guía sobre cómo implementar esta restricción.

### Tamaño del campo

Hay tres tamaños de campo entre los que puedes elegir: **Pequeño**, **Mediano** o **Grande**. Cada tamaño de campo diferente determinará la altura del campo de texto enriquecido.

Para elegir el tamaño del campo para tu campo de texto enriquecido, haz clic en el menú desplegable etiquetado como **Tamaño del campo**.

![Opciones de tamaño de campo](https://wpforms.com/wp-content/uploads/2021/09/Field-size-options.png)**Nota:** WordPress está [dejando de admitir Internet Explorer 11](https://wordpress.org/news/2021/05/dropping-support-for-internet-explorer-11/). Para los usuarios de Internet Explorer 11, la función para añadir medios dentro del campo de texto enriquecido puede no funcionar como se espera en el frontend.

## Permitir cargas de medios

El campo de texto enriquecido ofrece la opción de que los usuarios carguen archivos de imagen. Aquí tienes una lista de todos los tipos de imagen que se pueden cargar a través del campo de texto enriquecido:

- .jpg, .jpeg, .jpe
- .gif
- .png
- .bmp
- .tiff, .tif
- .webp
- .ico
- .heic

Para habilitar esta opción, navega a la pestaña **General** en el panel Opciones del campo. Luego, selecciona **Permitir cargas de medios**.

![Permitir cargas de medios](https://wpforms.com/wp-content/uploads/2021/09/Allow-media-uploads.png)Una vez habilitado, ahora verás un icono de medios en la barra de herramientas del campo de texto enriquecido. Al hacer clic en este icono, los usuarios pueden cargar sus archivos de imagen.

![Icono de medios del campo de texto enriquecido](https://wpforms.com/wp-content/uploads/2021/09/Rich-text-field-media-icon.png)Así es como podría verse nuestro campo de texto enriquecido con una imagen cargada:

![Imagen cargada en el campo de texto enriquecido](https://wpforms.com/wp-content/uploads/2021/09/Uploaded-image-in-rich-text-field.png)Por defecto, los archivos subidos por el usuario se almacenan en el directorio de Cargas de tu sitio, dentro de la carpeta WPForms.

Sin embargo, si prefieres almacenar automáticamente los archivos subidos en la Biblioteca de medios de WordPress, selecciona **Almacenar archivos en la Biblioteca de medios de WordPress**.

![Almacenar archivos en la biblioteca de medios de WordPress](https://wpforms.com/wp-content/uploads/2021/09/Store-files-in-WordPress-media-library.png)## Usar el campo de texto enriquecido

Al interactuar con el campo de texto enriquecido en el frontend de tu sitio, los usuarios podrán cambiar entre dos modos diferentes:

- **Visual**: Las imágenes y el texto se mostrarán directamente en el editor de texto.
- **Texto**: Las imágenes y el texto se mostrarán en [HTML](https://www.w3schools.com/whatis/whatis_html.asp "Qué es HTML?").

Por defecto, el campo de texto enriquecido comenzará en modo Visual. Sin embargo, puedes cambiar entre los diferentes modos seleccionando la pestaña **Visual** o **Texto** en la esquina superior derecha.

![Modos visual y de texto](https://wpforms.com/wp-content/uploads/2021/09/Visual-and-text-modes.png)Ahora, añadamos algo de texto al campo de texto enriquecido para ver la diferencia entre los dos modos.

Primero, añadiremos un encabezado haciendo clic en el menú desplegable en la esquina superior izquierda y seleccionando **Encabezado 3**.

![Seleccionar encabezado 3](https://wpforms.com/wp-content/uploads/2021/09/Select-heading-3.png)Luego, escribiremos algo de texto encima de nuestra imagen.

![Ejemplo de entrada con encabezado 3](https://wpforms.com/wp-content/uploads/2021/09/Example-input-with-heading-3.png)Ahora, para ver cómo se ve nuestro contenido en modo Texto, haz clic en la pestaña **Texto**. Aquí verás el contenido mostrado en HTML.

![Modo texto](https://wpforms.com/wp-content/uploads/2021/09/Text-mode.png)## Incrustar archivos externos

Si estás utilizando nuestro [complemento de envío de publicaciones](https://wpforms.com/docs/how-to-install-and-use-the-post-submissions-addon-in-wpforms/), es posible que desees permitir que los usuarios incrusten archivos externos, como videos de YouTube, podcasts de Spotify, etc., al enviar sus publicaciones.

Por ejemplo, un usuario puede usar el código de incrustación iframe de YouTube para incrustar un video en el campo de texto enriquecido. Técnicamente, esto mostraría el video incrustado en el campo de texto enriquecido.

![Video de YouTube incrustado](https://wpforms.com/wp-content/uploads/2023/07/embed-overview.gif "Video de YouTube incrustado")Sin embargo, WPForms sanitizará y limpiará el código de incrustación después de que el usuario envíe el formulario. Implementamos esta medida de seguridad para proteger a nuestros usuarios de atacantes que utilizan código para explotar las debilidades del sitio web.

Si deseas incrustar videos en publicaciones enviadas a través del complemento de envío de publicaciones, simplemente pega el enlace del video directamente en el campo de texto enriquecido. WordPress se encarga de añadir el código de incrustación y mostrar el archivo incrustado en tu frontend usando oEmbeds.

**Nota:** Consulta la [documentación oficial de WordPress](https://wordpress.org/documentation/article/embeds/) para ver una lista de sitios que admiten oEmbed.

¡Eso es todo! Ahora tienes algunas ideas sobre cómo usar el campo de texto enriquecido en WPForms.

A continuación, ¿quieres que tus visitantes puedan publicar contenido en tu sitio sin acceder a tu panel de WordPress? Asegúrate de consultar nuestra guía sobre [cómo instalar y usar el complemento de envío de publicaciones](https://wpforms.com/docs/how-to-install-and-use-the-post-submissions-addon-in-wpforms/ "Cómo instalar y usar el complemento de envío de publicaciones en WPForms").

**Categorías:** Campos, Tipos de campo

---</body></html>