oEmbed
The endpoint returns an item, specified by an item URL or item ID, in an oEmbed-compatible format. The item URL may be of two forms - //www.playbuzz.com/item/<item-id>
and //www.playbuzz.com/<user-name>/<item-title>
. The API enables customization of the embedded item by setting parameters to the oEmbed endpoint.
Endpoint URL
//oembed.playbuzz.com/item?id=<your_item_id>
or //oembed.playbuzz.com/item?url=<your_item_url>
Parameters
Parameter | Description | Default |
---|---|---|
id | the id of the item to embed | - |
url | the url of the item to embed | - |
omit-script | do not include script in the html returned | false |
show-share | show share bar above and below the item | true |
show-info | show item cover, title and description | true |
- Either ID or URL is required.
Example
All following three requests return the following response.
Request
//oembed.playbuzz.com/item?id=8fb2343f-fa5d-48d4-8723-f8b5d51cc1a9
//oembed.playbuzz.com/item?url=www.playbuzz.com/item/8fb2343f-fa5d-48d4-8723-f8b5d51cc1a9
//oembed.playbuzz.com/item?url=http://www.playbuzz.com/paolagarcia10/remembering-september-11th-flash-back-to-images-we-will-never-forget
Response
{
author_name: "Paola Garcia",
author_url: "//www.playbuzz.com/paolagarcia10",
html: "<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><div class="playbuzz" data-id="8fb2343f-fa5d-48d4-8723-f8b5d51cc1a9"></div>",
provider_name: "Playbuzz",
provider_url: "//www.playbuzz.com",
thumbnail_url: "//cdn.playbuzz.com/cdn/8fb2343f-fa5d-48d4-8723-f8b5d51cc1a9/6868d660-9f42-49c7-bedb-ea6416a56860.jpg",
thumbnail_height: 83,
thumbnail_width: 126,
title: "Remembering September 11th: Flash Back To Images We Will Never Forget",
type: "rich",
url: "//www.playbuzz.com/item/8fb2343f-fa5d-48d4-8723-f8b5d51cc1a9",
version: "1.0"
}
Shopify
Please see the following steps to add the EX.CO embed placement on your whole shopify website.
Overlay Unit
- Step 1: From your Shopify admin, go to Online Store > Themes.
- Step 2:Click Actions > Edit code.
- The code editor shows a directory of theme files on the left, and a space to view and edit the files on the right.
- When you click a file in the directory on the left, it opens in the code editor.
- Step 3: Click the theme.liquid file in the Layout folder.
- Step 4: Click on Copy Code on the EX.CO platform.
- Step 5: Paste the embed below the <head> tag
- Step 6: Click Save
In-read Unit
Step 1: From your Shopify admin, go to Online Store > Themes.
- Step 2:Click Actions > Edit code.
- The code editor shows a directory of theme files on the left, and a space to view and edit the files on the right.
- When you click a file in the directory on the left, it opens in the code editor.
- Step 3: Click on the file you want to embed the EX.CO inread unit in the Layout folder.
- Step 4: Click on Copy Code on the EX.CO platform.
- Step 5: Paste the embed below the element you want the EX.CO unit to appear. For example - In this case the inread unit was inserted in the contact form page only.
- Step 6: Click Save
Facebook Instant Articles
EX.CO fully supports item embeds in Instant Articles. EX.CO formats and features are entirely responsive for Instant Articles and have a much quicker loading time on mobile devices through the Facebook app compared to articles loading directly from websites. This fluid and high-quality experience is optimized for fast mobile performance and rich storytelling capabilities.
Embedding a EX.CO item can be done in two ways: either through the Facebook publishing tools for your domain or by adding the embed code to your Instant Article RSS feed. To create a Facebook Instant Article that incorporates a EX.CO format, follow the steps below:
- Step 1: If you are embedding through publishing tools, the first step is to open the Instant Article.
- Step 2: Create a new Instant Article or edit an existing one and insert the following code in the desired place within the article.
<figure class="op-interactive">
<iframe class="no-margin">
<!-- place holder for the item embed code -->
</iframe>
</figure>
- Step 3: Select the embed code for the item you would like to embed, and replace the above placeholder. Your code should look like this:
<figure class="op-interactive"> <iframe class="no-margin"> <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> <div class=“playbuzz” data-id=“04c763d4-f0d3-455d-bad2-e70f0acfa002"></div> </iframe> </figure>
- In order to provide the best possible experience in Instant Articles, and also to receive the most accurate statistics for item interaction, we recommend that the two bolded attributes found in the above code be added.
The data-origin attribute demonstrates that the item exists inside an Instant Article, and allows any necessary adjustments to be made. The data-canonical attribute demonstrates where the item was originally embedded. Without this attribute, some features (like sharing) may not function properly. It is also important to specify the canonical URL in the head section of every Instant Article.
EX.CO items can also be embedded in an Instant Article through an RSS feed!
- Step 1: When embedding a EX.CO item in your RSS feed you will need to wrap the standard embed code with the following
<figure class="op-interactive"> <iframe class="no-margin"> <!-- place holder for the item embed code --> </iframe> </figure>
- Step 2: The embed code may be taken from the item you want to embed on EX.CO.com. Select the item you want to embed and click the “embed” button.
- Step 3: 3 Select the preferred embed settings and copy the code.
Google AMP
- Step 1: Add amp-playbuzz components in your amp page head tag. See an Example.
- Step 2: Place the following HTML snippet wherever you want the item to appear on your page (replace the id with your real player id).
<amp-playbuzz
data-item="ITEM_ID"
height="500">
</amp-playbuzz>
Examples EX.CO Item by plan URL (without info, share-buttons, comments)
<amp-playbuzz
src="https://www.playbuzz.com/HistoryUK/10-classic-christmas-movies"
height="500">
</amp-playbuzz>
EX.CO Item by item-id (can be found in the item's embed code)
<amp-playbuzz
data-item="a6aa5a14-8888-4618-b2e3-fe6a30d8c51b"
height="500">
</amp-playbuzz>
With optional parameters (info and share-buttons):
<amp-playbuzz
src="https://www.playbuzz.com/HistoryUK/10-classic-christmas-movies"
height="500"
data-item-info="true"
data-share-buttons="true">
</amp-playbuzz>
See amp-playbuzz for more detailed information.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article