What is oEmbed?

oEmbed is an API to get information about embedded content on a URL. Using oEmbed we can programmatically get embed codes for videos if you have the video URLs.This simple API allows a website to display embedded content.

oEmbed Endpoint

Our oEmbed endpoint is: http://api.getshow.io/oembed

Our oEmbed endpoint recognizes two URL formats:

Type Example URL
iframe embed code URLs https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz
Share media URLs https://app.getshow.io/share/Mcm3a3YBgj8xrtrWURYz

Regex

Please use this regex to automatically detect Show URLs and run them against our endpoint, we recommend using the below regular expression:

/https?:\/\/(.+)?(getshow.io)\/(share|iframe)\/.*/

Alternate matching:

http(s)://*.getshow.io/iframe/* Valid

http(s)://*.getshow.io/share/* Valid

http(s)://*.getshow.io/* Valid

http(s)://*.com/share/* Invalid

*://app.getshow.io/share/* Invalid

Use a more general regular expression so your system is flexible for any future URLs updates as we add.

/https?:\/\/(^.)+\.(getshow\.io)\/.*/

Example with Code

Embed code and additional information for a video :

https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz

in JSON format:

curl "https://api.getshow.io/oembed?url=https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz"

This returns:

  {
                          	"version":"1.0",
                          	"type":"video",
                          	"provider_name":"Show by Animaker",
                          	"provider_url":"https://www.getshow.io/",
                          	"width":425,
                          	"height":344,
                          	"thumbnail_width":480,
                          	"thumbnail_height":360,
                            "thumbnail_url":"https://fast.getshow.io/p/u/mysowzpctp/thumbs/31555uKxUSjHQngPtwVbf.0000001.jpg",
                          	"title":"Animaker 2.0",
                          	"author_name":"Show by Animaker",
                          	"author_url":"https://www.getshow.io/",
                            "html":"<iframe width=\"800\" height=\"450\"
                            src=\"https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz\"
                            frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media;
                            gyroscope; picture-in-picture\" allowfullscreen></iframe>
                          }

If you’re looking for XML instead of JSON, use:

https://api.getshow.io/oembed.xml

Example:

https://api.getshow.io/oembed.xml?url=https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz

Returns:


                          <version>1.0</version>
                          <type>video</type>
                          <provider_name>Show by Animaker</provider_name>
                          <provider_url>https://www.getshow.io </provider_url>
                          <width>425</width>
                          <height>344</height>
                          <thumbnail_width>480</thumbnail_width>
                          <thumbnail_height>360</thumbnail_height>
                          <thumbnail_url>https://fast.getshow.io/p/u/mysowzpctp/thumbs/31555uKxUSjHQngPtwVbf.0000001.jpg </thumbnail_url>
                          <title>Animaker 2.0</title>
                          <author_name>Show by Animaker</author_name>
                          <author_url>https://www.getshow.io/ </author_url>
                          <html><iframe width="800" height="450"
                          src="https://app.getshow.io/iframe/?media=Mcm3a3YBgj8xrtrWURYz"
                          frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope;
                          picture-in-picture" allowfullscreen></iframe></html>

Discovering the oEmbed URL

Under normal circumstances, the section of a video's page on Show includes two elements: one with type m,application/json+oembed, and the other with type text/xml+oembed.

In these two links, the href attribute contains the URL for obtaining the oEmbed response in either JSON or XML format, depending on which one you use. These elements enable you to copy your video's URL and use it anywhere that oEmbed is supported.

Manually Add Show to the oEmbed provider in Wordpress

To start, you’ll want to use the wp_oembed_add_provider() function, here’s how this new provider rule will look:

<?php wp_oembed_add_provider( '/https?:\/\/(.+)?(getshow.io)\/(share|iframe)\/.*/', 'http://api.getshow.io/oembed', true); ?>

From there it’s mostly a copy & paste job. Once you’ve added that to the functions.php file in your WordPress directory, you should be all set to use Show oEmbed URLs.

How to use Thumbnail?

Thumbnail_url will be returned as part of the JSON. You can use this thumbnail image, which has no play button overlaid on it. So it can be used for displaying your own play button or any popover embed design.

Struggling to Embed - Use Embedly

If you wish to use oEmbed out of box with least effort. We would recommend you to use Embedly.