{"_id":"5718e3a5c7b52619003f6335","parentDoc":null,"category":{"_id":"5718e37bf8f7de1900683fad","project":"564de2dbfe07a81700b5c3a5","version":"564de2dbfe07a81700b5c3a8","__v":0,"sync":{"url":"","isSync":false},"reference":false,"createdAt":"2016-04-21T14:28:11.000Z","from_sync":false,"order":5,"slug":"video","title":"Video"},"version":{"_id":"564de2dbfe07a81700b5c3a8","project":"564de2dbfe07a81700b5c3a5","__v":10,"createdAt":"2015-11-19T14:55:23.838Z","releaseDate":"2015-11-19T14:55:23.837Z","categories":["564de2ddfe07a81700b5c3a9","564df317826645210097a890","564df3217c8f372b00b934df","564e5227c3553e0d003e53ba","5666dac5d784a70d00397bcb","56cd08ddd98d851d00c0c3bd","56e9a50946bfd60e008840a7","5718e37bf8f7de1900683fad","58c3308dfedf070f0043b72c","58ce99c75457d02300560c0a"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"__v":4,"user":"568c2f46e111c70d002d84b6","project":"564de2dbfe07a81700b5c3a5","updates":[],"next":{"pages":[],"description":""},"createdAt":"2016-04-21T14:28:53.674Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":0,"body":"After signing up for an account, you can get started right away with Video. \n[block:callout]\n{\n  \"type\": \"info\",\n  \"body\": \"The API plan comes with 10 videos at multiple encodings with no restriction in length. Multiple encodings optimize the video across connection speeds and devices.\",\n  \"title\": \"API plan\"\n}\n[/block]\nHead to the Video section in your account. Here you can upload a video. \n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/bI3lPOl0SUOVPSh3dmm9_Screen%20Shot%202016-04-21%20at%2011.28.31%20AM.png\",\n        \"Screen Shot 2016-04-21 at 11.28.31 AM.png\",\n        \"1249\",\n        \"722\",\n        \"#394f6a\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nAfter it processes, you can copy the embed code to add to your site, or copy the link to share.  If you post the link on sites that embed, like Medium, it will automatically embed. See an example of the videos on Medium here:\n[block:embed]\n{\n  \"html\": false,\n  \"url\": \"https://medium.com/:::at:::whichlight/moving-beyond-the-spectacle-e371d4c94f5d\",\n  \"title\": \"Moving Beyond the Spectacle\",\n  \"favicon\": \"https://cdn-static-1.medium.com/_/fp/icons/favicon-medium.TAS6uQ-Y7kcKgi0xjcYHXw.ico\",\n  \"image\": \"https://d262ilb51hltx0.cloudfront.net/max/1200/1*cvqwFPutVO1QKDcRygOdQw.png\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Adding Video Covers\"\n}\n[/block]\nYou might notice there is something more in the videos in the linked Medium post above. The animated covers are additional feature you can use to customize your videos and make them look great. To add a cover go to the video detail page of an uploaded video. I'll go through an example below. \n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/D9LPLRHmROmcwB7quuGJ_Screen%20Shot%202016-04-21%20at%2011.29.16%20AM.png\",\n        \"Screen Shot 2016-04-21 at 11.29.16 AM.png\",\n        \"1286\",\n        \"793\",\n        \"#5276aa\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nBelow the video preview you'll find an \"Add Cover\" option. Click that. \n\nNow you can select the part of the video you want to use as an animated preview. The play button is moved to the corner to let your content stand out. \n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/L4SOoSIK9Y8aqDieWAT0_Screen%20Shot%202016-04-21%20at%2011.30.59%20AM.png\",\n        \"Screen Shot 2016-04-21 at 11.30.59 AM.png\",\n        \"1252\",\n        \"762\",\n        \"#d94e47\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nIt will take a few seconds to create the cover, and once it is finished, you can see it rendered in your video preview. The cover is an a muted autplaying video. On mobile, the video will render with a thumbnail instead of the animated cover because autoplay video is not available on mobile browsers.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Analytics\"\n}\n[/block]\nVideos that you upload automatically are included among your Embedly analytics. The attention graphs, impressions, and plays available for video embeds are also available for your uploaded videos. In the Video Detail you can find a link to the analytics for that specific video. \n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Integrating with the API\"\n}\n[/block]\nThe real power of Video is in being able to integrate it directly to your apps, CMS, and websites. You can find more information on uploading video and serving the player in the [API documentation](/video).\n\nYou can get an overview of the Video API in this tutorial:\n[block:embed]\n{\n  \"html\": \"<iframe class=\\\"embedly-embed\\\" src=\\\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fcdn.embedly.com%2Fwidgets%2Fmedia.html%3Furl%3Dhttp%253A%252F%252Fv.embedly.com%252FIaJcsEMI%26key%3De9dc19773ee1472f869ed8b4a17cb385%26type%3Dtext%252Fhtml%26schema%3Dembio%26image%3Dhttp%253A%252F%252Fv-cdn.embedly.com%252Fproduction%252FIaJcsEMI%252Fthumbnails%252Fthumbnail_0.png&src_secure=1&url=http%3A%2F%2Fv.embedly.com%2FIaJcsEMI&image=http%3A%2F%2Fv-cdn.embedly.com%2Fproduction%2FIaJcsEMI%2Fthumbnails%2Fthumbnail_0.png&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=embio\\\" width=\\\"800\\\" height=\\\"450\\\" scrolling=\\\"no\\\" frameborder=\\\"0\\\" allowfullscreen></iframe>\",\n  \"url\": \"http://v.embedly.com/IaJcsEMI\",\n  \"title\": \"Embedly Video API: Overview and Getting Started\",\n  \"favicon\": \"http://v.embedly.com/static/images/favicon.ico\",\n  \"image\": \"http://v-cdn.embedly.com/production/IaJcsEMI/thumbnails/thumbnail_0.png\"\n}\n[/block]","excerpt":"Getting started with Video","slug":"video-introduction","type":"basic","title":"Video Introduction"}

Video Introduction

Getting started with Video

After signing up for an account, you can get started right away with Video. [block:callout] { "type": "info", "body": "The API plan comes with 10 videos at multiple encodings with no restriction in length. Multiple encodings optimize the video across connection speeds and devices.", "title": "API plan" } [/block] Head to the Video section in your account. Here you can upload a video. [block:image] { "images": [ { "image": [ "https://files.readme.io/bI3lPOl0SUOVPSh3dmm9_Screen%20Shot%202016-04-21%20at%2011.28.31%20AM.png", "Screen Shot 2016-04-21 at 11.28.31 AM.png", "1249", "722", "#394f6a", "" ] } ] } [/block] After it processes, you can copy the embed code to add to your site, or copy the link to share. If you post the link on sites that embed, like Medium, it will automatically embed. See an example of the videos on Medium here: [block:embed] { "html": false, "url": "https://medium.com/@whichlight/moving-beyond-the-spectacle-e371d4c94f5d", "title": "Moving Beyond the Spectacle", "favicon": "https://cdn-static-1.medium.com/_/fp/icons/favicon-medium.TAS6uQ-Y7kcKgi0xjcYHXw.ico", "image": "https://d262ilb51hltx0.cloudfront.net/max/1200/1*cvqwFPutVO1QKDcRygOdQw.png" } [/block] [block:api-header] { "type": "basic", "title": "Adding Video Covers" } [/block] You might notice there is something more in the videos in the linked Medium post above. The animated covers are additional feature you can use to customize your videos and make them look great. To add a cover go to the video detail page of an uploaded video. I'll go through an example below. [block:image] { "images": [ { "image": [ "https://files.readme.io/D9LPLRHmROmcwB7quuGJ_Screen%20Shot%202016-04-21%20at%2011.29.16%20AM.png", "Screen Shot 2016-04-21 at 11.29.16 AM.png", "1286", "793", "#5276aa", "" ] } ] } [/block] Below the video preview you'll find an "Add Cover" option. Click that. Now you can select the part of the video you want to use as an animated preview. The play button is moved to the corner to let your content stand out. [block:image] { "images": [ { "image": [ "https://files.readme.io/L4SOoSIK9Y8aqDieWAT0_Screen%20Shot%202016-04-21%20at%2011.30.59%20AM.png", "Screen Shot 2016-04-21 at 11.30.59 AM.png", "1252", "762", "#d94e47", "" ] } ] } [/block] It will take a few seconds to create the cover, and once it is finished, you can see it rendered in your video preview. The cover is an a muted autplaying video. On mobile, the video will render with a thumbnail instead of the animated cover because autoplay video is not available on mobile browsers. [block:api-header] { "type": "basic", "title": "Analytics" } [/block] Videos that you upload automatically are included among your Embedly analytics. The attention graphs, impressions, and plays available for video embeds are also available for your uploaded videos. In the Video Detail you can find a link to the analytics for that specific video. [block:api-header] { "type": "basic", "title": "Integrating with the API" } [/block] The real power of Video is in being able to integrate it directly to your apps, CMS, and websites. You can find more information on uploading video and serving the player in the [API documentation](/video). You can get an overview of the Video API in this tutorial: [block:embed] { "html": "<iframe class=\"embedly-embed\" src=\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fcdn.embedly.com%2Fwidgets%2Fmedia.html%3Furl%3Dhttp%253A%252F%252Fv.embedly.com%252FIaJcsEMI%26key%3De9dc19773ee1472f869ed8b4a17cb385%26type%3Dtext%252Fhtml%26schema%3Dembio%26image%3Dhttp%253A%252F%252Fv-cdn.embedly.com%252Fproduction%252FIaJcsEMI%252Fthumbnails%252Fthumbnail_0.png&src_secure=1&url=http%3A%2F%2Fv.embedly.com%2FIaJcsEMI&image=http%3A%2F%2Fv-cdn.embedly.com%2Fproduction%2FIaJcsEMI%2Fthumbnails%2Fthumbnail_0.png&key=02466f963b9b4bb8845a05b53d3235d7&type=text%2Fhtml&schema=embio\" width=\"800\" height=\"450\" scrolling=\"no\" frameborder=\"0\" allowfullscreen></iframe>", "url": "http://v.embedly.com/IaJcsEMI", "title": "Embedly Video API: Overview and Getting Started", "favicon": "http://v.embedly.com/static/images/favicon.ico", "image": "http://v-cdn.embedly.com/production/IaJcsEMI/thumbnails/thumbnail_0.png" } [/block]