Open Collective Docs
Go back to Open Collective
Search…
Welcome
About
Introduction
Documentation
Terminology
Company
Pricing
Team
The Open Collective Way
Investors
Contributing
Product
Features
Roadmap
Comparison
User Profile
Currencies
Log-in System
Privacy Policy
Moderation
Security
Collectives
Collectives FAQ
Creating a Collective
Quick Start Guide
Collective Settings
Add Fiscal Host
Change Fiscal Host
Open Source Collectives
Transparent Budget
Expenses
Updates & Comms
Moderation
Conversations
Events
Projects
Funding Options
Buttons & Banners
Connected Collectives
Embed contribution flow
Financial Contributors
Financial Contributors FAQ
Guest contributions
Payments
Crypto Contributions
Website Badge
Receipts
Collective to Collective
Organizations
Expenses & Getting Paid
Expenses FAQ
Submitting Expenses
Virtual Cards
Expense Comments
Edit or Download an Expense
Tax Information
Fiscal Hosts
Fiscal Hosts FAQ
Becoming a Fiscal Host
Creating a Fiscal Host
Fiscal Host Settings
Payouts
Fiscal Host Dashboard
Bank Transfers
Virtual Card Settings
Add Funds Manually
Refunds
Host Fees
Local Tax Support
Agreement Templates
Independent Collectives
About Independent Collectives
Create an Independent Collective
Independent Collective Setup
Independent Collective Management
Close an Independent Collective
Contributing
Design
Development
Documentation
Translation
Powered By GitBook
Embed contribution flow
To integrate a "Contribute" option directly on your website
This feature is currently in a beta-test phase. If you face any issue or need assistance, you can send a message on Slack (#embed-contribution-flow channel)
The embed contribution flow is a way to integrate Open Collective on your own website. Visitors will be able to contribute directly, by simply providing an email address.
Embedded contribution on the website of an initiative

General considerations

  • The widget will look better if it has some space, ideally the full page height & width
  • The following URL parameters can be used to configure your integration:
Parameter
Value type
Default value
Description
useTheme
Boolean
true
​
By default, the theme of your profile (defined by your primary color) will be used. If you rather want to use the default Open Collective theme, set this to false.
hideHeader
Boolean
false
Set this to true to hide the header at the top
disabedlPaymentMethodTypes
[String]
null
A list of payment method types to disable. Example: [CREDITCARD, MANUAL, CRYPTO]
tags
[String]
null
Some tags to attach to the orders. If you're embedding the contribution flow on multiple pages/websites, you can use this to track from where the contributions are coming from.
Max number of tags: 30
Max tag length: 32

Embed the default tier (Donate)

The simplest way to embed the contribution flow is by using the /donate URL (e.g. https://opencollective.com/babel/donate). Just replace COLLECTIVE_SLUG by your collective slug below:
1
<iframe src="https://opencollective.com/embed/COLLECTIVE_SLUG/donate" style="width: 100%; min-height: 100vh;"></iframe>
Copied!

Embed a specific tier

To embed a specific tier, you'll need to know its ID. For that, go to your profile page, click on "Contribute" for the tier you want to embed then check the URL. It should look like https://opencollective.com/COLLECTIVE_SLUG/contribute/TIER_SLUG-TIER_ID/checkout
From this URL, you can deduct the embedded one (prefix with embed and removes /checkout):
1
<iframe src="https://opencollective.com/embed/COLLECTIVE_SLUG/contribute/TIER_SLUG-TIER_ID" style="width: 100%; min-height: 100vh;"></iframe>
Copied!

Embed an event ticket

Embedding for event tickets uses the same route as regular tiers. you must make sure to remove the parent collective path and to include a slug. The slug can be anything, so if you're not sure feel free to put any value in there. For example, this path:
can be embedded as:
Collectives - Previous
Connected Collectives
Next - Financial Contributors
Financial Contributors FAQ
Last modified 1mo ago
Export as PDF
Copy link
Contents
General considerations
Embed the default tier (Donate)
Embed a specific tier
Embed an event ticket