Display Events with Events Block in Gutenberg Editor

The Events Shortcodes plugin allows you to display events anywhere using shortcodes. But if you prefer a dedicated block with drag-and-drop customization, you can use the Events Block inside the Gutenberg editor. This makes it much easier to add, preview, and adjust event layouts

Important: To use the Events Block, you must install and activate the Events Block plugin along with the Events Shortcode plugin. 

Add Events Block in Gutenberg

Follow the steps below to add the events block: 

• Open any page or post in the Gutenberg editor.
• Click on the “+” Add Block button.

• Search for “Events” and select the Events Block.
• The Events Block will be added to your page.

 Customize Display Settings

After adding the events block to your page, you can fully customize the display of events using the following settings:

• Layout: Choose the layout for your events from Default or Minimal.
• Select Category: Filter events by category. Select All to show every event, or choose specific categories to display only targeted events.
• Date Formats: Easily customize how dates are displayed by choosing from various formats. 
• Limit the Events: Set the maximum number of events to display.
• Events Order: Choose the sorting order of events from ASC (oldest to newest) or DESC (newest to oldest).
• Hide Venue: Decide whether venue details should be visible. Select Yes to hide the venue or No to display it.
• Display Description: Choose whether to show event descriptions.
• Event Description: If descriptions are enabled, select whether to show a short summary or the full text according to your preference.
• Month Header: Toggle the header that displays month names in list or grid views. You can show or hide this header as needed.
• Date Range: Easily show events between specific dates. This means you can choose to showcase events between any dates, whether a particular week, month, or custom time period.
• Event Type (Future/Past): Filter events by time. Choose to display all events, only upcoming (future) events, or only past events.
• No Event Text: Customize the message shown when no events are available. For example: “There are no upcoming events at the moment.”