Giving Widgets: Put Giving Right Where Your Congregation Is

Your church website is often the first place people land when they want to give. Maybe they’re reading about your mission trip, scrolling through your building campaign update, or browsing your weekly bulletin. The moment someone feels moved to give, you want the path to be short and simple—not a click away to a separate giving page, but right there on the page they’re already viewing.

Why Embedded Giving Matters

Giving Widgets (also called Quick Give Widgets) are compact, embeddable giving forms that you can place anywhere on your church website. Instead of sending donors to a full giving page, the widget brings the giving experience directly into your site. A sidebar on your campaign page, a banner on your homepage, or a dedicated section on your mission trip fundraiser—all can host a widget that lets visitors give in seconds without leaving the page.

For churches running capital campaigns, building funds, or special offerings, widgets are especially powerful. You can pair a progress bar with the giving form so donors see how close you are to the goal. Quick amount buttons (e.g., $25, $50, $100) reduce friction for one-time gifts. And because the widget is embedded, it feels native to your site rather than like a redirect to an external platform.

Customization Without Complexity

OnlineGiving.org’s Giving Widgets feature gives you full control over how the widget looks and behaves. You choose which funds appear, whether to show a progress bar, what quick amounts to display, and even custom header and footer content. Labels like “I would like to give” and “Donate” can be tailored to match your church’s voice. The result is a giving experience that feels intentional and on-brand.

Widgets integrate seamlessly with your existing funds, giving pages, and MinistryPlatform (when enabled). You can mimic the funds from your primary donation form or from a specific giving page, so donors see the same options they’re used to. For campaign-specific widgets, you can limit funds to those tied to the campaign and add a progress bar that syncs with MinistryPlatform Programs when that integration is active.

In this article, we’ll overview the OnlineGiving.org Giving Widgets feature.

Giving Widgets User Guide

Giving Widgets are embeddable giving forms that you create in the control panel and embed on your church website using a simple script snippet. Each widget has its own configuration: title, funds, quick amounts, progress bar, labels, and optional header and footer content. You can create multiple widgets for different campaigns, pages, or use cases.

Key Takeaways

• Embed Anywhere: Copy the embed code and paste it into your website. The widget loads in an iframe and accepts donations without redirecting donors.
• Full Customization: Configure quick amounts, funds, progress bar, labels, header, and footer. Match your church’s branding and campaign messaging.
• Fund Flexibility: Choose parent funds (with sub-funds), any mix of sub-funds, mimic your primary giving form, or mimic a specific giving page.
• Campaign Progress Bar: Optional progress bar shows total raised vs. goal. Supports base amount, start date, and MinistryPlatform Program sync.
• Preview & Embed: Live preview in Mobile and Tablet views, plus a copyable embed code tab. Save & Preview saves changes and refreshes the preview.

Table of Contents

1. Accessing Giving Widgets
   • Viewing and Searching Widgets
2. Creating a Giving Widget
   • Widget Settings (Title, Gift Type)
   • Quick Amounts and Amount Input
   • Fund Selection and Fund Picker Mode
   • Progress Bar (Optional)
   • Labels
   • Header and Footer (Optional)
3. Preview and Embed Code
   • Mobile and Tablet Preview
   • Copying the Embed Code
4. Managing Multiple Widgets
   • Editing and Deleting Widgets
5. Campaign Widgets and Giving Page Linking
6. Frequently Asked Questions

Accessing Giving Widgets

Viewing and Searching Widgets

To open the Giving Widgets page:

1. Log in to the control panel.
2. Click “Giving Widgets” in the left navigation menu.
3. The page displays a table of all your widgets with columns for Title and actions.

Use the search box in the Title column to filter widgets by name. Change the results per page (10, 20, 50, or 100) from the dropdown at the bottom. Click a widget title to open the Embed page in a new tab. Use the gear icon dropdown for each row to access “Embed Code”, “Edit”, or “Delete”.

Creating a Giving Widget

Click “Create Giving Widget” to start. The create form is organized into collapsible panels. Complete each section and click “Save” at the bottom of each panel. Use “Save & Preview” to save and stay on the edit page so the preview updates.

Widget Settings (Title, Gift Type)

In the Giving Widget Settings panel:

• Widget Title: A descriptive name for your reference (e.g., “Building Campaign Quick Give”). This appears in the control panel list, not on the embedded widget.
• Default Gift Type: Choose Credit Card, Bank Account (eCheck), or Use system default. This sets the default payment method donors see.
• Show Gift Type Picker: Yes (recommended for general giving) lets donors switch between card and bank. No hides the picker and locks the default type—useful for campaign-specific widgets where you want a single payment method.

Quick Amounts and Amount Input

In the Giving Amount & Widget Quick Amounts panel:

• Show Amount Input: Yes displays a free-form amount field. No hides it; donors can still use Quick Amounts if you add them. When Quick Amounts are present, the amount input is auto-hidden on the donor-facing widget.
• Quick Amounts: Add preset amounts (e.g., 25, 50, 100, 250) that donors can tap. Click “Add Quick Amount” to add a row. Enter the amount in the dollar field. Use the handle icon to drag and reorder. Click the trash icon to remove an amount. You can add as many as you need.

Quick amounts are optional. If you add none, donors use the amount input (when shown) or the system default amounts.

Fund Selection and Fund Picker Mode

In the Giving Widget Funds panel, choose how funds are selected:

• Pick parent funds and display all sub-funds: Select one or more parent funds. The widget shows those parents and all their sub-funds. Best when you want a full fund hierarchy.
• Pick sub-funds from various locations: Select any mix of sub-funds across your fund structure. Best for campaign-specific widgets where you want only certain funds.
• Mimic the primary donation form: The widget uses the same funds as your primary giving form. No manual fund selection needed.
• Mimic a custom giving page: Select a giving page from the dropdown. The widget displays that page’s funds and links to that page. The associated giving page should allow guest giving.

Fund Picker Mode: Use system default (recommended) lets the platform smartly select a fund when applicable, saving donor time. Force donor to choose fund requires donors to pick a fund every time—use only when you need explicit fund selection.

Progress Bar (Optional)

In the Giving Widget Progress Bar panel:

• Show Progress Bar: Choose Show Progress Bar or Do not show progress bar.
• Start Date (Optional): Limit progress to donations on or after this date. Leave blank to include all-time donations for the selected funds.
• Campaign Base Amount: A starting amount added to the sum of transactions. Useful when you have offline donations (checks, cash) to include in the total.
• Campaign Goal: The target amount. The progress bar shows total raised vs. goal and a percentage complete.
• Progress Bar Widget Mode: When checked, the widget displays only the progress bar (no giving form). Use for campaign pages where the form lives elsewhere.
• MinistryPlatform Program Integration: (Visible when MinistryPlatform is enabled.) When checked, progress bar totals sync from MinistryPlatform Programs associated with the funds. Note: This may impact page load speed; disable if speed is a priority.

The progress bar calculates total from the base amount plus approved transactions for the widget’s funds. When MP sync is on, it also includes MP Program totals.

Labels

In the Giving Widget Labels panel, customize the text donors see:

• Gift Amount Label: Default “I would like to give:”
• Gift Frequency Label: Default “How often would you like to give?”
• Fund Label: Default “Fund”
• Sub-Fund Label: Default “Sub Fund”
• Donation Button Label: Default “Donate”

Adjust these to match your church’s language (e.g., “Give Now” instead of “Donate”).

Header and Footer (Optional)

The Giving Widget Header and Giving Widget Footer panels let you add rich content above and below the giving form. Use the WYSIWYG editor to add text, images, and links. You can upload images via the Insert Image option. Header content appears above gift amounts and fund options; footer content appears below. These are optional—leave blank for a minimal widget.

Use the header for campaign messaging (e.g., “Help us reach our goal for the new youth center”) and the footer for trust signals or additional instructions.

Preview and Embed Code

Mobile and Tablet Preview

On the right side of the create/edit page (visible on larger screens), a Widget Preview panel shows how the widget will look. Switch between Mobile and Tablet tabs to see different device sizes. The preview loads the live widget in an iframe. After creating a widget, click “Save & Preview” to save and refresh the preview. New widgets must be saved once before the preview and embed code are available.

Copying the Embed Code

In the preview panel, open the Embed tab. A textarea contains the embed code: a container element and a script tag that loads the OnlineGiving.org embed script with your church code and widget ID. Click “Copy Embed Code” to copy it to your clipboard. Paste the code into your website where you want the widget to appear. The script loads asynchronously and renders the widget inside the container.

You can also access the embed code from the main widget list: click the widget title or use the gear menu and choose “Embed Code” to open the dedicated Embed page with a live widget preview and copyable code.

Managing Multiple Widgets

You can create as many widgets as you need. Use one for your homepage sidebar, another for your building campaign page, and a third for a mission trip fundraiser. Each widget has its own configuration. From the index page, search by title, change results per page, and use the action dropdown to Edit, view Embed Code, or Delete.

Editing and Deleting Widgets

Click “Edit” from the action menu to open the edit form. All settings are available. Make changes and click “Save” or “Save & Preview”. Changes take effect immediately for new page loads; existing embeds will show the updated widget on refresh.

Click “Delete” to remove a widget. You’ll be asked to confirm. Deleting a widget does not affect past transactions; it only removes the widget configuration. Any page that embeds the deleted widget will show an error until you update the embed code to use a different widget or remove it.

Campaign Widgets and Giving Page Linking

For campaign-specific widgets, choose “Mimic the funds as displayed on a custom giving page” and select the giving page tied to your campaign. The widget will show that page’s funds and link donors to the full giving page when appropriate. Ensure the giving page allows guest giving so visitors can complete donations without logging in.

When using a progress bar for a campaign, set a Start Date to limit the total to donations since the campaign launch. Use the Campaign Base Amount to add offline gifts. If you use MinistryPlatform and have Programs linked to your funds, enable the MinistryPlatform Program Integration option to sync progress from MP.

Frequently Asked Questions

Can I use a Giving Widget on multiple pages?

Yes. The same embed code works on any page. Paste it wherever you want the widget to appear. Each page will show the same widget with the same configuration.

Do donors need to create an account to give through a widget?

No. Widgets support guest giving by default. Donors can enter their payment and contact information without logging in. If you link a widget to a giving page, ensure that giving page allows guest giving.

What happens if I delete a widget that’s embedded on my website?

The embed will stop working. Visitors will see an error or blank area where the widget was. Update your website to remove the embed code or replace it with a different widget’s code.

Can I have a progress bar without a giving form?

Yes. Enable the progress bar and check “Display only the progress bar on the widget.” The widget will show only the progress bar (total raised, goal, percentage). Use this when your giving form is elsewhere on the page or on a separate page.

How do I change the funds shown in a widget?

Edit the widget and go to the Giving Widget Funds panel. Change the fund selection type or the selected funds, then save. The updated funds will appear the next time the widget loads.

Why doesn’t my preview show anything?

The preview requires a saved widget. Create the widget, click “Save” (or “Save & Preview”), and the preview will populate. New widgets must be saved at least once before the preview and embed code are available.

Need help setting up? Contact us at support@onlinegiving.org or (615) 206-4000. OnlineGiving.org provides courtesy setup assistance for our customers.