How-to: Launch Your Campaign
Take Your Campaign Live!
The only thing standing between you and fundraising success today is a few clicks!
Donorbox offers four easy options for sharing your donation form with the world:
- Build an eye-catching, completely free Donorbox-hosted fundraising page (perfect if you don’t have a website or an SSL certificate)
- Embed it into your website
- Add your form as an eye-catching pop-up
- Create a Donate button that takes your visitors to your fundraising page
In this lesson, we'll be talking a little about coding and embedding, but…breathe easy…like everything else at Donorbox, it's simple and straightforward.
We also have step-by-step guides for all of the major website builders such as Weebly, Wix, Wordpress, Squarespace, and more! You'll find those guides below.
Now, let’s get your donation form live and doing its job!
1. Donorbox-hosted Fundraising Page
Donorbox automatically creates a beautiful fundraising page for each of your campaigns, hosted on our SSL-secure servers. This saves you from having to install SSL yourself. There is no extra charge for this, no matter how many campaigns you create!
And, because we host the page for you, you don’t even need your own website! Your donors can start donating online immediately without you going through the hassle of first developing an entire website.
Another advantage of using a Donorbox donation page is that you’ll be able to accept donations via Apple Pay and Google Pay. How convenient is that?
To share the link to your Donorbox-hosted fundraising page on your outreach materials, including direct mail, email campaigns, and social media posts, simply find the campaign you want to share on your Campaigns tab. Then, click 'Preview Campaign Page' and copy and paste the URL that appears.
And, if you do have a website, it's easy to embed a link to your fundraising page following these steps.
Step 1
Find the appropriate campaign in the Campaigns tab on your dashboard and click the 'Embed Codes' button.
Step 2
Then, head over to the 'Link to Donation Page' tab.
Step 3
This will open a page containing the URL to your Donorbox donation page, including the text that will be hyperlinked. There are also customizable settings that you can edit. The URL will self-adjust as you make these edits.
Simply copy and paste the code into your web page editor, wherever you want the link to appear!
2. Embedded Form
The second option is to embed the donation form directly on your website. This allows you to encourage donations without requiring the donor to leave your website, and further brand your page to fit your look and feel.
It's quick and simple to do - Donorbox will generate the embedding code and you just need to copy and paste it!
Step 1
Click the 'Embed Codes' button in the appropriate campaign, found on your Campaigns page.
Step 2
You will be taken to a page containing the embed code, and all the different settings that you can adjust as needed. You’ll notice the embed code change as you adjust the settings.
You can also preview your form so that you know exactly how it will look once it’s on your website.
Note: If you are embedding your donation form, your website needs to have SSL enabled.
Step 3
When you are happy with your form, simply copy the code and paste it into your website's fundraising page via the website editor – it’s that easy!
3. Pop-up Form
Our third option is a donation pop-up form. Instead of redirecting your donors to a separate donation page, you can make a donation form pop up, as an on-screen overlay, when someone clicks the Donate button.
Try it out here to see what we mean!
Step 1
Click the 'Embed Codes' button in the appropriate campaign, found on your Campaigns page. Then, select the Popup Form tab.
Step 2
You will be taken to a page containing the Popup Form code, and all the different settings that you can adjust. You’ll notice the code change as you adjust the settings.
Step 3
You can preview your form so that you know exactly how it will look once it’s on your website. When you are happy with your form, simply copy the code and paste it into your website editor on the correct page – it’s that easy!
There are two ways to embed a popup form into your website. First, you can simply copy the embed code into your website’s HTML. Your customized Donorbox donate button will appear on your page and, when clicked, open up your popup form.
However, if you prefer to use your own donate button or have the popup form linked to a hyperlink of your choice, follow these two steps:
1. Add a link with a href=”https://donorbox.org/nonprofitcampagin” and one of the class names should be custom-dbox-popup. For example: <a href="https://donorbox.org/nonprofitcampaign" class="custom-dbox-popup">Donate Now</a>
2. Add the two lines of code above the closing </head> tag.
<script src="https://donorbox.org/install-popup-button.js" type="text/javascript" defer></script>
<script> window.DonorBox = { widgetLinkClassName: 'custom-dbox-popup' } </script>
4. Donate Button
You can use the Donorbox Donate button anywhere to take donors to your Donorbox-hosted donation page. It will draw more attention than a standard link, encouraging more clicks and - hopefully - more donations! It works great within emails too, if you want to include a Donate button as part of the email message.
Step 1
To do this, simply click the 'Embed Codes' button in the appropriate campaign on Campaigns Page and head over to the 'Donate Button' tab.
Step 2
Here, you have many options that enable you to customize the donate button so that it meets your preferences. For example, you may choose both the size and color of the button.
Step 3
Simply copy the code for the URL and paste it into the appropriate place in your website or email editor, and you’re good to go!
Note: If your email editor already has buttons available (many do), all you have to do is add the button to your email. Then, the editor will direct you to add a link, where you can simply paste the URL to your form.