How to Add a Recurring Donation Payment Form in Joomla

For all you Joomla users out there, here is a quick guide on how to embed your Donorbox donation forms into your Joomla sites:

Because we are using an embed code instead of a preset donation module, you will need to make sure your Joomla website allows iframe codes before you copy and paste your donation form embed code, as they are prohibited by default.

For TinyMCE Editor

Step 1

On your Joomla administrator page, start by clicking on the “Extensions” tab, then the “Plugins” button.

Step 2

Search for the “Editor – TinyMCE” plugin using the search bar and click on it.

Step 3

Scroll down to find the “Prohibited Elements” field and remove “script” and “iframe” from that list. Then click the “Save” button at the top of the page.

For JCE Editor

Step 1

Click on “Components” > JCE Editor > Global Configuration

Step 2

Click on “Editor Profiles” > Default

Step 3

Next click on the “Plugin Parameters” tab > Media Support > select “Yes” radio button next to “Allow IFrames” > Click “Save & Close”

How To The Embed Donation Form

Step 1

First off, sign up on Donorbox and get started. Now that you have allowed iframe codes on your website, go to your Donorbox dashboard and find the campaign you wish to embed on your site. Click the “<> Embed Codes ” button.

Step 2

You can edit some of the default settings in your form here, like setting a default donation amount or recurring option. As you change the settings, you will see the code automatically adjust itself.

When you’re happy with the settings, copy the embed code for your form. This code will be pasted in your Joomla site later on.

Step 3

Go back to your Joomla administrator page, and create a new article by clicking on the “New Article” button at the top of the left-hand sidebar.

Step 4

Name your article and scroll down below the content field to press the “Toggle Editor” button on the bottom right. 

Step 5

Once you’ve clicked the toggle button, paste your donation form embed code into the “Content” field.

Step 6

Click the “Save” button and your embed code will now show up as your donation form on your editor as well as on your website!

Conclusion

Joomla is a mobile-ready, and user-friendly CMS to create a website for your nonprofit. We hope you were able to embed your Donorbox donation form directly on your website with the help of this guide.

For more nonprofit tips and resources visit our nonprofit-blog.

And, for any further questions or queries, drop a message to .

Happy fundraising!