Business Hours for Elements

Elements Store
1

Hi everyone,

I’d like to introduce Business Hours, a new component for Elements.

business-hours-thumbnail
business-hours-thumbnail1280×853 147 KB

Business Hours lets you display weekly opening hours in a clean and flexible way. It is designed for shops, restaurants, offices, studios, agencies, local businesses, service providers, and anyone who wants to show regular availability on an Elements website.

The component can also show an optional live status, so visitors can immediately see whether the business is currently:

Open now
Closing soon
Closed now

The live status is calculated based on a selected reference time zone and updates automatically in the browser.

Main Features

  • Weekly schedule for all seven days
  • Optional live status display
  • Configurable time zone
  • “Closing soon” threshold
  • Today highlight
  • List or card layout
  • Closed days
  • 24-hour days
  • Optional second time range per day
  • Overnight opening hours
  • Custom labels
  • Optional notice text
  • Theme-aware colors
  • Padding, gap, and radius controls
  • Editor preview options for status and current day

Notes

Business Hours is made for recurring weekly schedules. It does not currently support holiday rules or special exception dates.

Overnight hours are supported. For example, if an end time is earlier than the start time, the range continues into the next day and is shown with a “+1” indicator.

Product Page

https://www.barz-stacks.eu/elements/business-hours

Marketplace

https://store.elementsapp.io/components/business-hours

Demo Page

https://elements.barz-stacks.eu/business-hours/

Best regards,
Maik

business-hours-marketing
business-hours-marketing1280×853 172 KB

2

Another very useful component, you are giving Elements tools to be used in a professional setting.

Maik well done!

3

Thank you :star_struck:

4

Does the component work together with the ECMS?

In other words: if I add the opening hours as frontmatter data, will they be displayed accordingly?

5

Instant purchase! Thank you.

6

Hi,
not yet.
Can you tell me, how you would like to use it?

7

@barz-stacks Maik, you might want to adjust the text color in dark mode:

Screenshot 2026-06-26 at 22.20.43
Screenshot 2026-06-26 at 22.20.432346×1032 193 KB

8

You’re absolutely right, thank you. Fixed :slight_smile:

9

New version is now able to get data from CMS :slight_smile:

10

Hey Maik,

It’s great that you implemented the suggestion with the CMS data so quickly.

That was also the reason why I just bought the component.

I only had time to take a quick look at your component, but I immediately noticed something important.

Would it be possible to add breakpoint settings for your component under Layout and Style?

It would be useful to be able to choose a different number of card columns for different breakpoints. At the moment, this only seems to be possible with one global setting.

Other than that, thank you for the quick implementation of the CMS data. I’ll test it more thoroughly next week.

Thanks and best regards,

BTW: Is the live status also displayed when the data is provided through the CMS?

11

Thank you for feedback and ideas. Will Look at it the next days.
I think column selection will respect in which view (mobile/tablet/desktop) you set the count.

12

New great component with useful :clap:t2::clap:t2::clap:t2:

13

Done in Build (3)

Yes, as this is calculated from the other data