Digital clock for Service Portal

salomesimpsone
Giga Contributor

Hi All,

In Service Portal, we have "Cool clock" widget to display Analog Clock.

Did anyone tried on creating "Digital clock", according to different time zone??

Please help me to know....Thanks

1 ACCEPTED SOLUTION

rgm276
Mega Guru

so if all you want is a really simple digital clock, you can just add some code like the following to your clock widget, or create a clone of the clock widget


since the clock widget already creates a variable called c.date we can just use that to display our clock



HTML


<p id="time">


      {{c.date.hours()}}:{{c.date.minutes()}}:{{c.date.seconds()}}


  </p>


 


CSS


#time {


  font-family: fantasy;


  font-size:20px;


  color:silver;


  border:2px solid #2E9AFE;


  padding:10px;


  text-align: center;


  width: 200px;


}



Results in this output for the clock


find_real_file.png



you can make the clock look/feel prettier by adjusting the CSS to meet your needs


hope that helps


View solution in original post

18 REPLIES 18

Hi Binko,



I used Only One widget named "Cool Clock".



But I had Created more Instances to "Cool clock" Widget and added different time zone to each Instance.



Hope it helped you   ....


Hi ,



Can you Plese share the exact Info about how you have done this!!



Thanks


Ayush


Dear Salome,



Can you please let me know how did you create different clocks in service portal page?


Thank you.



Kind Regards,


Sreejith


Hi Sreejith,



You can use the Widget Instances and pass the information over there , there is a back end code which keeps the info of all the time zones so you   can pick the time zone from there and can pass it to the Widget Instance



The colors of the clock will automatically   work acc. to the time zone you are giving



Thanks


Ayush Sharma


Hi Ayush,



I'm still not sure how to get that back end code from widget instances which can help me in populating the required clocks for different timezones.



Can you please take me through your explanation?


Thank you.


Kind regards,


Sreejith Nair