π‘ 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.
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.
Scroll down to Connected Websites and click Add a Website:
Install the bridge code on your website:
Click Copy Code
Paste the code into your website's HEAD section
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.