Show/Hide Elements based on Time/Opening Hours

Design help Custom code
1

Hi all,

I am trying to find out how I can dynamically hide/show a div based on opening hours of a store.

One div contains the headline “Our store is open” and the other div contains the headline “Our store is closed”.

The store has the following opening hours:

Monday: 09:00-12:00, 14:00-18:00
Tuesday: 09:00-12:00, 14:00-18:00
Wednesday: 09:00-12:00, 14:00-18:00
Thursday: 09:00-12:00, 14:00-18:00
Friday: 09:00-12:00, 14:00-18:00
Saturday: 09:00-12:00
Sunday: Closed

The timezone is Germany (UTC+1).

Now I want that during the opening hours the div with the content “Our store is open” is displayed and when the store is closed the div with the content “Our store is closed” is displayed.

I have seen, that other people used the “Momentjs.com” library. The library will do all the work of converting the date & time, so i don’t have to deal with it different time zones.

Can anyone help me with this?

@JudoHacker i am tagging you to this topic, since I have seen that you have already dealt with a similar problem in the forum :slight_smile:

Really appreciate any comment on this as i search for a solution for hours now.

2

Search the forums since this has been asked and answered quite a few times.

3

Hi Jeff,

thanks for your answer.

Yes i have found some topics on that – my coding skills are unfortunately quite basic, so I’m not pretty sure how to handle this with a timetable/ opening hours.

4

Hi, this could be built better on Webflow CMS side if there was a support also for hours (even for minutes?) on the filtering conditions.

Screenshot 2022-11-30 at 10.52.29

Best, Tomas