Loading Times

Quick loading times are crucial to creating a positive user experience for your readers. Our regular embed code, which you can copy from any public EX.CO item, was designed for simplicity. All you need to do is copy the code, and then paste it on your page.

A lot of effort was put into optimizing the loading process of our items, so that they will load quickly and won’t become a bottleneck for your own assets. Below details how you can achieve faster loading times on your EX.CO content.

Embedding in the <head> section Although copied as one, the embed code is actually comprised of two parts: the script, in charge of rendering the item, and the div, which serves as the placeholder for the item. The div also provides some relevant information necessary to display the item properly. In the example below, the <script> tag is marked in blue:

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

<div class=“playbuzz” data-id=“04c763d4-f0d3-455d-bad2-e70f0acfa002″></div>

To further improve loading times, we recommend that the <script> section of the EX.CO embed code be placed inside the <head> section of your page. By doing so, you are ensuring that the code in charge of rendering the EX.CO item will be present and ready even before the page begins to render.

The <script> tag can be placed inside your page’s head section. The <div> still serves as a placeholder, and should be placed wherever you want the item to be rendered. The following is an example of a simple webpage, with the <script> placed in the <head> section:

        <title>Page Title</title>
        <script>(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(d.getElementById(id))return;js=d.createElement(s);;js.src=‘//’;fjs.parentNode.insertBefore(js,fjs);}(document,‘script’,‘playbuzz-sdk’));</script>
            <h1>EX.CO embed example</h1>
            <div class=”pb_feed” data-item=”0777dfcb-48fa-4c71-a5f7-43844ee8cf0b” data-embed-by=”1ac33379-1205-4a19-a95d-f3535e24c97f” data-version=”2″ ></div>

Note that the <script> (marked in blue) was placed in the page’s <head> section, while the <div> is serving as the placeholder for where we want the item to appear.

Please note:

  • You can include the EX.CO <script> tag in all of your pages, even if no EX.CO item is embedded there. The script is simply looking for the EX.CO placeholder to start rendering.
  • If you have the EX.CO script in the page’s head, and then paste the regular embed code (including the script) and no harm will be done. Your browser is smart enough to know that the script was already loaded, and the EX.CO code also makes sure that it doesn’t run twice.

Usage in WebView

To display videos correctly (without forcing into full screen mode) in native apps with a WebView (or hybrid apps with HTML, CSS, JS) setting of alowsInlineMediaPlayback is required.

UIWebView.allowsInlineMediaPlayback = true

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select atleast one of the reasons

Feedback sent

We appreciate your effort and will try to fix the article