How to Add a Recurring Donation Payment Form in Joomla

Wondering how to add a donation form on Joomla? We’ve got your back! Here’s a step-by-step tutorial on how to receive donations on Joomla. Joomla is a mobile-ready, and user-friendly CMS to create a website for your nonprofit. This step-by-step guide will help you embed your donation form for TinyMCE and JCE Editors.

2 minutes read
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.

joomla donation form

 


Step 2

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

joomla donation


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.

donate on joomla


For JCE Editor


Step 1

Click on “Components” > JCE Editor > Global Configuration

donation payments on joomla


Step 2

Click on “Editor Profiles” > Default

joomla donation funds


Step 3

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

add donation form in joomla


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.

joomla donations


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.

joomla donations


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.

donations on joomla


Step 4

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

joomla


Step 5

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

make donations on joomla


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!

joomla donation form

 

donation form joomla


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!

Avatar photo

Raviraj heads the sales and marketing team at Donorbox. His growth-hacking abilities have helped Donorbox boost fundraising efforts for thousands of nonprofit organizations.

  • facebook
  • twitter
  • instagram
  • linkedin
  • tumblr

Join the fundraising movement!

Subscribe to our e-newsletter to receive the latest blogs, news, and more in your inbox.

Take your donor experience to the next level!
Join the 50,000+ nonprofits already raising funds online.
Join a 30min Demo to see how Donorbox can help you reach your fundraising goals!
.brave_popup #brave_element--NNN3oo2Vl6_Qoue46FF.brave_element.brave_element--button .brave_element__styler .brave_element__button_text { border-bottom: 1px solid #fff; } #brave_popup_51310__step__0 #brave_element--NNN3oo2Vl6_Qoue46FF { text-align:left; } #brave_popup_51310__step__0 #brave_element--NNN3oo2Vl6_Qoue46FK { z-index: 6 !important; left: 232px !important; } const _sticky_bravepop_id = 51310;
Join a 30min Live Demo to see how Donorbox can help you reach your fundraising goals!