This tutorial will teach you how to add Fundraise Up’s Installation Code to your WordPress site, which lets every page of your site become a donation driver!
- Add your Fundraise Up Installation Code to your WordPress
- Add Elements to your WordPress
- WordPress page builders
- Other configuration questions
Add your Fundraise Up Installation Code to your WordPress
If not, an easy way to add that capability is to add a plugin for inserting header and footer scripts onto your WordPress site.
Plugins can be installed on WordPress by going to the Plugins menu in the left-hand navigation of your Wordpress dashboard. Once installed, they do have to be activated before use.
One very popular and heavily supported plugin is the Insert Headers and Footers plugin, maintained by WPBeginner. This plugin simply adds an option labeled Insert Headers and Footers under Settings where you can paste any code that you need to run on all pages of your WordPress site.
Another plugin option is the Header and Footer Scripts plugin.
Whichever plugin you are using to insert code, you'll want to start by getting your Fundraise Up account installation code. To do so, log into your Fundraise Up dashboard and copy the code from the Installation section under Settings.
Paste the code you just copied into your plugin's Scripts in header section and save your changes.
This will connect your site with your Fundraise Up account, and make your Fundraise Up donation checkout available on all pages where that installation code is running.
Add Elements to your WordPress
Now that your Installation Code is in place on all pages of your website, you can set up one or all Campaigns you might need, and start using Elements to put donation buttons in key locations across your website, such as your navigation, banners, program pages, and high-traffic content posts.
WordPress page builders
Although we could not verify support for all WordPress page builders, we have encountered the following and can confirm that they work well with Fundraise Up.
- Brizy - Code Injection & 3rd party scripts embed
- Divi - Code Module
- Elementor - HTML Widget
- WPBakery - Content Elements (Please review the section for Raw HTML)
If you are using the legacy WordPress Editor, we recommend turning off the Visual Editor when adding Fundraise Up Element code to your site to prevent saving issues.
Other configuration questions
What if my donation links seem to open a different version of my homepage?
Sometimes, WordPress websites use the URL parameter ?form= or a version of it as a path on your website.
You can identify this if your checkout URL (https://yourwebsite.org?form=donate) does not open the right version of your home page in the background behind the donation checkout modal. For example, it could show another webpage or anchor to a section of your homepage.
One solution to this unintended behavior is to log in to your WordPress dashboard, go to Settings > Account, and in the website URL field, add an # at the end of the address. For example https://yourwebsite.org/#
Why am I having issues with my Astra Theme page on mobile?
The WordPress Astra Theme has some known issues that cause navigation bars and collapsable menus to become non-responsive when navigating a webpage on mobile. While we had made previous fixes to accommodate for this behavior, they were made nonfunctional by an Astra Theme update. As such, we do not recommend using the Astra Theme on your mobile website if possible.