Button

Embed a popup donation button on your site. Customize the colors, positioning, and more.

Installing the Widgets library

If you haven't already, Install the Widgets library.

Widget

Once you've installed the Widgets library, you can embed a form anywhere on your website. To get started, visit your Givebutter Dashboard and select the campaign you're looking to embed. Then visit the Sharing tab and select Widgets in the sidebar. Copy the code as it appears in the dashboard and place it on your site:

<givebutter-widget id="{YOUR_WIDGET_ID}"></givebutter-widget>

Manual Embed

If you want to manually embed many donation forms, you could use the <givebutter-button></givebutter-button> HTML tag instead. Simply pass the options as below:

<givebutter-button campaign="{YOUR_CAMPAIGN_CODE}"></givebutter-button>

Configuration Options

You can apply the following configuration options as attributes on your button element:

AttributeDescriptionDefaultType
labelText shown in the buttonDonateString
label-colorText & Icon Color# FFFFFFHex Color Code
background-colorBackground color of the button# FF8A00Hex Color Code
drop-shadowShow a dropshadow under the buttontrueBoolean
border-radiusBorder Radius (Used to create rounded corners)100Number
border-colorColor of the border(Empty string)Hex Color Code
border-widthWidth of the border0Number