All Collections
API
Use StealthSeminar API to display calendar, timer and dates on your site
Use StealthSeminar API to display calendar, timer and dates on your site
Corey avatar
Written by Corey
Updated over a week ago

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.


Did this answer your question?