Givebear LogoGivebear

Troubleshooting

Fix common Givebear SDK issues.

Widget does not appear at all

Script not loaded. Open your browser Network tab and search for givebear.js. If it is absent, the <script> tag is missing or has a typo in the URL.

Attribute typo. The attribute must be exactly one of:

  • data-givebear-button
  • data-givebear-card
  • data-givebear-embed
  • data-givebear-prayer-times
  • data-givebear-calendar
  • data-givebear-events

Timing issue with the JavaScript API. If you call window.Givebear.renderButton(...) directly, the element must exist in the DOM before the call runs. Use the auto-mount data attributes or the async queue pattern to avoid race conditions.

Browser console warning. Open the console and look for [Givebear] messages. They describe the specific configuration problem.

Widget shows an error message

Wrong or missing organization ID. The organizationId field must be the UUID from your Givebear dashboard (Settings page). A slug, name, or typo will not work.

Organization not payment-ready. The organization needs a connected and fully onboarded Stripe account. Check payment readiness in the Givebear dashboard before changing website code.

Fund or campaign not published. A fund must be published and a campaign must be active to appear in a widget. Check the Givebear dashboard.

Donation form opens but payment fails

Payment errors after the modal opens are Stripe-level issues, not SDK issues. Check:

  1. Stripe connected account is fully onboarded.
  2. The organization's Givebear billing readiness is complete.
  3. You are not using test card numbers against a live Stripe account, or vice versa.

Button looks unstyled or inherits wrong fonts

Widgets inherit font-family, font-size, and color from the host page by design. If text looks unexpected, the host page has unusual global styles. This is expected behavior. The widget adapts to the surrounding typography.

Accent color has no effect

accentColor must be a valid CSS color: #3a7a4b, rgb(58, 122, 75), hsl(135, 35%, 35%), or a CSS named color. Hex shorthand (#3a7) is supported.

Multiple widgets on the same page

Each widget is independent and mounts separately. You can have multiple widgets with different organizationId values, different fund IDs, or different modes on the same page.

Widget blocks other page elements (z-index conflict)

The donation modal uses z-index: 2147483647 (maximum 32-bit signed integer). If a page element still appears above the modal, that element is likely using position: fixed or isolation: isolate outside a stacking context that the modal can't escape. Contact support with a link to the page.

How to find your organization ID

Go to your Givebear dashboard → Settings → scroll to the bottom of the General section. The organization ID is displayed there as a UUID, for example: 3f4a1b2c-7e0a-4d1b-9c8f-1234567890ab.

On this page