Event Calendar Widget for Your Website

New

List what's coming up, with past events hidden automatically and an add-to-calendar link on every entry. Four layouts, no API and no Google account. Free, no signup.

Events (3)

Event 1
Leave empty for an all-day event.
Event 2
Leave empty for an all-day event.
Event 3
Leave empty for an all-day event.

Dates are compared against each visitor’s own clock, because the widget runs entirely in their browser. An event stays listed for the whole of its day rather than vanishing at midnight.

Live preview
3 events
What's on
Friday · 19:30–22:00
Live music night
The back room
Friday · 10:00–16:00
Weekend market
Front yard
Friday
Summer closing day

Embed on your site

Add an event to get your embed code
Every event needs a title and a date.

Dates are compared against each visitor's own clock, and an event stays listed for the whole of its day rather than vanishing at midnight.

About the Event Calendar Widget

Zyff's event calendar widget lists what is coming up on any website, free. Each event takes a date, an optional start and end time, a location, a description and a link — and events that have already happened drop off the list on their own. Every entry can carry an add-to-calendar link, which is a plain Google Calendar URL rather than anything needing an account connection. Choose an upcoming list with a date block, cards, a compact programme or events grouped by month. The output is one div and one script tag that works in WordPress, Shopify, Wix, Squarespace, Webflow or a hand-written HTML page alike.

How to add an events calendar to your website

  1. Add your events

    Each one needs a title and a date. Times are optional — an event with no time is treated as all-day.

  2. Decide what is listed

    Hide events that have passed, and cap how many are shown so a busy programme does not fill the page.

  3. Pick a layout

    The upcoming list puts a date block beside each event, cards suit a short programme with images, compact fits a long one, and grouped gathers events under a month heading.

  4. Copy the embed code

    Paste the container div and script tag where the events should appear, or download the standalone HTML file. Check the 390px mobile preview before you ship it.

What the Event Calendar Widget does

Past events drop off by themselves

Once a date has gone the event stops being listed, so a page nobody has updated in a month still shows only what is actually coming. The events stay in your list so you can reuse them next year.

Still listed for the whole of its day

An event today remains visible until the day ends rather than disappearing at midnight, so tonight's gig is still there for someone checking that morning.

Add to calendar, with no account connection

Each event can carry a Google Calendar link built from its own fields — a plain URL with the details in the query string. Nothing to apply for and no permissions to grant.

An empty state you write

Set what appears when nothing is coming up, so a quiet month reads as deliberate rather than broken.

Four layouts

An upcoming list with a date block, cards with images, a compact programme, and events grouped under month headings.

Nothing to slow your page

The whole calendar runs in the visitor's browser from the settings in your snippet, so it makes no request to Zyff when your page loads.

At a glance

EventsUp to 60, each with a date, start and end time, location, description, image and link
OrderingSoonest first, worked out from the date
Past eventsHidden automatically, or kept if you prefer
LimitShow all of them, or cap at any number
Add to calendarGoogle Calendar link, generated per event
Layouts4 templates: upcoming list, cards, compact, grouped by month
OutputOne container div plus one script tag, or a downloadable HTML file
PriceFree to build; paid plans for saved widgets

Frequently asked questions

How do I add an events calendar to my website?

Add each event in Zyff's builder with a title and a date, pick a layout, then copy the generated embed code into your page. The whole flow is free with no signup, and the snippet is plain HTML, so it drops into any CMS block that accepts custom code.

Do past events disappear on their own?

Yes, that is the point of it. Once a date has gone the event stops being listed, so a page nobody has touched for a month still shows only what is genuinely coming up. The events stay in your list rather than being deleted, so an annual fixture can be reused by changing its date.

Does an event vanish at midnight on the day?

No — it stays listed for the whole of its day. Dropping it at 00:01 would hide tonight's event from anyone checking that morning, which is exactly when they are most likely to look.

Which timezone are the times in?

The visitor's own, because the widget runs entirely in their browser with no server behind it. For a venue that is almost always right, since the people checking are usually local. It also means the add-to-calendar link passes the time as you typed it rather than stamping a timezone offset Zyff cannot know.

Does the add-to-calendar link need a Google account connection?

No. It is a plain Google Calendar URL with the event details in the query string — the visitor clicks it, Google's own page opens pre-filled, and they save it with their own account. Nothing to apply for, no permissions to grant, and Zyff never touches anyone's calendar.

Can it sync with Google Calendar or an ICS feed?

No. Reading a calendar feed means fetching a URL server-side on every page load, which is a caching problem and an SSRF surface, and syncing a Google Calendar needs OAuth. This widget lists the events you enter, which is the version that needs no credentials and cannot break when a token expires.

Can I show a monthly grid view?

Not a traditional month grid. The grouped layout gathers events under month headings, which is what most visitors actually want from a small venue's page — a grid of mostly empty squares tells them less than a list of what is on.

Where do I paste the events embed code?

Wherever the programme should appear — a what's-on page, a sidebar, or partway down a home page. Put the container div in that spot and keep the script tag with it.

Is the event calendar widget really free?

Yes. Building it, styling it and embedding it are free with no signup, no trial and no watermark — a free embed carries a small \"Events by Zyff\" link, which is how the tool stays free. Hiding past events is free too: a calendar that kept showing last month's programme would be publishing wrong information rather than a plainer version of the widget. A paid plan adds the cards and grouped layouts, full colour control and removes the attribution link.