Support Center

About Koken

This Help Center provides support for Koken, a free content management system designed for photographers, artists and designers.

Defining an oEmbed provider

Defining an oEmbed provider

Last Updated: Jul 25, 2013 04:49PM EDT

oEmbed is a format for allowing an embedded representation of a URL on third party sites. The simple API allows a website to display embedded content (such as photos or videos) when a user posts a link to that resource, without having to parse the resource directly.

Koken supports oEmbed by allowing users to paste URLs into a new line in an essay or page. The oEmbed API then renders the linked content automatically. By default, Koken includes oEmbed plugins for popular services like Twitter, Vimeo, Flickr, Hulu, YouTube and Instagram. Defining a new oEmbed provider is very simple, and only requires a plugin.json file. For more information on how to setup your plugin, see the Getting started guide.

oEmbed plugins only require a plugin.json file. No plugin.php file is needed.

To define a new oEmbed provider, add an oembeds object to the plugin.json file:
{
    "name": "Twitter oEmbed provider",
    "version": "1.0",
    "description": "Turn Twitter URLs into Twitter Cards.",
    "demo": "http://koken.me",
    "author": {
        "name": "Koken",
        "link": "http://koken.me"
    },

    "oembeds": {

    }

}
Inside the oembeds object, you can define as many services as you like. In this example, we'll define an oEmbed provider for Twitter:
​"oembeds": {
    "twitter": {
        "title": "Twitter",
        "endpoint": "https://api.twitter.com/1/statuses/oembed.json",
        "regex": "https?://(www\\.)?twitter.com/.*/status(es)?/\\d+",
        "icon": "data:image/png;base64,iVBOR..."
    }
}
Each oEmbed definition is a key/value set. The key is a unique identifier for the service ("twitter" in the above example). The value is an object with the following key/value pairs: ​
  • title -  The text shown when the oEmbed preview is rendered in the editor.
  • endpoint - The API endpoint as specified in the service's oEmbed documentation. This endpoint must point to a JSON formatted endpoint. Do not include the url= portion of the endpoint. Koken will append the url parameter to the endpoint automatically before sending the request.
  • regex - The regular expression to be used to match the service's URLs. Each time a user pastes a URL into a text entry, it will be matched against all oEmbed regular expressions.
  • icon - A base64 encoded image that is 16x16 pixels. This icon will be shown when the oEmbed preview is rendered in the editor.

What's next?

That's it! Koken automatically handles the implementation of oEmbeds. The embed will be parsed from the source, and the HTML will be generated whenever the essay or page is rendered in the published site.
support@koken.me
http://assets0.desk.com/
false
koken
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete