Upcoming Events Block

The Upcoming Events Template defines the HTML structure and content displayed within the Gutenberg editor for the Upcoming Events Block. It is responsible for displaying a heading and a list of upcoming events, each with a logo, title, date, location, an optional link, and a description.

Content Editor Fields

Heading

  • Description: The main heading text displayed above the events list.
  • Usage: Use this field to provide a clear title for the section.
  • Optional: If no heading is provided, this element will not be displayed.

Events

  • Description: A list of upcoming events to be displayed. Each event can have a logo, a title, a date, a location, an optional link, and a description.
  • Usage: Use this field to add and manage the events.
  • Mandatory: This field is mandatory. If no events are added, the block will not display anything.

Example Usage:

Steps:

  1. Add the block: Insert the Upcoming Events Block into your page or post.
  2. Fill the fields:
    • In the block settings, fill the "Heading" field.
    • In the block settings, add the events in the "Events" field. For each event, you can add a logo, a title, a date, a location, an optional link, and a description.
  3. Save the Block: Your Upcoming Events block is now ready for display!

Result:

When properly configured, the Upcoming Events Block will render a section with a heading and a list of upcoming events. Each event will display its logo, title, date, location, an optional link, and a description. The first event will be displayed, and the others will be displayed in a navigation.

upcoming-events with image

Preview in the editor (body):

upcoming-events in body

Customization:

You can customize the Upcoming Events Block display in the following ways:

  • Content Customization: Change the heading text and the events details directly within the block settings.

Benefits:

  • Clear Structure: The template provides a simple and organized HTML structure.
  • Dynamic Content: The template allows for dynamic content to be inserted.
  • Easy to Use: It is simple to configure for the end user.
  • Multiple events: You can add multiple events.
  • Navigation: The block has a navigation.