¿Quieres un formulario de donación real y funcional en tu página de inicio, una página de destino o en medio de una entrada de blog, sin un shortcode y sin enviar a los donantes a una página separada?

El bloque Formulario de donación hace exactamente eso. Esta guía te muestra cómo añadirlo, configurarlo y darle estilo para que coincida con tu sitio.

Antes de empezar

El bloque Formulario de donación es un bloque nativo de WordPress que muestra un formulario de donación completo y funcional directamente dentro del editor de bloques, en cualquier página o entrada. Antes de añadir uno, asegúrate de tener:

• Charitable Pro 1.8.17 o posterior instalado y activado.
• Al menos una campaña publicada, a menos que planees usar el bloque solo en una plantilla de campaña con "Usar campaña actual".

Nota importante: El bloque Formulario de donación está disponible en Charitable Pro y no forma parte del plugin gratuito Lite.

Importante: Coloca solo un bloque Formulario de donación por página. La renderización del lado del servidor y las exclusiones de caché de Charitable se basan en un solo formulario activo por página, y una segunda instancia es innecesaria para los donantes y puede crear envíos duplicados confusos.

Añadir el bloque Formulario de donación a una página o entrada

El bloque funciona como cualquier otro bloque en el editor de WordPress, por lo que no hay una pantalla o asistente separado que aprender.

1. Abre la página o entrada donde quieres que aparezca el formulario, en el editor de bloques de WordPress.
2. Haz clic en el insertador de bloques (+) y busca Formulario de donación.
3. Haz clic en el bloque Formulario de donación para insertarlo.

Justo después de insertarlo, el bloque muestra un marcador de posición pidiéndote que selecciones una campaña. No mostrará un formulario hasta que se elija una campaña, así que ese es el siguiente paso.

Elegir una campaña

El bloque necesita saber qué formulario de donación de campaña mostrar. Esto se configura desde la barra lateral de ajustes del bloque, no desde el bloque en sí.

1. Con el bloque seleccionado, abre la barra lateral de ajustes del bloque (haz clic en el bloque, luego en el icono de ajustes si la barra lateral no está ya abierta).
2. En Contenido, abre el menú desplegable Campaña.
3. Elige una campaña publicada o selecciona Usar campaña actual.

Las dos opciones se comportan de manera diferente:

• Una campaña con nombre – El bloque muestra siempre el formulario de esa campaña, sin importar dónde se publique la página. Úsalo en una página de inicio, página de destino o entrada de blog que promocione una campaña específica.
• Usar campaña actual – El bloque se vincula dinámicamente a la campaña que el visitante está viendo actualmente. Úsalo en una plantilla de campaña para que cada campaña obtenga automáticamente un formulario de donación en el mismo lugar, sin tener que editar cada campaña individualmente.

Tan pronto como se selecciona una campaña, el editor de bloques muestra una vista previa de alta fidelidad: los importes reales de donación de la campaña, el importe seleccionado por defecto, el campo de importe personalizado si está habilitado y el orden real de los campos. No es un marcador de posición gris, por lo que lo que ves mientras editas es lo que verán los donantes.

Elegir completo o mínimo

Aún dentro de Contenido en los ajustes del bloque, el menú desplegable Tipo de formulario controla cuánto del formulario se muestra:

• Completo: Renderiza el formulario de donación completo: importes, importe personalizado, todos los campos del donante y el pago. Úsalo siempre que el formulario sea el foco principal de la página.
• Mínimo: Un diseño compacto solo con los importes de donación y el pago. Úsalo en espacios más reducidos como una barra lateral, un pie de página o a mitad de una página más larga donde un formulario completo se sentiría pesado.

La vista previa se actualiza inmediatamente al cambiar entre las dos opciones, para que puedas comparar antes de decidir.

Dar estilo al formulario

Debajo de Contenido, la barra lateral de ajustes del bloque tiene diecinueve controles de estilo agrupados en cinco secciones. Ninguno de ellos requiere CSS o un archivo de tema, y cada cambio actualiza la vista previa en vivo a medida que lo realizas.

• Contenedor del formulario: Color de fondo, además de un borde con su propio estilo, anchura y color, para la caja que envuelve todo el formulario.
• Tipografía: Color del texto y color del encabezado para las etiquetas y títulos del formulario.
• Botones de importe: Fondo, fondo en estado seleccionado, color del texto, color del texto en estado seleccionado, color del borde y radio de las esquinas para los botones de importe de donación.

• Botón Donar: Color de fondo, color de fondo al pasar el ratón, color del texto y radio de las esquinas para el botón de enviar.
• Acentos: Color del enlace y color del asterisco de campo obligatorio, el pequeño detalle que es fácil pasar por alto pero que destaca una vez que choca con tu página.

Consejo profesional: Establece primero el fondo y el borde del Contenedor del formulario, luego trabaja hacia abajo a través de Tipografía, Botones de importe y Botón Donar. Conseguir que el contenedor sea correcto te dice cuánto contraste necesita el resto del formulario.

Cada instancia de bloque obtiene sus propios estilos con ámbito, generados específicamente para ese bloque. Si colocas un bloque de Formulario de donación en más de una página, cada uno puede tener un estilo completamente diferente, y ninguno de ellos afectará a ningún otro.

Convertir un shortcode existente al bloque

Si ya tienes una página o entrada que utiliza el shortcode [charitable_donation_form], no necesitas eliminarla y empezar de nuevo.

1. Abre la página o entrada que contiene el shortcode en el editor de bloques.
2. Haz clic en el bloque Shortcode que lo contiene.

El shortcode se convierte automáticamente en un bloque de Formulario de donación, ya apuntando a la misma campaña que especificaba el shortcode. A partir de ahí, puedes darle estilo o cambiar su configuración como cualquier otro bloque de Formulario de donación.

Nota: El shortcode en sí mismo sigue funcionando si lo dejas como está. La conversión solo ocurre cuando editas el bloque que lo contiene.

Publicar y lo que ven los donantes

Una vez que estés satisfecho con la campaña, el tipo de formulario y el estilo, haz clic en Publicar o Actualizar. El formulario ya está activo en esa página.

Los donantes ven los mismos campos, importes y opciones de pago que obtendrían de la página de donación de la campaña estándar, renderizados de forma segura en el servidor en lugar de ensamblados en el navegador. No hay nada que tengan que pulsar para acceder a ella, ni nada adicional que tengan que cargar.

Nota: Cualquier página que contenga un bloque de Formulario de Donación activo se excluye automáticamente del almacenamiento en caché de página completa, por lo que los donantes siempre ven un formulario actual y funcional. No es necesario añadir una exclusión de caché manual.

Preguntas frecuentes sobre el bloque Formulario de donación

¿Requiere esto Charitable Pro?

Sí. El bloque Formulario de Donación se incluye en Charitable Pro 1.8.17 y no está disponible en el plugin gratuito Lite.

¿Cuál es la diferencia entre Completo y Mínimo?

Completo muestra el formulario de donación completo con todos los campos. Mínimo muestra una versión compacta solo con los importes de donación y el pago, más adecuada para barras laterales, pies de página o espacios más reducidos.

¿Puedo añadir más de un bloque de Formulario de Donación en la misma página?

Puedes, pero recomendamos uno por página para la experiencia más limpia y rápida. Cada instancia tiene un ámbito de estilo independiente, por lo que una segunda forma no heredará los colores de la primera.

¿Funcionará con mi tema de bloques o la edición de sitio completo?

Sí. El bloque utiliza el registro de bloques estándar de WordPress y el soporte de alineación, por lo que funciona con temas de bloques y edición de sitios completos de la misma manera que cualquier otro bloque principal.

He configurado una campaña, pero el formulario no muestra mis campos personalizados.

Vuelve a comprobar que los campos personalizados se añaden al formulario de donación de esa campaña en la configuración del propio constructor de la campaña. El bloque siempre refleja los campos que la campaña en sí está configurada para recopilar.

¿Mis códigos cortos existentes todavía funcionan?

Sí. Un shortcode sigue funcionando hasta que editas el bloque que lo contiene, momento en el que se convierte automáticamente en un bloque de Formulario de Donación.

¡Eso es todo! Has aprendido a añadir, configurar y estilizar el bloque Formulario de Donación.

A continuación, también puedes leer cómo personalizar tu formulario de donación de WordPress sin código, o aprender más sobre los formularios de donación de Charitable.