Event List Widget

Estimated reading: 5 minutes 9 views

Overview

The Zozo Event List widget displays events in a clean, vertical list layout using Elementor. It is ideal for websites that want to present detailed event information in an easy-to-read format.

The widget includes powerful query options, allowing you to filter events by organizer, location, category, tag, label, date range, or individual events. It also supports multiple navigation methods, including Load More Button, Pagination, and AJAX loading, making it suitable for event directories, schedules, conference websites, and community portals.


General Settings

Overview

The General section contains basic widget options that help customize the widget container.


Extra Class

Add one or more custom CSS classes to the widget.

This allows you to apply your own CSS styling without modifying the plugin files.

Example

conference-list
featured-events
homepage-events

Multiple classes can be separated with spaces.


Query Settings

Overview

The Query section controls which events are displayed inside the list.

You can filter events using multiple criteria to create highly customized event listings.


Events Per Page

Specify how many events should be displayed in the list.

Example:

10

Displaying fewer events improves page loading speed, while larger values reduce the need for pagination.


Excerpt Length

Specify how many words should be displayed in each event excerpt.

Example:

15

Short excerpts keep the list compact, while longer excerpts provide visitors with more event information.


Start Date

Display only events that occur on or after the selected date.

Useful for displaying:

  • Upcoming Events
  • Monthly Events
  • Seasonal Events
  • Future Conferences

Leave this field empty to display events from any date.


End Date

Display only events that occur before the selected end date.

Useful for creating event listings for:

  • Current Month
  • Current Year
  • Holiday Events
  • Special Campaigns

Organizer Filter

Display events created by selected organizers.

You can select one or multiple organizers.

Examples:

  • John Smith
  • Event Team
  • Marketing Department

Exclude Organizer

Exclude events created by selected organizers.

Useful when hiding internal or archived organizers from public listings.


Location Filter

Display events from one or more locations.

Examples:

  • New York
  • London
  • Virtual Event
  • Main Auditorium

Exclude Location

Hide events from selected locations.

Useful for creating region-specific event pages.


Category Filter

Display only events assigned to selected categories.

Examples:

  • Conference
  • Workshop
  • Webinar
  • Meetup

Multiple categories can be selected simultaneously.


Exclude Categories

Hide events belonging to selected categories.

Useful for displaying only specific types of events.


Tag Filter

Display events assigned to selected tags.

Examples:

  • Business
  • Education
  • Technology
  • Marketing

Exclude Tags

Hide events using selected tags.

This helps create more focused event listings.


Label Filter

Display events assigned to selected labels.

Examples:

  • Featured
  • Popular
  • Free
  • Premium

Exclude Labels

Exclude events that contain selected labels.

Useful for hiding promotional or archived events.


Include Events

Display only selected individual events.

This option allows you to create curated event lists for:

  • Homepage Sections
  • Featured Events
  • Landing Pages
  • Special Campaigns

Exclude Events

Hide selected events from the list.

Useful when temporarily removing events without deleting them.


Order By

Choose how events should be sorted.

Common options include:

  • Event Date
  • Event ID
  • Title
  • Publish Date
  • Menu Order
  • Random

Sorting helps organize events according to your website’s requirements.


Show Past Events

Choose whether completed events should appear in the list.

Options

  • Yes
  • No

Default: No

Enable this option to display historical events.


Order

Choose the sorting direction.

Available Options

  • Ascending
  • Descending

Ascending

Displays older events first.

Descending

Displays newest or latest events first.


Load More Options

Overview

Choose how visitors can browse additional events after the initial list has loaded.

Supported options include:

  • None
  • Load More Button
  • Infinite Scroll
  • Pagination

Load More Type

Select the preferred loading method.

None

Only the configured number of events will be displayed.

No additional events are loaded.


Load More Button

Displays a Load More button beneath the event list.

Visitors can click the button to load more events without refreshing the page.


Infinite Scroll

Automatically loads additional events as visitors scroll down the page.

Ideal for large event directories where continuous browsing is preferred.


Pagination

Displays numbered page navigation.

Example:

Previous   1   2   3   Next

Pagination provides a structured navigation experience and is recommended for archive pages.


Previous Icon

Choose the icon displayed for the Previous pagination button.

Examples include:

  • Left Arrow
  • Chevron Left
  • Angle Left

This option is available only when Pagination is selected.


Next Icon

Choose the icon displayed for the Next pagination button.

Examples include:

  • Right Arrow
  • Chevron Right
  • Angle Right

This option is available only when Pagination is selected.


Notes

  • The Event List widget displays only Event Builder events.
  • Multiple query filters can be combined to create advanced event listings.
  • Empty filters are ignored automatically.
  • AJAX is used for Load More and Pagination to provide a smooth browsing experience.
  • Pagination icons appear only when the Pagination loading type is selected.
  • The widget is fully responsive and adapts automatically to desktop, tablet, and mobile devices.
  • Additional typography, spacing, colors, and layout customization options are available under the Style tab in Elementor.

Leave a Reply

Your email address will not be published. Required fields are marked *

Share this Doc

Event List Widget

Or copy link

CONTENTS