Hide Phone Number Outside Business Hours


#1

Hi everyone,

First of all thanks for reading. I need some help with one of my landing pages. My client currently offers Mortgage Advice and would only like to display their phone number on the website during working hours. I believe you can do this with Javascript, but I can’t find any examples or guides of this being done through Unbounce.

Can anyone help me with this?

Thanks in advance
Mark


#2

Hi @Adtrak,

You can’t do it just with JavaScript. You need a backend server that you’'ll ping to get the correct time.

Therefore, the answer you are looking for really depends on your setup.

Best,
Hristian

EDIT: Or you can do what @Ander has suggested below but there is the chance that the browser time won’t be correct.

Also the logic for holidays and other off days can get complicated.


#3

Hi @Adtrak,

We use the user’s computer date to do that thanks the JavaScript Date Reference

We set a schudule in our js function (i.e. Monday to Friday from 9:00 to 21:00) and comparing it with the user’s date we show/hide the phone number.

How to built it:

First of all we generate a new Date()
–> var d = new Date();

Then we get the user’s day
–> d.getDay() (if all your clients are in the same time zone you can use this)
–> d.getUTCDay() (if you have clients in diferent time zones use this function and compare all dates with UTC time)
If the client is out of the Business-days we hide the phone number.

If your client is in a Business-day then we get the user’s hour
–> d.getHours()
–> d.getUTCHours()
If the client is out of the Business-hours we hide the phone number.

In order to avoid a phone numbers’ flicker we set this Javascript in the Head section.

By doing this we can show our phone number only when the client is in our Business Hours.

I hope this helps. :slight_smile: