Donation Widget

Want to add a Givsum "donate" button directly to your website?

By using Givsum's Donation Widget, you can add a "donate" button and allow your visitors to donate from your website.  Copy and paste the code provided in your charity Settings page, or use the code below by replacing [charity] with the charity's url slug.

<a href="https://www.givsum.com/charities/[charity]" class="givbtn">Donate now on Givsum</a>
<script src="https://www.givsum.com/widget.js" type="text/javascript"></script>

 

Advanced Usage:

The "script" tag only needs to be called once and can be placed anywhere relative to your widget button(s).

Use a "data-style" attribute with the values "full" or "none" to make the button full-width, or remove the default styling.

Use a "data-amount" attribute to pre-populate the donation amount field inside the popup. You can also set the donation to recurring by setting "data-recurring" to 1, 3 or 12 for monthly, quarterly or annually. Note that these pre-set values are not forced and the user can still change them.

 

Alternatively:

You can also use the Givsum Donation Widget by adding an iframe donation form directly to your website which will allow your visitors to donate from your website. Copy and paste the code provided in your charity Settings page, or use the code below by replacing [charity] with the charity's url slug.

<iframe src="https://www.givsum.com/charities/[charity]/widget?givwidget=true&givembed=true" width="50%" height="400px" style="background-color: #f9f9f9"></iframe>

 

Advanced Usage:

Use the "width" attribute with a value from "0%" to "100%" to decrease and increase the width of the donation form. 

Use the "height" attribute by increasing or decreasing "400px" to increase and decrease the height of the donation form.

Use the "background-color" attribute held inside the "style" attribute to modify the background color of the form as fit for your website. The value entered after the "#" should be in hexidecimal format for the RGB value. The default recommended color (#f9f9f9) shown above is a light shade of gray.