Using Fundraise Up on your Website

Website Integration

For any of the Fundraise Up widgets or direct links to work correctly, you first need to embed a line of Javascript code in the <head> section of your website. Doing so connects your website to Fundraise up. Please go to Installation section of your Fundraise Up Settings. There you will find a code snippet that looks something like this, where 'YOUR_KEY' is a combination of symbols specific to your account.

<!-- Fundraise Up -->
<script>(function(w,d,s,n,a){var o=function(n){return'function'==typeof n?
o.l.push([arguments])&&o:function(){return o.l.push([n,arguments])&&o;}},t
=d.getElementsByTagName(s)[0],j=d.createElement(s);j.async=true;j.src=
'https://cdn.fundraiseup.com/widget/'+a;t.parentNode.insertBefore(j,t);
o.s=Date.now();o.v=3;o.l=[];l='call,catch,on,once,set,then,track'
.split(',');for(i=0;i<7;i++)o[l[i]]=o(l[i]);w[n]=w[n] || o;
})(window,document,'script','FundraiseUp','YOUR KEY HERE');</script>
<!-- End Fundraise Up -->

Please embed that code snippet in the <head> section of your website. The <head> section of the website is the same section where you would typically add other utility code snippets such as Google Analytics tracking code, etc. If you are not sure how to access the <head> section of your website, please ask your development team, or reach out to us, and we will help you. Now that you have your website connected to Fundraise Up, let's look at how you embed the widget in your website.

Embedding Your Donation Campaign / Form

The first step is always to make sure you have at least one Campaign active - each Campaign acts as a checkout process, to allow donors to be offered certain donation options and chances to provide you more information. Here's a more in-depth explainer of how to make and manage Campaigns.

Once you've got at least one Campaign set as you'd like it, head over to the Elements tab and make some buttons! Our Elements article explains the process in more detail, but in summary:

  • some Elements will give you HTML code which you can add to any editing area on your website that accepts HTML code,
  • and some Elements will automatically appear on some or all pages of your site as per their URL Control settings.