Fully Embedded Donation Form
The embedded version of Philantro Donation form provides a clean and simple solution for accepting donations directly on your nonprofit's website via single page. The widget can also be styled even more (font, font-size, color etc) to match your organization's branding but it requires knowledge of CSS. When adding this widget to your website, it's best to add it to a blank page without a sidebar so that it extends the full width of the page.
How helpful was this article?
Philantro's fully embedded Donation Form is mobile responsive and lives in whatever area it's placed in. You can customize the color, text and DOM styling by uploading custom CSS to your Philantro account. For those using a supported website builders (all tested except for Wix and Google Sites) - you can also control form behavior via URL variables as showcased below.
The following assumes you already you have the Philantro integration working on your website. If you do not, consult the Integration documentation first. Add the following code snippet to the area you would like the fully embedded donation form to appear. If you're using a website builder, consult their respective documentation regarding embedding HTML content.
- The Philantro integration is a prerequisite.
- <div id="ph-root"></div>
Contact Support about this Topic
You can also designate a specific campaign by adding data attributes to the integration code.
- Specific Campaign
- data-campaign=""
- For Example
- Defaulted to $10 toward Campaign ID 99
- <div id="ph-root" data-campaign="99"></div>
Contact Support about this Topic
On Line 1 of the code snippets below, replace "WEBSITE" with the website address of where your embedded donation form is located.
For those using a supported website builders (all tested except for Wix and Google Sites) - you can also control form behavior via URL variables as showcased below. These links can be used via email, QR Codes, social media and more.
- Prefilled Amount
- Amount with no currency symbol (i.e. 1000)
- ?pha=
- Chain multiple variables using the & symbol.
- ?phc=&pha=
- For Example
- Donation located on https://www.philantro.org/donation-form
- Donation form defaulted to Campaign ID 68
- Prefilled with $250
- https://www.philantro.org/donation-form?phc=68pha=250
Live Example
Contact Support about this Topic