Skip to main content

How to Embed a Donation Form on your External Website (Giving Experience)

How to embed your Givecloud Giving Experience form on your external website

Updated over 4 months ago

πŸ’‘ This article is part of our Guide to Donation Forms (Giving Experiences)

The Power of Givecloud

Using a custom site or a website builder that we didn't list? No problem! There's no limit to where you can embed Givecloud's Giving Experiences.

Here are the instructions on how to embed Givecloud's Giving Experiences on your custom page or website.


Connect Your Website

You simply insert your Givecloud Bridge Code in the exact same place where you've inserted Google Tag Manager, Google Analytics or Facebook Pixel code. It works on any website and all CMS platforms.

  1. Navigate to your Organization settings by clicking on your profile image at the top right hand side of the screen. Click this and then click on Organization Settings.

  2. Scroll down to Connected Websites and click Add a Website:

    Install the bridge code on your website:

    1. Click Copy Code

    2. Paste the code into your website's HEAD section

  3. Once you've installed the bridge code, return to the screen above, enter your Website URL and click Connect Website.

    Success! You've connected your website!

Where to paste the code?

Add the bridge code to the <head> section of your website:

Save your changes.

This is the only time you need to add our bridge code. Once this bridge code is installed, it will work with any Giving Experience you've created.


Embeddable Widgets

There are a few embeddable widgets available for a Giving Experience.

Instant Pop-Up

Step One

Navigate to your Giving Experiences by clicking on Fundraise and then selecting the Giving Experience you want to share and click on Embed from the flyout menu.

Here you can select either Link or Button.

  • Link - provides a pre-configured line of code that will add clickable a link to your page with the text Donate Now. You can edit the label and then click Copy Code. If you only want the URL to add to your site, copy the URL inside the quotes.

    • For example #/fundraising/forms/giving-tuesday-2024

  • Button - provides a pre-configured line of code that will add clickable button to your page with the text Donate Now. You can edit the label and then click Copy Code

Step Two

Paste the copied code onto your website, image or button. Once clicked this will create a pop up experience for your donors.

Step Three

Don't forget to Save!

Inline Experience

Step One

Copy the following code from your Inline Form.

Step Two

Paste your code in the Code tab of your page in the website editor.

Step Three

Click Save!


Frequently Asked Questions

Is it the same bridge code for all of the forms?

Yep! You only need to add the Givecloud Bridge Code once.

Can I have more than one fundraising form on a page?

Yes! Givecloud has optimized Giving Experiences, so if more than three are on a single page, we will modify how we load the embedded forms to help with load times and overall performance.

Did this answer your question?