Classes and workshops
Show how long each session lasts.
Content / widget · Elementor module
ACF Event Duration Widget Plugin for Elementor
Show how long an event lasts, such as 1 hour 30 minutes, from start and end times saved in ACF Time Picker fields, with the times and a next-day note.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / ACF event durationProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Try it
These are the actual published widgets reading sample ACF times saved on this page.
02 / Inside WordPress
ACF event duration controls in Elementor
Duration picks the start and end Time Picker fields and sets how the length is written, whether and where the times show and in which format, the next-day note, text before and after, text when it cannot be worked out, the HTML tag and an icon. The Style tab covers the text and surface, the length weight, times and note colours, and the icon.
03 / Website use cases
Where to use acf event duration
Class and event pages usually store a start and an end time in ACF, and visitors want to know how long it lasts without doing the sum, especially when it runs past midnight. ACF event duration works out the length from the two saved times and writes it the way you choose, such as 1 hour 30 minutes, 1 h 30 min, 90 minutes or 1.5 hours, with the start and end times and a note when it ends the next day.
Shifts and rotas
Show the length of shifts that run past midnight.
Tours and talks
Tell visitors how much time to set aside.
04 / Installation and setup
How to show an event duration from ACF times in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install ACF and Complementor, connect your license and enable ACF event duration in the Complementor library.
Add start and end Time Picker fields to your posts and fill them in.
Add the widget to the post or its template and choose the two fields.
Choose how the length is written and whether the times show.
Add text such as "Duration:" and style the result.
05 / Content and style controls
Customize acf event duration in Elementor
Configure the settings available for this module to suit the page you are building.
The length in words, short form, minutes, hours or as a clock.
Correct singular and plural wording, such as 1 hour or 2 hours.
The start and end times before, after or below the length.
A note when the event ends the next day.
An ISO 8601 duration for search engines and assistive technology.
Text before and after, text when it cannot be worked out, and an icon.
06 / Choose the right approach
ACF event duration and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
ACF daily time window
Shows open now from ACF times.
ACF appointment summary
Shows a saved appointment with calendar links.
07 / Requirements and compatibility
ACF event duration compatibility with Elementor
- Requires Elementor and ACF with two Time Picker fields.
- Times of day only, up to 24 hours; dates and clock changes are not considered.
- Reads the times saved on the published post being viewed.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot acf event duration
Check these settings if the published page behaves differently from the editor.
Why does nothing show?
One of the times is missing, or the start and end are the same. Add text for that case to show a message instead.
Why is the length so long?
The end time is before the start, which is read as running past midnight. Check the times on the post.
Does it account for clock changes?
No. It uses times of day only, so a night when the clocks change is not adjusted.
ACF event duration plugin questions
Does it need Elementor Pro or ACF Pro?
No. It works with the free versions of Elementor and ACF.
Can events run past midnight?
Yes. An end before the start runs into the next day, with an optional note.
Can I show 90 minutes instead of 1 hour 30 minutes?
Yes. Choose minutes, hours, the short form or a clock format.
Can it show the start and end times too?
Yes. Show them before, after or below the length, in the site’s time format or a 12 or 24-hour clock.
Is the length machine-readable?
Yes. It is marked up as an ISO 8601 duration, such as PT1H30M.
10 / Annual All Access subscription
Get acf event duration with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.