The Events Calendar Widget allows you to display your events in a full-featured, interactive calendar directly on any Elementor page.
Follow the steps below to add it to your page:
Add Events Calendar Widget
- Go to Pages/Posts > Add New.
- Click the Edit with Elementor button.
- From the widgets section search “events calendar”.
- Drag and drop the Events Calendar Widget to your page.
Customization
After adding the calendar layout to your page, you can fully customize it using following settings:
Events Calendar Settings
- Number of Events: Set the maximum number of events to display in the calendar.
- Default View: Choose how the calendar is displayed by default: Month, Week, or Day.
- First Day of Week: Select which day your week should start on.
- Show Popup: Controls whether to display event details in a new browser tab.
- Event Link Target: Turn this option on to open event links in a new browser tab instead of the same window.
Events Query Settings
- Events Time: Choose whether to display: All Events, or B/w Dates.
- Filter Events By:
- Category: Show events from one or multiple specific categories.
- Tag: Filter events using tags for precise organization.
- Organizer: Display events by specific organizers.
- Venue: Show events happening at specific venues.
Style Settings
- Calendar Events: Change the background and text colors for single-day and multi-day events.
- Calendar Filters: Style the calendar filters by changing the month title color and customizing the navigation buttons’ text, border, and background colors.
- Calendar Header: Modify the text and background colors of the weekday names displayed in the calendar header.
- Calendar Body: Adjust the text and background colors of the dates shown in the main calendar grid.
Output
