• Skip to main content
  • Skip to secondary menu
  • Skip to primary sidebar
  • Skip to footer
  • About Donorbox
  • Sign Up
  • Login
  • Contact

Nonprofit Blog

Nonprofit Tips from the Donorbox team

  • Nonprofit Tips
  • Donorbox Integrations
    • WordPress
    • SquareSpace
    • Wix
    • Weebly
    • Twitch
    • Drupa 8
    • Joomla
    • Website X5
  • Donorbox Features

How To Create A Pop-Up Donation Form: Step-by-Step Guide

August 31, 2016 by Raj 2 Comments

How To Create Pop-Up Donation FormsOur donation forms just got even more exciting! Instead of redirecting your donors to a separate donation page, you can now make it so that your form pops up on the same screen when someone presses your donate button. Try it out here:


Donate

Popup Donation Form


Step 1

This is very easy to implement. Once you have created your donation form, go to your dashboard and click the “Popup Form” button located under your campaign link.

Popup Donation Form


Step 2

This will bring you to a page where you can customize the size of your form (small, medium large) as well as the donation button (color, Donorbox logo).

donation forms popup


Step 3

There are two ways to embed a popup form into your website. Firstly, 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>

 

Filed Under: Donorbox Features, Donorbox Integrations, Resources Tagged With: blog, donation, donation form, donors, new feature, nonprofit, payments, website

Reader Interactions

Comments

  1. Monika says

    September 16, 2017 at 12:42 am

    Hello! We love this Donor Box!

    I followed the exact steps on this page to create a the custom modal pop up on our site but the buttons will not open a pop up anymore…they worked when I tested them at first. I pasted in the code above, added the “custom-dbox-popup” class to m buttons but it wont work. all isnt lost, the buttons go to the Donor Box page so people can still donate bt it’d be great if it worked as intended.

    thank you

    Reply
    • Charles Zhang says

      October 10, 2017 at 11:19 pm

      Hi Monika. Are you still havin this issue? What is your website. Can you please pass this info to , our team can help you quickly.

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Join the Nonprofit Movement

Receive our free email updates to get nonprofit tips, resources and freebies sent directly to your inbox.

TOP POSTS

  • The Complete Guide to Registering a 501c3 Nonprofit
  • How to Start a Nonprofit Organization: A Comprehensive Guide
  • 12 Donation Form Best Practices to Boost your Donations
  • How to Create a 501(c)(3) Tax-Compliant Donation Receipt
  • 10 Actionable Tips to Create a Powerful Monthly Giving Program
  • 100+ Powerful and Effective Fundraising Ideas for Everyone
  • 10 Reasons Why Nonprofits Choose Donorbox Over PayPal
  • Quickly Raise Funds With Our Powerful Crowdfunding Feature [New Update]

Recent Posts

  • 20 Unique Cheerleading Fundraising Ideas
  • 30 Best Relay for Life Fundraiser Ideas that Actually Work
  • Become Successful at Legacy Fundraising: 12 Key Insights and Tips
  • How to Start a Nonprofit in Texas | A Complete Guide
  • 20 Simple Yet Powerful Virtual Fundraising Ideas for Nonprofits

Footer

Resources

Get Started with Donorbox
Covid19 Resource Center
Donation software
Contact us
Support
Affiliate Partner Program
100+ Fundraising Ideas for Nonprofits

Use cases

Nonprofit Fundraising Solution
College & University Fundraising
Medical Research Fundraising
Church Fundraising
Political Fundraising
Animal Rescue Fundraising

Integrations

Stripe for Nonprofits
Wix Donations
SquareSpace Donations
Weebly Donations
WordPress Donation Plugin

Copyright © 2021 · Magazine Pro on Genesis Framework · WordPress · Log in