31st Oct '24
/
0 comments

Event Date and Time in Visitor’s Timezone

In the BricksLabs Facebook group a user asks:

Wondering if you have a way of displaying events in the users time zone in Bricks? The event would be a Metabox CPT.

This Pro tutorial provides the steps for showing the value of a Meta Box datetime type of custom field in visitor's timezone.

For example, let's say an event's date and time has been set to 2024-10-31 10:30 with the WordPress site's timezone set to Melbourne, Australia. When viewed from Melbourne, Australia, that event's single page shows October 31, 2024 at 10:30 AM. When a visitor from NY, USA views the same page they would see October 31, 2024 at 7:30 PM.

Step 1

At Settings → General, set your business/site timezone city.

Step 2

Create your CPT and a corresponding field group with Meta Box.

Do NOT set the value to be saved as timestamp.

Create/edit your CPT posts and populate the field.

Step 3

Add the following in child theme's functions.php (w/o the opening PHP tag) or a code snippets plugin:

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 610 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Responsive iframes in Bricks

Responsive iframes in Bricks

This Pro tutorial provides the steps to add responsive iFrames in Bricks. Step 1 Edit your Page/Template with Bricks. Add a Code element having this…
Categories:
Tags:
Pro
Post Title at a Different Location on Image Hover

Post Title at a Different Location on Image Hover

This Pro tutorial provides the steps to update the text of a sticky div with the title of the post that is hovered on the…
Categories:
How to change the text of an element based on breakpoints without creating duplicated content

How to change the text of an element based on breakpoints without creating duplicated content

In this tutorial, we'll learn how to dynamically change the text of a basic text element based on the viewport width in Bricks. Introduction Sometimes…
Categories:
Pro
Ken Burns Background Slideshow in Bricks

Ken Burns Background Slideshow in Bricks

Setting up a hero section, having images that pan and move as a background slideshow with content on top.
Categories:
Tags:
Pro
Limit Bricks Users Query to Current Post’s User-type ACF Field Value

Limit Bricks Users Query to Current Post’s User-type ACF Field Value

Consider this scenario with ACF: "John Briley" user: "Gandhi" movie: The requirement is to show John Briley as the author when Gandhi movie item is…
Categories:
Posts Ordered By a Date Field in Bricks

Posts Ordered By a Date Field in Bricks

The Query interface available in the Posts element and the Query Loop feature of Bricks enables us to order items of any post type by…
Categories:
Tags:
How to integrate fullPage.js with Bricks

How to integrate fullPage.js with Bricks

This tutorial provides the JavaScript and CSS codes that can be pasted in order to integrate the JS library fullPage.js inside Bricks Builder.
Categories: