Bubble.io plugin
Clym CMP for Bubble.io
The Clym CMP plugin for Bubble.io allows you to quickly integrate Clym's consent and accessibility management solutions into your Bubble application without needing to manually add the installation embed code to your app's header. Once installed and configured, the plugin connects your Bubble application to your Clym account, and automatically injects the Clym widget scripts on page load via a workflow action, allowing you to easily deploy and manage Clym functionality throughout your Bubble environment.
Below, you can find details on:
- The requirements to use the Clym CMP plugin
- How to install the plugin on your Bubble.io website
- How to configure your Clym widget
- How to apply Clym to multiple pages
- How to verify the installation was successful
Requirements
- A Bubble.io account with an existing app
- A Clym account — log in at auth.clym.io or register at register.clym.io
Installation
- In your Bubble app editor, open the Plugins tab in the left sidebar
- Click Add plugins
- Search for Clym CMP
- Click Install
Configuration
The Clym widget is activated via a workflow action on each page where you want it to appear.
Step 1 — Add the workflow
- Open the Workflow tab for your page
- Click + Add a new event → General → Page is loaded
- Click + Add an action → find the Clym CMP section → select Initialize Clym CMP
Step 2 — Enter your Widget ID
- In the action settings, find the Widget ID field
- Enter your Clym Widget ID
Your Widget ID can be found in your Clym Control Center account at auth.clym.io. After signing into your Clym account, your property ID will be available in your URL.
Step 3 — Deploy
Click Deploy to publish your changes. The Clym widget will now load on that page whenever a user visits it.
Applying to multiple pages
Repeat the workflow setup on each page where you want the Clym widget to appear. For app-wide coverage, add the workflow to every page or use a reusable element that is present on all pages.
Important note
Bubble's JavaScript environment runs after the page shell has been delivered to the browser. This means the Clym scripts are injected dynamically on page load rather than server-side. The widget initializes correctly for all user interactions on the page.
For true synchronous <head> injection, an alternative is to add the script tags manually via Settings → SEO / Metatags → Script/meta tags in header:
<script src="https://config.clym-widget.net/v2/YOUR-WIDGET-ID.js"></script>
<script src="https://widget-next.clym-sdk.net/v2/stub.js" data-property="YOUR-WIDGET-ID"></script>
Verification
Open your app in Preview mode, right-click the page and select View Page Source. Search for clym-widget.net — you should see the two script tags present in the page.
Support
If you encounter any challenges, please reach out to support@clym.io.
Updated on: 13/05/2026
Thank you!