Overview
The Dodo Payments Framer Plugin seamlessly integrates payment processing into your Framer websites. Create customizable checkout experiences with support for both test and production environments.Official Plugin
Access the official Dodo Payments plugin on the Framer marketplace.
Features
Hosted or Overlay Checkout
Choose a full-page flow or an inline overlay that feels native to your site.
Drag-and-Drop Setup
Add the component, paste your keys, publish.
Instant Digital Delivery
Secure download links or license keys emailed the moment payment clears.
Worldwide Coverage
Bank-level acquiring on six continents, local methods built-in.
Automatic Tax & Invoicing
VAT, GST, sales tax, and receipts handled for every order.
No-Code Subscriptions
Flip a switch to sell subscription plans for your products.
Setup Guide
1
Generate API Key
Visit the Dodo Payments Dashboard and create a new API key.
- Live Mode
- Test Mode
For production use with real payment processing.
Copy your API key securely - you’ll need it for the next step.
2
Authenticate Plugin
- Open the Dodo Payments plugin in Framer
- Navigate to the Authentication page
- Paste your API key
- Select the appropriate mode (Test or Live)
- Click Continue to authenticate
Keep your API keys secure and never share them publicly.
3
Manage Products
After authentication, you’ll see your products list:
- Existing products: Displayed automatically
- No products: Click the Plus (+) button next to ‘Products’
You’ll be redirected to the Dodo Payments Dashboard to create products with pricing, descriptions, and settings.
4
Add Buy Buttons
- Select a product from your available list
- Click the
Add Buy Button
button - A buy button with the text ‘Buy {product_name}’ will be added to your canvas
The Add Buy Button will be disabled if you don’t have the correct project permissions.
Customization
1
Select Checkout Experience
Choose your preferred checkout experience:
- Overlay (Embedded): Checkout appears as an overlay within your Framer project, keeping users on your site.
- Hosted: Users are redirected to a Dodo Payments hosted checkout page for a streamlined experience.
2
Customize Appearance Options
Customize your checkout experience with the following appearance settings:
- Checkout Theme: Choose between light or dark themes to match your brand aesthetic.
- Button Label: Customize text (e.g., ‘Buy Now’, ‘Purchase’, ‘Get Started’).
- Button Styles: Adjust colors, fonts, sizes, and other styling properties.
- Return URL: Set a Framer page for the user to return to after checkout.
Troubleshooting
Authentication Issues
Authentication Issues
Problem: Plugin won’t authenticateSolutions:
- Verify your API key is correct
- Ensure you’re using the right mode (Test/Live)
- Check your internet connection
Button Creation Issues
Button Creation Issues
Product Display Issues
Product Display Issues
Problem: Products not showingSolutions:
- Make sure you have products created in your Dodo Payments dashboard
- Check that your API key has the correct permissions
- Try re-authenticating