Modular Usage

Add the following tag to the desired position within your page. You may assign any value to the id attribute.

If you want to apply the module to multiple elements, add multiple tags wherever needed.
However, make sure each tag has a unique id value.

Curation Module

<div id='curation_1'></div>
<div id='curation_2'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
<script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadCuration({ curationId: "{{Custom Curation ID}}", elementId: "curation_1" });
 // The custom curation ID can be found in the Saucelive Admin.(Go to Collection → Curation List and click on an individual curation to view its ID.)
 //elementId refers to the ID of the target element where the module will be rendered, such as curation_1.
</script>
// or
<script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadCuration({ curationId: "{{Custom Curation ID}}", elementId: "curation_1" });
   window.SauceWebLib.loadCuration({ curationId: "{{Custom Curation ID}}", elementId: "curation_2" });
</script>
//  You can set multiple curations by specifying different elementId values and render them as modules.

Calendar Module

<div id='calendar'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadCalendar({ elementId: "calendar" });
     // elementId refers to the ID of the target element where the module will be rendered, such as calendar.
</script>

Banner Module

<div id='topBanner'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadTopBanner({ elementId: "topBanner" });
     // elementId refers to the ID of the target element where the module will be rendered, such as topBanner.
</script>

Schedule Module (Live Preview)

<div id='schedule'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadSchedule({ 
     scheduleType: 'image' | 'feed' | 'list', 
     elementId: "schedule"
   });
     // elementId refers to the ID of the target element where the module will be rendered, such as schedule.
</script>

Latest Live Area Module (Live Replay)

<div id='broadcast'></div>
<script src="https://collection.sauceflex.com/static/js/SauceWebLib.js"></script>
   window.SauceWebLib.setInit({ partnerId:  'service1234' });
   window.SauceWebLib.loadBroadcast({
     displayType: "horizontal", //Type: 'horizontal', 'vertical'  
     elementId: "broadcast",
     title: "View Recent Broadcasts" // If you do not wish to display a title for this module, you may omit it.
   });
     // `elementId` is a required value and specifies the target element ID where the module will be rendered, such as `schedule`.
     // `displayType` allows you to set the display format to either horizontal or vertical.
     // `displayType` is optional and is only supported in modular mode. The default value is `'horizontal'`.
     // `title` allows you to set the title for the live broadcast section.
     // `title` is optional and is only supported in modular mode.
</script>