---
title: "Extend Media Types"
description: "Learn to extend media types like YouTube and SoundCloud on CloudCMS with this tutorial and customized JavaScript. (Gitana 4.0)"
product: "Gitana"
version: "4.0"
url: "/documentation/gitana/4.0/ui/embedded-media/advanced/extend-mediatypes"
---

# Extend Media Types

The out of the box media types on CloudCMS are Youtube, Vimeo, Brightcove and Soundcloud. However, we grant you the ability to introduce any other media types. Follow this tutorial to learn how. (Code is involved!)

## Create a xxx-link.js File

Note: Take a look at [these files](https://github.com/gitana/sdk/tree/master/ui-extensions/modules/editors/embedded-media/media-types "these files") to get a sense of it.

### getSchema() and getOptions()

These two methods allow you to create a form with specific fields to configure for templates of this type.

```javascript
    /**
    * @override
    */
    getSchema: function () {
        return {
            "width": {
                "type": "string"
            },
            "height": {
                "type": "string"
            },
            "frameborder": {
                "type": "string",
                "enum": ["0", "1", "2"]
            }
        };
    },

    /**
    * @override
    */
    getOptions: function () {
        return {
            "width": {
                "type": "text",
                "label": "Width"
            },
            "height": {
                "type": "text",
                "label": "Height"
            },
            "frameborder": {
                "type": "select",
                "label": "Frame Border"
            }
        };
    }
```

For instance, with the above code in `soundcloud-link.js`, when you create a soundcloud template in **Embedded Media Editor** under project management, it's going to look like the following screenshot:

![sc.png](/documentation/gitana/4.0/ui/embedded-media/advanced/extend-mediatypes/sc.png)

CloudCMS uses [AlpacaJS](http://alpacajs.org/ "AlpacaJS") form engine.

### generateLink(control, template, callback)

This is the method that generates the HTML element for the embedded media. **control** provides the way to access the form data; **template** is the JSON object of the embedded media template that's being used. Take a look at the sample files in the SDK to learn how to use this method to generate more complex elements.

### canHandle(mediaType)

**mediaType** must be consistent with the key in project.json configuration.

## Add it in project.json

Add an object like this in the 'mediatypes' array of 'project-media-types' in [project.json](https://github.com/gitana/sdk/blob/master/ui-extensions/modules/editors/embedded-media/config/embedded-media/blocks/default/project-media-types/project.json "project.json"):

```json
{
    "key": "thinglink",
    "label": "Thinglink"
}
```