---
title: Opportunity Widget
description: Want to add an "Attend" widget directly to your website for people to purchase tickets and checkout?
---

[Skip to content](https://faq.givsum.com/opportunity-widget#main-content)

English

Show submenu for translations

[Submit a Request](https://faq.givsum.com/kb-tickets/new?hsLang=en)

![givsumLogo\_orange\_long (1)-2.png\]](https://faq.givsum.com/hs-fs/hubfs/givsumLogo_orange_long%20(1)-2.png?height=40&name=givsumLogo_orange_long%20(1)-2.png)

Open main navigation

Close main navigation

- English
  
  Show submenu for translations
- [Submit a Request](https://faq.givsum.com/kb-tickets/new)
- [Go to givsum.com](https://www.givsum.com/)

[Go to givsum.com](https://www.givsum.com/)

 Hello. How can we help you?

- There are no suggestions because the search field is empty.

1. [Givsum Help Desk](https://faq.givsum.com/?hsLang=en)
2. [Getting Started as an Admin](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en)
3. [Widgets](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#widgets)

# Opportunity Widget

## Want to add an "Attend" widget directly to your website for people to purchase tickets and checkout?

By using Givsum's Opportunity Widget, you can add an "Attend" button and allow your visitors to purchase tickets and checkout from your website.  Copy and paste the code provided from the link icon on your opportunity page's admin bar, or use the code below by replacing \[opportunity\] with the opportunity url slug.

```
<a href="https://www.givsum.com/opportunities/[opportunity]" class="givbtn">Attend Our Event!</a><script src="https://www.givsum.com/widget.js" type="text/javascript"></script>
```

 

**Advanced Usage:**

The "script" tag only needs to be called once and can be placed anywhere relative to your widget button / buttons.

Use a "data-style" attribute with the values "full" or "none" to make the button full-width, or remove the default styling.

 

**Alternatively:**

You can also use the Givsum Opportunity Widget by adding an iframe ticket purchase and donation form directly to your website which will allow your visitors to purchase tickets and donate from your website. Copy and paste the code provided from the link icon on your opportunity page's admin bar, or use the code below by replacing \[opportunity\] with the opportunity url slug.

```
<iframe src="https://www.givsum.com/charities/[opportunity]/widget?givwidget=true&givembed=true" width="50%" height="400px" style="background-color: #f9f9f9"></iframe>
```

 

**Advanced Usage:**

Use the "width" attribute with a value from "0%" to "100%" to decrease and increase the width of the donation form. 

Use the "height" attribute by increasing or decreasing "400px" to increase and decrease the height of the donation form.

Use the "background-color" attribute held inside the "style" attribute to modify the background color of the form as fit for your website. The value entered after the "#" should be in hexidecimal format for the RGB value. The default recommended color (#f9f9f9) shown above is a light shade of gray.

- [Getting Started as an Admin](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#main-content)

    - [General](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#general)
    - [Members](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#members)
    - [Supporters](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#supporters)
    - [Automated Emails](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#automated-emails)
    - [Surveys](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#surveys)
    - [Widgets](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#widgets)
    - [OC Nonprofit Central](https://faq.givsum.com/getting-started-as-an-admin?hsLang=en#oc-nonprofit-central)
- [Getting Started As A User](https://faq.givsum.com/getting-started-as-a-user?hsLang=en#main-content)

    - [General](https://faq.givsum.com/getting-started-as-a-user?hsLang=en#general)
    - [Special Occasions](https://faq.givsum.com/getting-started-as-a-user?hsLang=en#special-occasions)
    - [Logging In](https://faq.givsum.com/getting-started-as-a-user?hsLang=en#logging-in)
- [Subscriptions and Billing](https://faq.givsum.com/subscriptions-and-billing?hsLang=en)
- [Payments and Refunds](https://faq.givsum.com/payments-and-refunds?hsLang=en)
- [Auctions](https://faq.givsum.com/auctions?hsLang=en)
- [Creating Fundraising & Volunteer Opportunity Pages](https://faq.givsum.com/creating-fundraising-volunteer-opportunity-pages?hsLang=en#main-content)

    - [General](https://faq.givsum.com/creating-fundraising-volunteer-opportunity-pages?hsLang=en#general)
- [Request Form](https://faq.givsum.com/request-form?hsLang=en)
- [Point of Sale App](https://faq.givsum.com/point-of-sale-app?hsLang=en)
- [Product Update Releases](https://faq.givsum.com/product-update-releases?hsLang=en)
- [DONATIONS](https://faq.givsum.com/donations?hsLang=en#main-content)

    - [Donation Amounts](https://faq.givsum.com/donations?hsLang=en#donation-amounts)
- [Editor](https://faq.givsum.com/editor?hsLang=en#main-content)

    - [ChatGPT A.I.](https://faq.givsum.com/editor?hsLang=en#chatgpt-a-i)
- [Giving Days](https://faq.givsum.com/giving-days?hsLang=en#main-content)

    - [Peer-to-Peer Giving Days](https://faq.givsum.com/giving-days?hsLang=en#peer-to-peer-giving-days)
    - [Giving Day Org Profile](https://faq.givsum.com/giving-days?hsLang=en#giving-day-org-profile)

[![Chill listening crop-3](https://faq.givsum.com/hs-fs/hubfs/givsumLogo_orange_long%20(1)-3.png?width=126&height=24&name=givsumLogo_orange_long%20(1)-3.png "Chill listening crop-3")](https://www.givsum.com/)

givsum.com Help Center

Copyright © 2026, Givsum, Inc.