Please note: This assumes that you are technical, and know some html, css and javascript.
This is a package for StealthSeminar users for showing webinar date and time, countdown and calendar .
1. Add this to the header section of your page
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/oikantik/webinar-helper/viewer-information.css">
2. This package is dependent on DayJS heavily. These are the dependencies, Make sure to put these before the end of the body section:
<script src="https://unpkg.com/dayjs@1.10.4/dayjs.min.js"></script> <script src="https://unpkg.com/dayjs@1.10.4/plugin/utc.js"></script> <script src="https://unpkg.com/dayjs@1.10.4/plugin/timezone.js"></script> <script src="https://unpkg.com/dayjs@1.10.4/plugin/advancedFormat.js"></script>
3. And then add this package. make sure to change the XXXXX with your own shortID
<script src="https://cdn.jsdelivr.net/gh/oikantik/webinar-helper/viewer-information.js"></script>
<script>
webinar.shortId = "XXXXX"; // replace this with your shortID webinar.loadContainers();
webinar.request([calendarNode, textNode, countdownNode], errorNode);
</script>
4. Now you can use these
<!-- for showing text date time -->
<div class="ss-datetime"></div>
<!-- for showing calendar date time -->
<div class="ss-calendar"></div>
<!-- for showing countdown -->
<div class="ss-countdown"></div>
If you want you can use all of them.
This is a preview of how it looks like, you can change anything regarding the color using css.
โ