You built the site in Elementor. The header, the footer, the landing pages, the custom styling you fussed over for an afternoon. All of it looks like one thing, because you laid it out yourself.
Then there are the event pages.
Those are the ones you either style by hand, one at a time, or hand over to whatever your theme does with a single post. One person told us they were designing every event individually through the Elementor interface, which is a lot of clicking for something that ought to be a template. Another asked how to get our output to sit inside their own header and footer. A third just wanted to build their event overviews the way they build every other page on the site.
Fair asks, all three. So here is what you can build now.
Meet the Sugar Calendar widgets for Elementor
Every part of an event is available to you as an Elementor widget. Its title, its date, its time, its image, its description, the venue name and address, the speakers, the add-to-calendar link, the ticket box. You drag them in and position them like anything else in the editor.
That changes the job from styling event pages to laying out one page, which is a much smaller job.
Put the event’s details exactly where you want them
Open the widget panel, and you will find the event pieces grouped under Sugar Calendar Event. Drop the title in, put the date and time side by side, give the description room to breathe, and tuck the venue and the speakers into a card off to the side.
Each widget fills itself from the event being viewed, so you are arranging real content rather than placeholders.
On a specific event, which widgets you see depends on what that event actually has. An event with a venue offers you the venue widgets; add speakers or RSVPs, and those turn up too. It keeps the panel honest instead of handing you a wall of fields that would render empty.
Design the layout once, and your event pages follow it
In Elementor’s Theme Builder, there is now a Single Event part, alongside Header, Footer, and the rest. Lay out the event once there, publish it, and your event pages use that layout. No per-event work. Change your mind about where the venue sits, and you change it in one place.
Here is the same template doing its job on the front end, filled in with one event’s own details.
Build the events listing in the same breath
Events also work as a source for Elementor’s Loop Grid. Design one card, and the grid repeats it across your events. You can narrow it by calendar, and with Sugar Calendar Events Pro by venue or speaker too, or point it at specific events by ID.
Just need a calendar on a page?
Then you do not need any of the above. The Events Calendar and Events List widgets live in Elementor’s own Basic section and have done for a while. Drag one onto a page, set how it displays, done. The docs cover both: the calendar widget, the events list, and an upcoming-only list.
What this looks like on a real build
Say the site is a community arts center. Perhaps you run it, perhaps you are building it for someone who does. They put on a workshop most weeks, each one its own dated session, some with a guest tutor, all at the same hall.
The events are usually the awkward part. You set up the calendar, then either accept the theme’s single-post layout for each workshop or dress each one by hand, knowing there are twenty more coming.
Now you lay out one Single Event template: image, title, the date and time as a pair, the description, then a side card with the venue, the tutor and an add-to-calendar link. You build the listing page as a Loop Grid using the same visual language. From then on the workshops that get added arrive already laid out. Nothing to style each time, and nothing to explain to whoever adds the next one.
Who this is for
- Developers and agencies building an events or ticketing site for a client, who want the event pages inside the same design system as the rest of the build and no PHP templates to maintain.
- Business owners and organisers running their own Elementor site, who want to change how an event page looks without waiting on anyone else to do it.
- Studios, workshops and course businesses already running Elementor, who want the ticket box and the details where they decided they should go.
- Anyone who has been overriding a theme template to change what an event page shows, and would rather do it in the editor.
- People shopping for an events plugin with Elementor already in the stack, who reasonably want to know whether it fits before they invest their time.
Getting there
Switch Events on in Elementor
Go to Elementor » Settings » General and tick Events under Post Types. This is off by default, and it is what lets Elementor edit an event and offer you the event widgets.
Lay out one Single Event template
In Templates » Theme Builder, pick Single Event and add new. Build the layout with the Sugar Calendar Event widgets, plus any Elementor widget you like around them.
Point it at your events
Publish the template and set its display condition to your events. Elementor’s conditions know about events now, so this is a dropdown rather than a workaround.
Look at it as a visitor
Open any event on the front end. Theme Builder needs an Elementor-compatible theme to take over the layout. And if a single widget is blank, check whether that event has the data behind it. A venue widget needs a venue.
For the full details on each widget, see our guide on customizing Sugar Calendar Events with the Elementor page builder.
What you need
The Elementor integration requires Sugar Calendar Events 3.10.0 or later, and the widgets are available in our Lite version as well. Beyond that, two separate things are worth keeping straight, because one of them is not ours:
- The single-event widgets, the Events Calendar and the Events List work with free Elementor.
- The Single Event template and the Loop Grid are Elementor Pro features.
- The venue, speaker, calendar-feed, event-link, and occurrences widgets come with Sugar Calendar Events Pro, along with the venue and speaker filters on the Loop Grid and on the calendar and list widgets.
- The ticket widgets come with the Event Ticketing addon, and the RSVP widgets with the RSVP addon.
If the Pro widgets are the ones you want, the plans are on the pricing page:
Why this matters
An events plugin has a habit of becoming its own little island on a site. Its pages look slightly different from everything around them, and changing that means learning its template structure and making coding adjustments.
This moves event pages back into the same place as the rest of your site. You lay them out in the tool you already use, rather than learning where a theme keeps its templates and what it will let you change.
Before you go
If you are already on Elementor, the thing I would actually do is spend twenty minutes on one Single Event template. That is the change you feel. It pays for itself the first time an event goes up and needs no attention at all.
This one exists because people kept asking for it, in the feedback form and on the support side, some of them in considerable detail. Thank you for that. If there is a widget you expected and did not find, tell us and it might be included in the next release.
Gregor Capuder
Product Manager
Frequently asked questions
For the widgets, no. For the Single Event template and the Loop Grid, yes, because both are Elementor Pro features. Free Elementor plus Sugar Calendar Events gets you the calendar and list widgets, and the individual event widgets on an event you are editing.
The Events Calendar and Events List are in Elementor’s Basic section. The individual event pieces are grouped under Sugar Calendar Event.
Two likely things. Check that Events is ticked under Elementor » Settings » General » Post Types, and note that the event widgets only appear where there is an event in context: editing an event, or working in a Single Event or Loop Item template. On an ordinary page they are not offered, which is deliberate.
Yes. Events show up in Elementor’s conditions, so you can target them the way you target posts or pages.
No. Your events stay as they are. A Single Event template changes how they are laid out, and you can go back to your theme’s layout by unpublishing it.
Yes. Nothing here removes the blocks or the shortcodes. This is about giving Elementor users a native way to work. See Display Events for the other ways to get events onto a page.
