Use Javascript SDK

TABLE OF CONTENTS

Article
Experience
- Overlay
- In-read

Article

The JavaScript SDK scans the page on load, converting <div class="playbuzz"> elements into items based on the element data-id attribute. In order to render dynamically inserted content, call Playbuzz.render() function.

Step 1: Include the JavaScript SDK on your page once, ideally under the <head> tag.

<head>
    // ...
    <script>
        (function (d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s);
            js.id = id;
            js.src = '//embed.playbuzz.com/sdk.js';
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'playbuzz-sdk'));
    </script>
    // ...  
</head>

Step 2: Place this HTML snippet wherever you want the item to appear on your page (replace the id with your real item id).

<body>
    // ...
    <div class="playbuzz" data-id="04c763d4-f0d3-455d-bad2-e70f0acfa002"></div>
    // ...
</body>

Experience

In order to go live with EX.CO units, all you need to do is a 1-time embed of the Placement Tag, following these simple steps:

Overlay

Copy the tag from the “Publish” tab of the item.
Paste the entire embed tag within the element of your site.

<head>
  // ...
  <div data-placement-id="XYZ" data-container="exco-placement"><script>(window.excoPlacements=window.excoPlacements||[]).push("XYZ");</script></div><script           src="https://smart-placements-sdk.ex.co/v1/XYZ/sdk.js"></script>
  // ...  
</head>

In-read

1. Copy the tag from the “Publish” tab of the item.

2. Paste the <script> tag inside the element of your page template.

<head>
    // ...
    <script src="https://smart-placements-sdk.ex.co/v1/XYZ/sdk.js"></script>
    // ...  
</head>

3. Paste the <div> tag within the template of the content, exactly where you want it to appear (in between paragraphs X & Y).

<body>
    // ...
    <div data-placement-id="XYZ" data-container="exco-placement"><script>(window.excoPlacements=window.excoPlacements||[]).push("XYZ");</script></div>
    // ...
</body>