Log in
Sign Up
Book a Demo
Back to guides

How to embed Collections & Fundraisers on your website

  • Read time: 4 min

When potential donors and community members visit your website, provide them an easy way to support your organization without needing to leave your organization’s page! Enjoy the steady income stream cleared straight into your Crowded account. No external platforms or reconciliation required!

There are a few ways to embed your collection or fundraiser into your website:

  1. Embed the collection form straight into your site
  2. Embed a button that leads to a pop-up of the collection
  3. Do both!

Between these types, there are also two ways to embed them onto your website:

 

If your organization has a webmaster or developer, send them this guide, and see below for a sample email!

 
For Fundraising

With Collect, you can create a Fundraiser which allows donors to choose the amount they would like to pay. This type of collection is the ideal way to collect donations on your website.

We have laid out step-by-step guides to all the options. Feel free to play around with the method that works best for you and your organization’s website provider.

Embedded Form w/ HTML

Light coding required

Embed a collection form into your website with HTML

Collect donations or dues by embedding a collection into your page. Available as a half-page widget.

Here’s how to implement

While on Crowded:

  1. Log in to the Crowded web platform and click on the Collections tab on the sidebar
    1. Create any type of collection (fixed amount, open amount, or fundraiser) 
      1. On the final screen, once the collection is created, click the button “Embed Collection 
    2. Select an existing collection on the Collections dashboard to embed by clicking on the three dots and selecting “Embed Collection” 
  2. Select the “HTML Code” option and continue.
  3. Then, click on the “Embedded form” to see and copy the code

 

On the website builder:

  1. Navigate to the page of the website you’d like to embed the collection into.
  2. Open the website editor and click to add an HTML code block
  3. Paste the code into the block and voila!
  4. Play around with the size of the box to your preference and save.

 

For more specific instructions based on the website builder you use, see below for the relevant articles. Note that in some cases, adding custom HTML code is a paid feature.

Button Pop-up HTML

Light coding required

Embed a button leading to the Collect pop-up on your website with HTML

With this method, collect payments and donations seamlessly by embedding custom buttons on your website. Place the button in the header and footer of your site, or on a specific page, so it’s visible to visitors at all times. When the button is clicked, a small pop-up window will appear with the collection.

Full Customization 

Customize the color of the button to the brand colors of your organization and change the button text from Donate to any other term that would resonate with your site visitors (i.e., Buy Now, Pay Dues)

Here’s how to implement:

While on Crowded:

  1. Log in to the Crowded web platform and click on the Collections tab on the sidebar
    1. Create any type of collection (fixed amount, open amount, or fundraiser) 
      1. On the final screen, once the collection is created, click the button “Embed Collection 
    2. Select an existing collection on the Collections dashboard to embed by clicking on the three dots and selecting “Embed Collection” 
  2. Select the “HTML Code” option and continue.
  3. Then, click “Button Pop-up” 
  4. Edit the button color, or label if desired
  5. Copy the code

 

On the website builder:

  1. Navigate to the page of the website you’d like to embed the collection into.
  2. Open the website editor and click to add an HTML code block
  3. Paste the code into the block and ensure the entire button is visible
  4. Save, test, and you are good to go!

Donate Button WordPress Plugin

No coding required

Embed a Donate button leading to a Collect pop-up on your WordPress website 

With the WordPress plugin, collect donations seamlessly by embedding buttons on your WordPress site with no code. Download the plugin, add it to your site, and enjoy easy embedding of your fundraisers on your site.

With the Donate Button option, easily add a button that opens a pop-up with the collection for users to make a payment.

Before you begin, make sure you’ve downloaded the plugin from the WordPress Marketplace and installed it on your site.

Note: for now, there is no ability to change the text on the button from “Donate”. To customize the text, either use the HTML embed option, or create a button that links to the collection.

Step-by-Step Guide:

While on Crowded:

  1. Log in to the Crowded web platform and click on the Collections tab on the sidebar
    1. Create a new Fundraiser collection
      1. On the final screen, once the collection is created, click the button “Embed Collection 
    2. Select an existing collection on the Collections dashboard to embed by clicking on the three dots and selecting “Embed Collection” 
  2. Select the “WordPress Plugin” option and continue.
  3. Copy the Collection ID

On your WordPress site:

  1. Click on the “Crowded Collect Plugin” on the sidebar of your site
  2. Scroll to the section called “Button-linked Pop-Up”
  3. Click “Add Collection” and paste the Collect ID from the Crowded platform into the box
  4. Click the copy symbol to copy the shortcode for this Collection
  5. Navigate to the page of the website you’d like to embed the button into.
  6. Open the website editor and click to add an HTML code block or a shortcode block
  7. Paste the code into the block 
  8. Save, test, and you are good to go!

Embedded Form WordPress Plugin

No coding required

Embed a Collection or Fundraiser into your WordPress website 

With the WordPress plugin, collect donations seamlessly by embedding Collections and Fundraisers directly into your WordPress site with no code. Download the plugin, add it to your site, and enjoy easy embedding on your site. 

The form can be implemented with half-page and full-page options. Adjust the size of the form for desktop and mobile in the “Customize Form Size” table.

Before you begin, make sure you’ve downloaded the plugin from the WordPress Marketplace and installed it on your site.

Step-by-Step Guide:

While on Crowded:

  1. Log in to the Crowded web platform and click on the Collections tab on the sidebar
    1. Create any type of collection (fixed amount, open amount, or fundraiser) 
      1. On the final screen, once the collection is created, click the button “Embed Collection 
    2. Select an existing collection on the Collections dashboard to embed by clicking on the three dots and selecting “Embed Collection” 
  2. Select the “WordPress Plugin” option and continue.
  3. Copy the Collection ID

On your WordPress site:

  1. Click on the “Crowded Collect Plugin” on the sidebar of your site
  2. Scroll to the section called “Embedded Form”
  3. Click “Add Collection” and paste the Collect ID from the Crowded platform into the box
  4. Click the copy symbol to copy the shortcode for this Collection
  5. Navigate to the page of the website you’d like to embed the button into.
  6. Open the website editor and click to add an HTML code block or a shortcode block
  7. Paste the code into the block 
  8. Save, test, and you are good to go!

Sample Email to Webmaster or Developer

Dear {insert name here}

We would like to embed our collections and/or Fundraisers from Crowded onto our website. Can you take a look at the following guide for instructions on implementing the form and/or button on our site? We would like to embed this code {paste HTML code from Crowded platform here}.

Thank you!

Best,

{Your Name}

FAQs

Can I embed a Collection on a Canva site?

Unfortunately not – Canva sites do not allow custom HTML code blocks at this time, so you cannot embed a Collection form if your nonprofit uses Canva.

Can I link a button on a website to my Collection?

Yes! Link a button in your header, footer or anywhere on your site to your Crowded collection and fundraisers. On your website builder, create a button in the style of your choosing and add the Collection or Fundraiser link in the button field. This will lead donors and supporters to your Collection in a new tab.

What if my website builder is not listed in the guide?

If your website builder isn't listed, check whether it supports adding custom HTML code blocks – most modern website builders do, often labeled as "HTML Widget," "Embed Block," or "Code Block." As long as your builder allows raw HTML embeds, the standard HTML code from Crowded will work. If your builder does not support custom HTML , you can instead link a button directly to your Collection URL.

Where do donations go after someone submits through the embedded form or button?

All donations made through an embedded Crowded collection or fundraiser are processed directly into your Crowded account – no reconciliation or manual transfers needed. You can view all transactions in real time from the Collections dashboard on the Crowded platform.

Does the WordPress plugin require a paid plan?

The Crowded Collect WordPress plugin itself is free to download from the WordPress Marketplace.

Is there a way to test the embed before publishing it on my live site?

Yes. Most website builders allow you to preview a page before publishing it. Use your builder's preview mode to view and test the embedded collection as a visitor would see it. You can also use a draft or hidden page to test the embed in a live environment without making it publicly visible. Or submit a test payment to confirm the full donor experience.

What if my embedded form is not loading or displaying correctly?

If your embed isn't appearing as expected, here are a few things to check:

  • Make sure the full code was pasted correctly without any missing characters.
  • Confirm that your website builder supports custom HTML embeds (some require a paid plan for this feature).
  • Check that the Collection is active and published on the Crowded platform.
  • Try clearing your browser cache or viewing the page in an incognito window.
  • If using the WordPress plugin, ensure the plugin is up to date and properly installed.

If I update my Collection on Crowded, will the embedded version update automatically?

Yes. Because the embed pulls live data from your Crowded collection, any changes you make to the collection on the Crowded platform – such as updating the goal amount, description, or image – will be reflected automatically in the embedded version on your site without needing to re-paste the code.

In this guide