Best Webflow Calendar Cloneables

Free Basic Lil’ Calender by Bradley Stallcup

https://webflow.com/made-in-webflow/website/Basic-Lil-Calendar

If you’re building an events page/section, you’ll need a well-designed interface for users to RSVP or find more information. This template is minimal which makes it easy to customize to fit the brand colors you’re working with. You could connect it up with Webflow’s CMS so each event date has its own page for further details.

What's in this Template?

A single page with multiple event cards, as you scroll down, notice the cool parallax effect. There are two buttons on each card, one that can be connected to the CMS and the other is an external link to RSVP. Currently, these external links redirect to random websites, but you can redirect users to your chosen booking integration and payment gateway such as Cozy Cal, Check out this forum answer on how to use it.

What is this template for?

• Those who need an events page
• Those who need a minimal design which is easy to customize

Bottom Line

This is a free, simple to use template that can be dropped into any website.

Free Dashboard with Calender by Asier

https://webflow.com/made-in-webflow/website/Calendar-App

We’ve picked this cloneable as it isn’t only a simple events calendar, its so much more. The creator, Asier, has taken inspiration from eventcalenderapp.com, a ticketing and event web-app. This template is great for a budding SaaS developer that wants a clean yet sleek dashboard to build on top of. Although its lacking some functionality, the potential is there and it really makes you wonder how easy it can be to build low-code SaaS tools using Webflow. You can connect it up with Memberstack and turn it into a member-based platform.

Whats in this template?

Asier has built in an events calendar with multiple views including a list views for events with images, and a multi-card layout. This can potentially be connected to Webflow’s CMS and used to track and update events for every calendar month. So for example. if you teach classes or host webinars, you can update these dates, images and text each month from the CMS. There is also a working filter included so you can easily filter the type of event or task you have scheduled for a particular week or month.

What is this template for?

• Anyone who needs a template for a low-code dashboard
• Those who want a custom dashboard for their events, lessons, webinars. For example, if you’re an online course-instructor

Bottom Line

This is a modern dashboard with loads of potential.

NoCode Webflow Week Calendar

https://www.nocodeflow.net/webflowweekcalendar

This Webflow template is completely CMS based and allows you to build your own, custom weekly view calendar, a bit like Google Calendar. The design is modern and simple, making it easy to tweak and style to fit in with your brand guidelines. The most convenient thing about this template is that its not just another iFrame embed, its all built in Webflow, meaning you can just start to style the classes - like any other Webflow component.

Note: it's a premier template costing only $19.

What's in this template?

This template incorporates fully cuztomazible UI with the Webflow CMS so you can add events into different days dynamically. Wether you’re a developer or business owner, you can just focus on the style & user interface, whilst the code is taken care of.

The calendar isn’t infinite, however, it works from today -1 month in the past and +2 months in the future. If you’re not a fan of the 4-day-week-view, they have a tutorial which shows you how to change views, and style it to fit the rest of your page. Once you buy the template, you’re provided with a template for every state. Here is an image of the 7-day view:

What is this template for?

• If you’re a developer and a client needs a custom calendar to book events/meetings
• if you run multiple events and need a calendar for customers to have an overview of whats coming soon

Bottom Line:

It was difficult to find a calendar solution that works as well as this one. It handles all the code and responsiveness really well, all for as little as $19, it's a great option. Webflow freelancers especially would benefit as there isn’t a monthly fee like most integrations, you simply pay once and you’re ready to go.

‍

CMS Timeline Template by Vincent Bidaux

https://webflow.com/made-in-webflow/website/CMS-Timeline-Template

This next calendar cloneable is a free, CMS based timeline template. It was build to to show users a different calendar perspective, which is why we’ve included it in this round-up. The project features a horizontal timeline of events which all link to different webpages (or can be linked to a different page in your site). Since the timeline is CMS based, you can choose the years or months that are shown. Perhaps you’d like to only include the months where there is an event? thats easily editable in the CMS.

What's in this template?

The template features a neat scrolling animation where you can navigate by scrolling vertically. The vertical and horizontal timeline list both stay in complete sync. This makes it very unique compared to other calendars, keeping your  users engaged. In the CMS, there are two collections, one for the events and one for the categories of events. For each year of the timeline, there is one Collection List. Because it's completely CMS based, you can hand over this project to a non-developer and they can easily update events, change colors & dates all through the Webflow Editor.

It's also good to note that there are 2 lines of custom CSS Calc code, this was needed to achieve this type of CMS structure.

What is this template for?

• If you’re looking for a more unique, interactive calendar page to host all your events
• For teams with non-technical members who need to update the calendar using a simple interface like the Webflow Editor

Bottom Line

This template is a fun and unique approach to showcasing events. The developer found an interesting way to incorporate Webflow’s CMS, making this template very practical for real-life projects. Feel free to clone this template, remove the data in the Events and in the Categories Collections, and make this project your own.

Cal-Invite for Webflow by Finsweet

This next cloneable is a calendar-invite template built by the guys from Finsweet. Its easy to forget the date and times for events, so making it visible on your chosen calendar is very convenient. The alternative would be email sign-ups and newsletters, which is unreliable as most people have really busy inboxes. Time based events that can be added to users calendars have worked well in the past.

This clonable makes it simple, so users don't have to worry about forgetting an event after they RSVP.  The code is given to you in the tutorial, so all you have to do is copy and paste it into your Webflow project settings. Luckily, they have provided both a written tutorial and a video tutorial.

Docs: https://www.finsweet.com/cal-invite/docs

Video tutorial: https://www.youtube.com/watch?v=pAY7N16lbTU&feature=emb_title&ab_channel=Finsweet

Whats in this template:

This is another CMS-based events calendar, with a twist. Each card has links where the user can add the event details to their chosen calendar. Finsweet has selected the most popular ones, Google Calendar, Apple Calendar and Outlook.  To make this your own, you’ll need to add the calendar content to the page with the following classes:

1. .event-item-content
2. .event-title
3. .event-desc
4. .event-timezone
5. .event-start
6. .event-end
7. .event-location

Events are made from a CMS collection, each with a start & end date, timezone, description and title.

What's this template for?

• If you or your client is has live stream events. You can add this to your site so users can sign up for the streams by adding them to their personal calendars
• Reminder system. Users can set reminders for events, launches or updates

Bottom Line

This template by finsweet is an excellent way to get users signing up for events. They also have great learning resources where they explain step by step, making the entire process seamless.

Flow-calendar by Bob

The last calendar cloneable is the most simple yet effective template on the list. A complete events calendar with multiple views. Similar to others, it’s built with the Webflow CMS where all the events are located in, as well as the event pages themselves.

What's in this template?

As you click the left and right arrows, you can go back and forward in time, with some events listed on various days. Clicking the ‘today’ button jumps you back to the current date and there is a ‘week’, ‘month’ and even ‘day’ view, and all are mobile responsive. If you click on an event, it takes you to its respective events page. Since it's built with a CMS, all you have to do is update the events and dates to make it your own, simple yet effective.

Whats this template for?

• Any online business that holds regular events, either online or in person

Bottom Line

This is an easy to use, minimal calendar template for any Webflow project. All you’ll need to do is update the colours and fonts to fit your brand guidelines and change the events in the CMS collection.