Live demo · Timeline
Elementor Events Timeline for The Events Calendar
Show your events in date order along a line with the Eventful Timeline widget. Choose a vertical timeline (5 styles) or a swipeable horizontal one (3 styles), add month and year labels, and set the line, dot and date badge colours. Every timeline below is the live widget.
01
Alternating Elementor events timeline
How to set it: Timeline Style: Vertical, Style 01 Alternating. Month/Year Separator on. Line 2px, light grey; dot and date badge in brand blue.
Live widget · Style 01 + month separator
02
Staggered columns
How to set it: Vertical Style 02 Staggered Columns. Compact and easy to scan.
03
Line on the left
How to set it: Vertical Style 04 Line on Left: every event on one side, like an agenda. Image off.
Live widget · Style 04 (Pro)
Future Leaders Business Summit
Finance Basics for Founders
Outdoor Team Building Retreat
Digital Marketing Growth Conference
Product Design Sprint
04
Horizontal timeline
How to set it: Timeline Style: Horizontal, Style 01 (Alternating): cards above and below the line. Columns: 3. Swipe, drag or use the arrows to move along it.
Options
What you can customise
Everything below is a control in the Elementor panel. No code needed.
- Vertical: Style 01 Alternating (free), plus Staggered Columns, Two Columns, Line on Left and Line on Right (Pro)
- Horizontal: Alternating, Line on Top and Line at Bottom (Pro), with 1 to 6 columns
- Month and year separator between event groups
- Space between events
- Line thickness and colour, dot colour, date badge colour, navigation colour
- Touch swipe, mouse drag and mouse wheel on the horizontal timeline
- All card options: image, meta, excerpt, read more
- Load More pagination on vertical timelines
Is the Timeline widget in the free version?
Yes. Eventful Timeline is in the free version with the vertical Style 01 (Alternating). Pro adds the other four vertical styles and the horizontal timeline.
Can the Elementor events timeline show month headings?
Yes. Turn on Month/Year Separator and a label appears between groups of events from each month.
Does the horizontal timeline work on phones?
Yes. It is a swipeable row; set the number of columns and visitors swipe or drag to move along the timeline.
Last updated:
Give your events the layout they deserve
Nine Elementor widgets, AJAX filters and full style control. Try the free version or go Pro today.