Skip to main content

Button Pop Up HTML

Updated

This article contains the following questions:

 

What happens when I embed the button pop up on my website?

This method adds a clickable button to your website. When visitors click it, a pop-up window appears with your collection or fundraiser form. You can place the button anywhere on your site  in the header, footer, or on a specific page so it's always visible to visitors.


 

How do I get the button code from Crowded?

  1. Log in to the Crowded web platform and click Collections in the sidebar.
  2. Either create a new collection and click Embed Collection on the final screen, or select an existing collection, click the three dots, and select Embed Collection.
  3. Select HTML Code and continue.
  4. Click the Button Pop-up.
  5. Edit the button color, or label if desired
  6. Copy the code

 

How do I change the button text from "Donate"? 

Edit the text in the field Button Label to any word of your choosing!.

 

 

How do I change the color of the button?

Enter into the field under “Button Color” the desired color via Hex code. Your organization’s hex code for your official colors may be found in your brand guide or design software. Or look to free hex code finder tools such as this one to get your desired color

 

What is a Hex code?

A hex code is typically a six-digit combination of numbers and letters, ranging from 0-9 and A-F, representing a specific color in web design. For example, the hex code #FFFFFF corresponds to the color white. Each pair of digits in a hex code represents one of the three primary colors in additive coloring: red, green, and blue (RGB).


 

How do I embed a donation button pop-up using HTML?

  1. Navigate to the page (or header/footer) where you want the button to appear.
  2. Open the website editor and add an HTML code block.
  3. Paste the code into the block and confirm the full button is visible.
  4. Save and test to make sure the pop-up opens correctly.

 

Which website builders support embedded pop up buttons?

Most website builders support custom HTML blocks. 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.

 

Note that some builders require a paid plan to use custom HTML.

 

 

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.

 

 

Is there a way to test the button 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.

 


 

Will the embedded button work on mobile devices?

Yes, embedded Crowded buttons are mobile-responsive and will adjust to fit the screen size of smartphones and tablets. The collection or fundraiser will open in a new tab on a mobile device

 

 

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.

 

 

Can I customize the appearance of the button and pop-up?

Edit the color and text of the button before copying the code in the Crowded platform to any text and color of your choosing. The pop-up inherits the design set from your Crowded collection, including your added image and description. 

 

Where do donations go after someone submits through the pop-up?

All donations made through the embedded Crowded collection or fundraiser pop-up 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.


 

Related articles