Home General Discussion

Is it possible to nest a current time clock in the header

Brett_EtzelBrett_Etzel Customer IT Monkey ✭

I'd like to be able to get screenshots of various pages, and it would be nice if the current time was displayed in those screenshots.

Best Answer


  • Brett_EtzelBrett_Etzel Customer IT Monkey ✭

    Yes, that would work great, or anywhere in the header.


  • Brett_EtzelBrett_Etzel Customer IT Monkey ✭

    If possible, Date and Time would be even better.

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    @Brett_Etzel - Try this in your custom.js:

    $(document).ready(function() {

    var now = new Date();

    setTimeout(function() {

    $('<span id="currentTime" style="color: white;padding-left: 20px;"></span>').insertAfter('.navbar__search');

    $('#currentTime').text(kendo.toString(now, 'g'));

    }, 1200);


    var newNow = kendo.toString(new Date(), 'g');

    if ($('#currentTime').text() !== newNow) {



    }, 10000);


  • Brett_EtzelBrett_Etzel Customer IT Monkey ✭

    Hey Justin,

    Thank you that worked. Very slick! I've attached a screenshot of my header.

    You'll see the "logged in user" cell got bumped down. I've tried to figure-out how to not affect that cell, but not having any luck. Is there a way to add that clock with out bumping the"logged in user" cell down?

    Thanks very much for your help!


  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    @Brett_Etzel - Judging by your screenshot, you've already got some custom css stuff going on up there. It would be hard to say what needs to change to make it fit just right. If you use the Dev Tools in your browser to inspect the clock and/or the elements around the clock, you can tinker with padding or margins on the elements till everything fits like you want and then commit that change to the custom.css file.

Sign In or Register to comment.