Niemand wil 24/7 werken neem ik aan. En soms wil je bepaalde activiteiten op je website alleen activeren als je er zelf bent, zodat je zelf snel kan inspringen. In mijn use-case ging het om openingstijden voor een whatsapp widget, maar andere voorbeelden zijn:
- Live chat support
- Beschikbaarheid (telefonisch bijv.) tonen op je website
- Promoties tijdens speciale uren
- Live webinars of events aanmeldingen
- Bezorgmeldingen op basis van tijd
Er zijn dus tal van interessante scenario’s waarin dit interessant kan zijn! Ik neem je graag mee hoe je dit voor elkaar krijgt via Tag Manager óf via WordPress. Disclaimer: je hebt wel wat codeer-kennis nodig.
Stap 1: je tijden bepalen
Voordat we een oplossing gaan implementeren is het belangrijk je tijden vast te leggen. Dit heeft te maken welke code je nodig gaat hebben. Denk aan de volgende zaken:
- Wil je in jouw tijdzone werken óf in die van de gebruiker? (in geval van tijdsgebonden promoties kan de tijdzone van gebruiker beter werken).
- Leg je tijden vast dat je “open” wilt zijn. Wil je dit niet in de code doen? Dan kun je in Tag Manager een Loopup Table maken (0 = zondag t/m 6 = zaterdag) en de corresponderende tijden. In WordPress kun je een ACF field maken, indien je niet de code wilt aanpassen later.
Stap 2: je code als variabele aanmaken
Nu, we willen dus gaan checken of het huidige moment matcht met je openingstijden. Dit doen we via een GTM variabele, de Custom JS Variable. Je maakt deze aan en geeft deze een naam , bijvoorbeeld OpeningHoursCheck. De code zoals in de afbeelding zorgt dat de openingstijden getoetst worden en geeft “true” of “false” als uitslag. In dit geval maak ik gebruik van de timezone “Amsterdam”.
Tip: maak je gebruik van een lookup table, dan ziet de code er anders uit!
Stap 3: Tags & Triggers instellen
Wil je gebruik maken van de openingstijden check? Dan kun je een of meerdere triggers aanmaken. Denk aan: Pageview, Event of Click. Je stelt hierbij een voorwaarde op: “OpeningHoursCheck” is gelijk aan “true” (of “false”), ligt aan je toepassing natuurlijk.
Deze kun je toevoegen aan een Tag. Ik gebruik vaak custom HTML of JS, bijvoorbeeld om een element te verbergen, tonen of te wijzigen. Ook kun je bijv. een popup hiermee wel of niet afvuren.
That’s it!
Bonus: openingstijden via WordPress (php).
Wil je dit liever niet via Tag Manager doen, maar via WordPress? Ook dat kan. Je vult dan een php code in je website zetten (in de functions.php van je child-theme).
Vervolgens kun je dan in je plugin of widget, of via een JS functie checken of er aan de openingstijden wordt voldaan en de gewenste actie daarop aanpassen.
function display_opening_status() {
if (is_business_open()) {
echo '<p>We zijn open!</p>';
} else {
echo '<p>We zijn gesloten!</p>';
}
}
// Voeg deze functie toe aan een shortcode of widget
add_shortcode('opening_status', 'display_opening_status');Afronding tijden gebruiken op je website
Wil jij dit ook? Of zelf aan de slag met codes voor de openingstijden? Neem dan gewoon even contact op, dan stuur ik je gewenste codes op of een GTM JSON file.
Cheers,
Etienne van de Boel.
