Why don’t I see the calendar in the Designer?

Webflow renders custom embeds only on the published site and in Preview, not inside the Designer canvas. Publish or preview your site to see the live calendar.

Is it responsive in Webflow?

Yes. The widget adapts to the width of its container, so it looks right inside any Webflow section, column or grid on every screen size.

Can I match my Webflow brand?

Yes. Configure your accent color, fonts and default view, and the calendar will blend into your Webflow design.

Website builder

Event calendar widget for Webflow

Event Calendar Widget adds a fast, customizable events calendar to your Webflow site using the built-in Embed element. No external integrations, no maintenance — just paste and publish.

Start for free See live demo

4.9/5 from 1,284 reviews

00Live demo

Try the live calendar

Browse the months and open an event — this is the real widget, running below.

01Why it fits

Built to feel at home in Webflow

Everything you need to publish events on Webflow, without the maintenance of a heavier tool.

Uses Webflow’s native Embed element — nothing else to set up
Pixel-perfect and responsive inside any Webflow layout
Style it to match your brand’s colors and fonts

A Webflow CMS Collection isn’t a calendar

You can model events in a CMS Collection, but you still have to design the calendar UI, handle recurring events and time zones, and update each item by hand. Event Calendar Widget gives you a finished, interactive calendar that syncs from Google or iCal on its own.

02Use cases

What people publish with it on Webflow

A few of the most common ways teams put the calendar to work.

01
Agencies adding a polished events section to client marketing sites
02
Conferences and meetups publishing their full schedule
03
Startups listing product webinars and launch dates

03Setup

How to add a calendar to Webflow

Add it with the Embed element — usually in just a few minutes.

1
Add an Embed element
In the Webflow Designer, open the Add panel, find “Embed” under Components, and drag it onto your page.
2
Paste your embed code
Paste the Event Calendar Widget snippet into the HTML embed editor and save.
3
Publish your site
The calendar renders on your published site. (Embeds show as a placeholder inside the Designer, which is expected.)

webflow-embed.html

<!-- Event Calendar Widget embed code -->
<div id="calendar-embed-cal-dot-et"
  data-calendar-link="your-calendar-id"
  data-theme="#2563eb"
  data-show-powered="true"
  data-mode="light"
  data-first-day-of-week="mon"
  data-view="month"
  data-show-side-panel="false"
  data-timezone="America/New_York"></div>

<script src="https://calget.com/assets/js/embedcalendar.js" defer></script>

The Embed element is available on paid Webflow site plans and accounts that allow custom code.

04FAQ

Webflow questions

: Webflow renders custom embeds only on the published site and in Preview, not inside the Designer canvas. Publish or preview your site to see the live calendar.
: Yes. The widget adapts to the width of its container, so it looks right inside any Webflow section, column or grid on every screen size.
: Yes. Configure your accent color, fonts and default view, and the calendar will blend into your Webflow design.