Copy discount code:

crocoturns6
croco b-day main image left part croco b-day main image center part croco b-day main image right part
Expires In
croco b-day left image
croco b-day right image

Help Center

How to Display Recurring Events in the Dynamic Calendar

How to Display Recurring Events in the Dynamic Calendar

The tutorial explains how to display repeated events via the Calendar widget of the JetEngine plugin with the needed frequency.

Before you start, check the tutorial requirements:

  • Elementor (Free version) or Block editor (Gutenberg)

  • JetEngine plugin installed and activated with the Calendar Module enabled

  • JetThemeCore plugin installed and activated

Adding a Meta Box With the Advanced Date Field to a CPT

Create a CPT (here, Films) with the necessary fields.

Navigate to the JetEngine > Meta Boxes tab and create a new meta box. Unroll the Visibility Conditions block and select the required CPT from the Enable For Post Types drop-down menu. Unroll the Meta fields block and select the “Advanced Date” meta field option in the Field type drop-down menu for displaying the recurring events.

Save the meta box.

Open the CPT posts, scroll them down, and modify the following settings of the Advanced Date field of the meta box (here, Dates):

  • Start date calendar field to select a date when the event starts;
  • enable the Has end date toggle to select the end date for multi-day events;
  • enable the Is recurring toggle to turn on the Repeat drop-down menu with the “Daily,” “Weekly,” “Monthly,” and “Yearly” options. Every option, if selected, turns on the appropriate fields to specify the displaying conditions. For example, the “Weekly” option turns on the buttons to select days of the week for displaying recurring events;
  • End drop-down menu to select the “After” or “On date” options and specify the number of iterations or the end date, respectively.

Fill in the CPT posts and publish them.

Things to know

The recurrent event must be limited by the number of iterations or end date.

Creating a Listing Item

Navigate to the JetEngine > Listings tab and create a listing item (here, Recurring_Events) for the developed CPT (Films) with the necessary dynamic fields to display.

To display the recurring dates, add the Dynamic Field widget and use the following settings:

  • select the “Meta Data” option in the Source drop-down menu;
  • select the previously created Advanced Date type meta field (“Dates”) in the “Meta Field” drop-down menu.

To display the dates correctly, scroll down the Calendar settings and enable the Filter field output toggle. Select the “Format date” option from the Callback drop-down menu.

advanced date field added

Source: I Am Groot Disney+ Press Kit

Press the “Update” button.

Displaying the Recurring Events in the Calendar Widget

Navigate to the Crocoblock > Theme Parts tab and create a single page to display the CPT posts (Films).

Find the Calendar widget and drag-n-drop it to the page. Set the following settings for the Calendar widget:

  • select the created listing item (here, Recurring_Events) from the Listing drop-down menu;
  • select the “Date from custom field” option from the Group post by drop-down menu;
  • fill in the Meta field name field with the Advanced Date field name (dates);
  • activate the Allow multi-day events toggle for the event with previously activated Has end date toggle; 
  • the End date field name field does not need to be completed because the data will be automatically obtained from the source field.

Style the calendar.

calendar settings

Source: Disney+ Press Kits

The Calendar widget now displays recurring events on the front end.

calendar front end

Source: Disney+ Press Kits

That is all about using the Advanced Data field and the Calendar widget of the JetEngine plugin to display the repeated events with the needed frequency.

Was this article helpful?
YesNo

Need help?

Ask Facebook community

Get answers from 22K Crocoblock Community experts from all over the world.

Start a live chat

Ask question to support agent and share its details via chat messages.