How to Add a Donation Form to Squarespace

The native Donation block, honestly

Squarespace's Donation block lives in the Add panel like any other content block. You drag it onto a page, set a few suggested amounts, write a short heading, and connect a payment processor. For a small org that just needs a "Donate" button on the homepage, it is a reasonable starting point and it is free beyond processing fees.

The catch is the connection requirement. The Donation block only works on certain Squarespace plans, and it routes payments through Squarespace Payments or Stripe. If you are on an older plan tier, the block may not even appear. So before you fall in love with it, confirm it shows up in your editor at all.

Where the native block runs out of road

Once you push past a single one-time gift, the limits show up fast. These are the ones that actually matter:

• Recurring giving is thin. The native block is built around one-time donations. There is no proper monthly-giving toggle the way a dedicated form has it, so the most valuable kind of donor, the recurring one, has nowhere obvious to land.
• Styling is locked. You get Squarespace's look. You can nudge fonts and colors at the site level, but you cannot really make the form feel like a designed part of your campaign. No custom layout, no branded amount buttons.
• It ties you to their checkout. The donor experience is whatever Squarespace decides it is. If you ever leave Squarespace, the donation setup does not come with you.
• Reporting is basic. You see transactions, not much of a donor picture.

None of this makes the native block useless. It makes it a starter, not a finisher. If your online giving is a real part of how you operate, you will hit these ceilings within a season.

The better route: embed a form with a Code block

Squarespace also gives you a Code block (and on Business and Commerce plans, the ability to inject custom code). That is your door to a real donation form. You build a branded form in a dedicated donation tool, copy its embed snippet, and paste it into a Code block right on the page where you want people to give.

1. Build the form first

In your donation tool, set suggested amounts, switch on a custom-amount field, turn on monthly giving, and add your logo and colors. Get it looking right before you copy anything, so the embed you paste is already done.

2. Copy the embed snippet

Most tools hand you a single line of HTML or a short script tag. Grab the whole thing.

3. Add a Code block

Edit the page, click an insertion point, choose Code from the block menu, and paste your snippet. Make sure the block type is set to HTML, not Markdown, or Squarespace will render your code as plain text. Save and exit the editor.

4. Test on a real phone

Open the live page on your phone and make a genuine $1 donation to yourself. Check that the money reaches your processor, the receipt email arrives, and the form does not shove the rest of the page around as it loads. Refund yourself when you are done.

This is the same approach you would use on most builders. If you are weighing platforms, our walkthrough on adding a donation form to Webflow covers the same embed pattern from a slightly different angle.

Branding and recurring giving are the whole point

The reason to go past the native block usually comes down to two things: how the form looks and whether it can take a monthly gift.

On branding, an embedded form lets you carry your logo, colors, and tone straight into the giving moment. A donor reading your story and then seeing a form that matches it does not feel handed off. That continuity is quietly worth real money.

On recurring, this is where the native block hurts most. Monthly donors are the ones who keep your budget predictable, and the easiest time to ask is the moment someone is already giving. A form with a clear "make this monthly" toggle will pull far more recurring gifts than a one-time-only block ever could. If you want the mechanics, how to add recurring donations to your website goes deeper.

Who actually holds your money

One detail people skip: where the donations land. With Squarespace Payments or a Stripe connection, money moves on the processor's normal payout schedule, which is fine. But not every third-party donation tool works that way. Some pool donations in their own account and pay you out later, which means a middleman sits between your donors and your bank.

If that matters to you, look for a tool that connects to your own Stripe account so funds flow directly to you. KindLumen takes that approach, donations go straight into your own Stripe rather than a pooled balance, and the embed drops into a Squarespace Code block like any other snippet. You can see how the inline form and recurring options work on the features page.

Mistakes to avoid on Squarespace

• Leaving the Code block set to Markdown instead of HTML, so your embed shows up as raw text. It is the single most common Squarespace embed mistake.
• Assuming the native Donation block does recurring well. It does not. Check before you build your whole appeal around it.
• Hiding the donate option three clicks deep in the nav. Put the form on the page where you make the ask.
• Never testing on mobile. Most donors are on phones, and a form that overflows an iPhone screen is a dead form.