Widgets
Embed campaign and petition widgets with an iframe or a script tag.
Widgets let you put a live campaign or petition on your own site. They show progress and link visitors to ardent.africa to donate or sign. The widget itself never takes payments and never runs your visitors' data through anything; it only reads the public API on our servers and renders a small, isolated card.
There are two ways to embed, both safe. The script tag is just a convenience that writes the iframe for you.
Widget types
| Type | Shows | Embed path |
|---|---|---|
campaign | image, title, progress, raised vs goal, Donate button | /embed/campaign/:slug |
card | compact title, progress, Donate link | /embed/card/:slug |
petition | title, signature progress, Sign button | /embed/petition/:slug |
iframe embed
Drop this anywhere. No JavaScript runs on your page.
<iframe
src="https://docs.ardent.africa/embed/campaign/clean-water-for-tamale"
style="border:0;width:100%;max-width:420px;height:340px"
sandbox="allow-scripts allow-popups"
loading="lazy"
title="Ardent Africa campaign"
></iframe>For a petition, use /embed/petition/<slug>; for the compact card, /embed/card/<slug>.
Script embed
The script tag injects the sandboxed iframe for you and is handy in CMSs.
<script
src="https://docs.ardent.africa/widget.js"
data-ardent-campaign="clean-water-for-tamale"
></script>Petition and compact card:
<script src="https://docs.ardent.africa/widget.js" data-ardent-petition="pass-the-affirmative-action-bill"></script>
<script src="https://docs.ardent.africa/widget.js" data-ardent-card="clean-water-for-tamale"></script>Customization
Add data attributes (script embed) or query params (iframe):
| Option | Script attribute | iframe query | Values |
|---|---|---|---|
| Theme | data-ardent-theme | ?theme= | light (default), dark |
| Height | data-ardent-height | n/a | pixels |
| Max width | data-ardent-width | n/a | pixels |
<script
src="https://docs.ardent.africa/widget.js"
data-ardent-campaign="clean-water-for-tamale"
data-ardent-theme="dark"
data-ardent-height="360"
></script>Why this is safe
- The iframe is sandboxed without
allow-same-origin, so it cannot read your page. - No API key appears in your page source; the embed reads the public API on our servers.
- The script does nothing but insert one iframe. No eval, no tracking, no data sent from your visitors.
Attribution
Widgets link to ardent.africa. Please keep the Donate and Sign links intact so supporters reach the real campaign.
Last updated: 18 June 2026