All Collections
Integrating with
CMS Integrations
Setup 1-click CMS integration with Webflow
Setup 1-click CMS integration with Webflow

Learn how to setup CMS integration with Webflow so events created in Sequel appear directly in your CMS

Updated over a week ago offers seamless integration with any CMS, allowing events created in our dashboard to automatically appear on your website. In this article, we will provide you with a step-by-step guide on how to integrate with Webflow and effortlessly embed Sequel events without the need to manually copy and paste the embed code for each session.

What do you need to get started?

  1. Business plan

  2. A Webflow website with the CMS plan

  3. A Zapier Starter Plan

Final result

Once the integration is ready, any events created in Sequel will generate a CMS entry in Webflow with the correct Sequel embed code:

The Sequel event will also include the accurate Slug (event URL) that has already been added in the Registration section, ensuring that you never miss directing your audience to your website.

With this integration, you have the flexibility to choose whether you want the events to be published on your website immediately or keep them in draft mode until you approve the CMS entry. This allows your design team to maintain the desired look and feel of your website while you can focus on creating and running webinars effortlessly.

Excited? Let's begin creating this integration.

Setting up the Webflow website

There are many ways to create a CMS template for your webinars in Webflow. In this article we will create a very simple design with your top navigation, Sequel embed and a footer.

To start, you need to set up the CMS. You have the option to use your current CMS or create a new one. In this article, we will create a new CMS. Go to the CMS collection and click on "New Collection."

Feel free to name this collection whatever you prefer, such as webinars, events, or sessions. For the purpose of this article, we will refer to it as sessions.

Take note of the Collection URL. It will be used later in Zapier.

Under the Collection Fields, create a new Plain Text called Sequel Event Id. This will be used later to embed Sequel events.

Once ready, press on Create Collection. This CMS collection will be used in the 1-click integration. You can use any existing collection but make sure to add the Sequel Event Id as a field.

Update Collection Page to include Sequel embed code

We will use the Sequel Event Id field above to embed Sequel on your page. Open the collection template:

Add a new Embed section on your page. We recommend this at the top of the page right under the Header so users don't have to scroll. Add the following code:

<script type="text/javascript"> url =; document.write('<iframe title="Sequel event" width="100%" height="90vh" src="' + url + '" frameborder="0" allow="camera *; microphone *; autoplay; display-capture *" allowfullscreen style=" height: 90vh; border-radius: 12px; border: 1px solid #dbdfec; box-shadow: 3px 3px 10px 0 rgb(20 20 43 / 4%); width:100% " > </iframe>'); </script>
Locate in the code EVENTID and replace it with a Webflow field

Make sure you selected EVENTID and press Add Field. Select the field created above called Sequel Event Id

The final code should look like this. Please note the EVENTID was replaced with the Sequel Event Id field from Webflow.

Press Save and Close to include the Sequel component. Now any CMS entry that has the Sequel Event Id will automatically render the Sequel Stage without having to copy paste the code again.

You can add the Footer and Header components on this page to contain the HTML code. We also recommend adding some padding around the HTML embed on the right and left side.

Once a Sequel Event Id is added to a CMS entry, the page will render the correct Sequel iframe:

The CMS collection and design is now ready. Let's hook up your Sequel account to Webflow using Zapier.

Create the CMS connection using our Zapier template

We created a pre-defined Zapier template to make the integration easier.

Step 1: Setup Sequel account

Under 1. Virtual Stage Created in - Choose An Account press on Choose and login with your admin account on Sequel.

In the next step, add the company id from Sequel. When you login to the Sequel dashboard you will find an id in the url

Copy the company ID in Zapier

Next, press on Test trigger to fetch the company.

If you see an error, please double check the company ID.

Step 2: Setup Webflow account

The first step is to decide if you want the CMS entry to be published automatically or to stay in draft mode.

By default the Create Live Item event is selected. If you wish to keep the item unpublished when created, select the Create Item option.

Switch to Account and Press Choose to login with your Webflow account.

Select your site and the Collection created above. In our case Sessions.

Under Collection you will find the Sequel Event Id field created in CMS. Click on the field and add Details Event Id. This will ensure the correct event id is created in Webflow.

Under name, insert Details Event Name

The last are required by Webflow and you can decide if you want the CMS to be in archive or draft mode.

You can run a Test or Skip if you do not wish to generate a CMs entry.

Step 3: Add API request

In this step, make sure to Select the Webflow account from before.

In Action, add the following in the URL field{{_cid}}/items/{{_id}}

Press Continue and Skip the test.

Step 4: Update event in Sequel

In this step you need to add 4 fields:

Event Id: click on the field and select Details Event Id

Collection Id: type in {{_cid}}

Item Id: type in {{_Id}}

Registration Url: this is the registration url for users to attend your webinars. Use the main domain from your Webflow site and the collection used above.

To find this URL, look under the collection settings in Webflow and copy the Collection URL

Based on the example above:

The main domain is

And path is sessions

The final registration URL should look like this.

Make sure to add {{slug}} at the end of the url, instead of the session-page, this will add the unique links for each session.

Press Continue and Skip Test.

Ready to publish

Now that all Steps are green, you can Publish the Zap

To test, login to Sequel and create a new Event.

Once the event is created, check the Webflow collection and you should see the entry with the correct name and event id. You may have to wait a few seconds or refresh the page to see it.

The final test is to look under Slug and open the URL in a new tab. You should see the Sequel component with the registration form

Register for this event with your email and check the Join event link

Pressing Join event should redirect you back to your Webflow site.

And that's it! The 1-click CMS integration is now setup for all your future events.

Did this answer your question?