Saltar al contenido
Guías
Todos los temas

Para tu causa

Botón de donar e iframe en tu sitio

Pega un botón Donar que abre el formulario encima de tu sitio, o incrusta el formulario con un iframe.

El botón de donar es un código que pegas en tu sitio web: al tocarlo se abre el formulario de donar encima de tu página, sin mandar a nadie a otro dominio. El iframe hace lo mismo incrustando el formulario dentro de la página.

Los dos salen de Compartir, en la sección Botón e iframe. No necesitas plan de pago ni cuenta aparte, y no cambia nada en tu sitio salvo lo que pegues.

Sección Botón e iframe de Compartir con el texto y el color del botón, la vista previa y el código para copiar
Sección Botón e iframe de Compartir con el texto y el color del botón, la vista previa y el código para copiar

Cómo poner el botón en tu sitio

  1. En Compartir, baja a Botón e iframe.
  2. Escribe el Texto del botón (por omisión dice Donar) y elige el Color del botón. Viene con el color de tu causa.
  3. Si quieres, arriba elige la frecuencia y el monto con los que se abre el formulario.
  4. Deja elegido Botón, revisa la vista previa y toca Copiar en el código.
  5. Pega el código en el HTML de tu sitio, en el lugar donde quieres el botón.

El código son dos líneas: un script de Doname y un elemento con los datos de tu causa. Un solo script sirve para varios botones en la misma página, por ejemplo uno con un monto distinto cada uno.

Qué hace el botón al tocarlo

Abre el formulario en una ventana encima de tu página. Se cierra con la tecla Escape, tocando fuera o con el botón ×, y el foco regresa al botón. El botón es accesible: lleva el rol y las etiquetas que leen los lectores de pantalla.

Si ya tienes un botón propio con tu diseño, agrégale el atributo data-doname-open junto con data-cause y el script lo engancha en lugar de pintar uno nuevo.

Cómo incrustar el formulario con un iframe

Elige Iframe en lugar de Botón, copia el código y pégalo donde quieres el formulario. El iframe ajusta su altura solo al contenido y el formulario se ve con el color y el logo de tu causa, sin el encabezado ni el pie de tu página de Doname.

Qué ve quien dona desde tu sitio

Ve el mismo formulario de donar que en tu página: el desglose, la propina opcional y la opción de cubrir la comisión. Las billeteras como Apple Pay y Google Pay no aparecen dentro de sitios de otros dominios; con tarjeta se dona igual. Cada donación guarda que llegó por el botón o por el iframe, y lo ves en su detalle.

Qué pasa si aún no conectas Stripe

El código se puede copiar, pero el botón de donar aparece apagado con una explicación hasta que tu cuenta de Stripe esté activa. Mira Conectar Stripe.

Nota: el formulario solo se puede incrustar desde sus propias direcciones. Tu panel y el resto de tu página de Doname no se pueden enmarcar en otros sitios.

Si tu sitio necesita reaccionar a una donación

Cuando alguien termina de donar, el script lanza el evento doname:donated en la ventana de tu sitio. Con él puedes, por ejemplo, mostrar tu propio mensaje de gracias.

Más formas de compartir en Enlace, texto y QR.

Última actualización: