We use cookies to make your experience better. Learn more about how and why.
Nonprofit creating a custom branded donation page with DonorDock

Create Custom Donation Pages With DonorDock

How to Embed a DonorDock Form on Your Website

DonorDock Online Giving Forms can be embedded into DonorDock with just one simple line of code.

Step 1: Get Your Widget Code From DonorDock

DonorDock adds your donation form to your website with a widget that you can add by copying a few lines of code into your website. Here's how you get the code that you'll paste into your website:

  1. 1. Navigate to the Giving Pages area at Fundraising -> Giving Pages.
  2. 2. Create a giving page, or click to edit an existing giving page.
  3. 3. Set up your giving page, or make any needed adjustments.
  4. 4. Scroll to the bottom of the page and copy the iFrame embed code.

Step 2: Embed your widget on your website

The Process for Embedding your online giving page differs based on your website provider, but here are a few guides

3 Examples of Custom Donation Pages With DonorDock

DonorDock provides easy custom donation pages for nonprofits that you can link to your website in just a few minutes. But if you're looking for a custom embed that exactly matches your website style, DonorDock has you covered for that too. Here are a few examples of embedded DonorDock forms on a website we built for a fictional library. (FYI, if you're in need of a new website, we build modern nonprofit websites too 😎.)

Example Donation Page #1 - Provide Additional Information

Visit Page

Use a custom embed of a DonorDock donation form to add additional giving options to our giving page. In this example, DonorDock allows you to create an online giving page for your nonprofit that includes additional options to give. Using DonorDock's embeddable forms, you can easily add an online giving form directly to your website. The best part is, all that online giving information will still be automatically tracked back to DonorDock.

Embed a custom form to provide additional giving options

Example Giving Page #2 - Eliminate Distractions

Visit Page

You can use a DonorDock embed to create a simple distraction free online giving page that includes your website's header and footer, and matches your overall look and feel. Here's one example of an ultra minimalist page designed to keep the donor's focus on their giving.

Bonus: DonorDock allows you to customize your suggesting giving amounts, and can help you automatically track gifts back to specific campaigns.

Example #3 - Link A Page Built in DonorDock

Visit Page

Some nonprofit organizations want a fully customized online donation page, and that is great. If you don't need a custom solution, you can create beautiful, effective donation pages in DonorDock without having to build anything on your website. You don't have to create your own custom page, because DonorDock has an online giving builder directly in the product. Here's an example of a donation page that could be linked directly to your website without a single line of code.

Why are embeddable donation forms better than off-site giving pages?

Embeddable donation forms keep the donor on your nonprofit's website throughout the entire giving flow, which builds trust. Donors are wary of giving on a page with a different URL or branding — it can feel like a scam. An embedded form pulls your nonprofit's logo, colors, and messaging directly into the giving experience and avoids the trust drop that comes from a redirect to a third-party hosted page.

Last updated
April 25, 2026
What is donation page optimization?

Donation page optimization is the practice of improving the design, content, and flow of a nonprofit's online giving page to lift donor conversion rate — the percentage of page visitors who actually complete a gift. The four highest-impact levers: simplicity (one page, minimal form fields, single clear call-to-action), consistent on-brand visuals, mobile-responsive design, and emotion-driven storytelling tied to specific impact.

Last updated
April 25, 2026
What makes a donation page convert?

A converting donation page has four traits: a simple, distraction-free layout with a single clear call-to-action; mobile optimization (more than half of nonprofit traffic is mobile); emotion-driven storytelling tied to specific impact (e.g., "$50 provides clean water for a family for one month"); and consistent on-brand visuals — your logo, colors, and a familiar URL — so donors trust they're giving to you, not a scam.

Last updated
April 25, 2026
Should nonprofit donation pages be mobile-first?

Yes — more than half of nonprofit web traffic is mobile, and many donors give in the moment they decide to support you (often on a phone, often after seeing a social post). A mobile-first design starts with the phone layout, then scales up to desktop. That means large tap targets, fast load times, minimal form fields, and mobile payment options (Apple Pay, Google Pay) at the top of the form, not buried.

Last updated
April 25, 2026
How do you pick suggested donation amounts on a giving page?

Tie suggested amounts to specific outcomes ("$25 = one week of meals for a family") instead of generic dollar values. Use 4–5 tiers spanning your most common gift sizes plus one stretch tier 25%–50% above your average gift. Include an "other" field for donors who want to give a custom amount. For recurring forms, suggest monthly amounts around 1/12 of typical one-time gifts so the recurring ask doesn't feel larger than what donors usually give annually.

Last updated
April 25, 2026
Author
The DonorDock Team
Last updated:
April 29, 2026
Written by
The DonorDock Team

Start building meaningful donor relationships today.

Your fundraising in one place.
Donor Dock-Shapes1-06