Vimeo preview custom element for Kentico Kontent

This Kentico Kontent custom element allows the editor to preview a Vimeo video directly in Kontent's UI. The element can be tested by configuring the following URL for the custom element's "Hosted code URL" field. https://vimeo-preview.netlify.com/

There is also a possibility to adjust the size of the video displayed within the UI. This can easily be done in the custom element's "Parameters {JSON}" field.

The whole set up of the element could look like this.

With the final output looking like this from the editor's perspective.

Setup

1. Deploy the code to a secure public host
   • See deploying section for a really quick option
2. Follow the instructions in the Kentico Kontent documentation to add the element to a content type.
   • The Hosted code URL is where the element has been deplyed to in step 1
   • The size of the preview can be changed as per sample parameters in the JSON Parameters configuration section of this readme.

JSON Parameters

{
    "width": 700,
    "height": 400
}

Saved value

The following is returned by the Deliveri API.

"elements": {
   "vimeo_video": {
     "type": "custom",
     "name": "Vimeo video",
     "value": "183941852"
   }
 }

Deploying

Netlify has made this easy. If you click the deploy button below, it will guide you through the process of deploying it to Netlify and leave you with a copy of the repository in your GitHub account as well.