Preventing a URL link via code widget

Hello Folks,
I am using some free code to show a clock with the current time from the web site: timeanddate.com.
Ideally, I’m trying not to have the user directed to the timanddate.com page if they click on the clock since all I’m after is the correct time in Los Angeles.
I’m using the code widget and that works great. It shows the clock.
Is there a way to turn off the link or overlay an invisible barrier so nothing happens if someone attempts to click on the clock?
I looked through the help files but couldn’t find anything that mentions this sort of thing.
Thanks for any and all help.

Can you post the code your using. We probably need a little more to go on.

Yes of course. Sorry about that. When I hit send, I thought I should include something.

Here’s the code I’m using to show the clock:

Herre’s a screenshot of the clock and html widget.

Trying to prevent any activation if someone clicks on the clock.
Thanks Malachiman!

Code from site:

Did you use this from their site?

https://www.timeanddate.com/clocks/free.html

If so then the code is an iFrame, and to be fair, free stuff often include links.

Yep, I get it. I would like to credit them but I don’t necessarily want to have folks leave the site.

I don’t know of a way you can stop it since its using iFrames, someone else may.

But you could just make your own. Here is a tutorial…

https://www.w3schools.com/graphics/canvas_clock.asp

I will give it a go.
Thank you for the guidance. Appreciate it.

Is image clock necessary? See here attached a script that shows the time in text, the scrip code is in the general code editor, and the call is in a brics code within a block, you can also use a class to change the color, typography and size etc. This could look better than your widget and without the need to take you to another page!

Tell me if it can help you

TimeDay.bloc (198.7 KB)

Thank you Nelo. I’m not 100% sure how to use this bloc. I am not a coder (hence the use of Blocs)
I opened the bloc but it’s in Spanish.
I translated the first part. “Aparecerá la Fecha y la Hora” = Date and time will appear.
The second part. “Dame LaFecha Hora” = Give me the date time.
Not sure where to go from there.
Should I be importing this bloc?
Thanks

First copy the scrip found in code editor

“Aparecerá la Fecha y la Hora” you can delete that line, it is only text where it tells you where it appears as an example, you will be there:

to change the style of the text, add a direct class to the brics code and add the style you like

to see that it works just preview it in the browser

tell me if it makes sense to you

@pkeenan. if you didn’t want to use a clock face you can do the following (similar to @nelo solution, but you can inject it anywhere on your site). And will display your local LA time you mentioned.

Put this code in the footer

<script>
var time = new Date();
document.getElementById("time").innerHTML =  time.toLocaleString('en-US', {timeZone: "America/Los_Angeles", hour: 'numeric', minute: 'numeric', hour12: true })
</script>

Assign any text with an ID called time

It will adopt any of the styling you have for the text.

Here is a video on how to use it

1 Like

Wow!
Thanks for taking the time to do that Malachiman. I’m going to try and see if I can get the clock face to work. Nelo’s suggestion is also in the works but the clockface is what I’m after.
Your video though is great reference for others looking for a time reference.
Thanks so much! Very helpful to be able to see the procedures.

1 Like

Give this a go @pkeenan

https://jsfiddle.net/7ngueqh8/128/

The author created a blog about it here…

https://medium.com/@js_tut/html-clock-in-real-time-53ca21909ac2

Its a nice clock face.

Thanks Malachiman.
I will give it the hairy eyeball.