{"id":21509,"date":"2017-04-24T16:55:06","date_gmt":"2017-04-24T16:55:06","guid":{"rendered":"http:\/\/video_management_made_easy"},"modified":"2024-06-04T16:14:43","modified_gmt":"2024-06-04T23:14:43","slug":"video_management_made_easy","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/video_management_made_easy","title":{"rendered":"Video Management Made Easy"},"content":{"rendered":"<div class=\"wp-block-cloudinary-markdown \"><p>Like it or not, visuals tell better stories than words. But using images and <a href=\"https:\/\/cloudinary.com\/video_api\">videos<\/a> on a website presents challenges. This article is a follow-up to <a href=\"https:\/\/www.codeproject.com\/Articles\/1137668\/Website-Image-Performance-Improvement\">Website Image Performance Improvement<\/a>, in which we discussed how to upload, store, manipulate, optimize and deliver images, efficiently and effectively. Now, let\u2019s talk video.<\/p>\n<p>Much like we talked in our previous article about the managing images on your website, you may also have a need to <a href=\"https:\/\/cloudinary.com\/glossary\/video-rendering\">render video<\/a> content. Trust me \u2013 simply throwing a <code>&lt;video&gt;<\/code> tag with an accurate source to the browser does not deliver user satisfaction. At a high level, you need to consider the website layout, video quality and delivery, as well as address challenges, such as:<\/p>\n<p>Adjusting video quality based on network conditions. For example, users in developing countries may have a slower internet connection compared to users in developed countries:<\/p>\n<ul>\n<li>Delivering content to mobile users<\/li>\n<li>Transcoding for different browsers<\/li>\n<li>Manipulating video, such as  resizing, cropping and adding visual effects<\/li>\n<\/ul>\n<p>All these requirements make video complex. You cannot just take care of videos in few hours. In fact, you may find it difficult to find  answers to certain questions on video management. But, there is one swift solution \u2013 <a href=\"https:\/\/cloudinary.com\/\">Cloudinary<\/a>.<\/p>\n<p><a href=\"https:\/\/cloudinary.com\/\">Cloudinary<\/a> is an all-in-one media management solution. In this article, we are going to delve into using Cloudinary to easily upload, manipulate and deliver videos.<\/p>\n<p>Let\u2019s see how we can use Cloudinary in our Node application.<\/p>\n<h2>Setup and Installation<\/h2>\n<p>Using Cloudinary in your existing application is easy:<\/p>\n<ul>\n<li>Create a <a href=\"https:\/\/cloudinary.com\/users\/register_free\">free Cloudinary account<\/a>. You will receive an API key and secret. Store the key and your cloud name somewhere safe and easily accessible.<\/li>\n<li>Install the Cloudinary SDK in your existing project:<\/li>\n<\/ul>\n<pre class=\"js-syntax-highlighted\"><code>npm install --save cloudinary\n<\/code><\/pre>\n<ul>\n<li>Include and configure Cloudinary in your Node app using the credentials received after creating a new account:<\/li>\n<\/ul>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\"><span class=\"hljs-keyword\">var<\/span> cloudinary = <span class=\"hljs-built_in\">require<\/span>(<span class=\"hljs-string\">'cloudinary'<\/span>);\n\ncloudinary.config({ \n\t<span class=\"hljs-attr\">cloud_name<\/span>: <span class=\"hljs-string\">'&lt;CLOUD_NAME&gt;'<\/span>, \n\t<span class=\"hljs-attr\">api_key<\/span>: <span class=\"hljs-string\">'&lt;API_KEY&gt;'<\/span>, \n\t<span class=\"hljs-attr\">api_secret<\/span>: <span class=\"hljs-string\">'&lt;API_SECRET&gt;'<\/span> \n});\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<p>The <code>cloud_name<\/code> is enough when making and opening API calls like delivering videos. The key and secret are needed for secure calls, such as video uploads.<\/p>\n<h2>Video Upload<\/h2>\n<p>All you need to start managing videos is to upload the best video quality you have. You can manipulate videos on-the-fly using Cloudinary\u2019s comprehensive API and easy to use manipulation URLs. Therefore, there is no need to do that before uploading. Let\u2019s see a simple code example from Node for making a video upload:<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">cloudinary.uploader.upload(<span class=\"hljs-string\">\"MLB_Vid.mp4\"<\/span>, \n        <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\">result<\/span>) <\/span>{<span class=\"hljs-built_in\">console<\/span>.log(result); }, \n        { <span class=\"hljs-attr\">resource_type<\/span>: <span class=\"hljs-string\">\"video\"<\/span> });\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<p>It\u2019s the same API method for images, but this time you have to explicitly tell the uploader that the resource type is video by passing the following as the third argument for the <code>upload<\/code> method:<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"CSS\" data-shcb-language-slug=\"css\"><span><code class=\"hljs language-css shcb-wrap-lines\">{ <span class=\"hljs-attribute\">resource_type<\/span>: <span class=\"hljs-string\">\"video\"<\/span> }\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">CSS<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">css<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<h2>Video Delivery<\/h2>\n<p>After uploading videos, you need to determine how they should be delivered. You can use the SDK\u2019s <code>video<\/code> API to achieve this:<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">cloudinary.video(<span class=\"hljs-string\">\"MLB_Vid\"<\/span>)\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<h2>Video Transformation<\/h2>\n<p>Transformation is the act of adjusting the existing properties and quality of the videos to achieve the desired output.<\/p>\n<p>Manual transformations can be complex and time-consuming. Mitigating these challenges is not easy, but that is where Cloudinary comes in.<\/p>\n<p>Video transformations come in a variety of forms:<\/p>\n<ul>\n<li>Quality Optimization<\/li>\n<li>Resizing and Cropping<\/li>\n<li>Transcoding<\/li>\n<li>Content manipulation<\/li>\n<li>Audio adjustment<\/li>\n<li>and <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery\">a lot more<\/a>\n<\/li>\n<\/ul>\n<p>You can transform videos at one of two different stages:<\/p>\n<ul>\n<li>When uploading (known as <strong>Eager Transformation<\/strong>)<\/li>\n<li>While delivering (known as <strong>Lazy Transformation<\/strong>)<\/li>\n<\/ul>\n<h3>Eager Transformation<\/h3>\n<p>Eager transformation is best when you do not need to manipulate video dynamically. You just need to manipulate once, store and deliver to users.<\/p>\n<p>Let\u2019s see an example of transforming videos while uploading:<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">cloudinary.uploader.upload(<span class=\"hljs-string\">\"MLB_Vid.mp4\"<\/span>, \n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\">result<\/span>) <\/span>{<span class=\"hljs-built_in\">console<\/span>.log(result); }, \n    { <span class=\"hljs-attr\">resource_type<\/span>: <span class=\"hljs-string\">\"video\"<\/span>, \n      <span class=\"hljs-attr\">eager<\/span>: &#91;\n      { <span class=\"hljs-attr\">width<\/span>: <span class=\"hljs-number\">300<\/span>, <span class=\"hljs-attr\">height<\/span>: <span class=\"hljs-number\">300<\/span>,\n        <span class=\"hljs-attr\">crop<\/span>: <span class=\"hljs-string\">\"pad\"<\/span>, <span class=\"hljs-attr\">audio_codec<\/span>: <span class=\"hljs-string\">\"none\"<\/span> }, \n      { <span class=\"hljs-attr\">width<\/span>: <span class=\"hljs-number\">160<\/span>, <span class=\"hljs-attr\">height<\/span>: <span class=\"hljs-number\">100<\/span>,\n        <span class=\"hljs-attr\">crop<\/span>: <span class=\"hljs-string\">\"crop\"<\/span>, <span class=\"hljs-attr\">gravity<\/span>: <span class=\"hljs-string\">\"south\"<\/span>,\n        <span class=\"hljs-attr\">audio_codec<\/span>: <span class=\"hljs-string\">\"none\"<\/span> } ]});\n\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<p>The third argument, which is an object, is also used to specify the eager transformation using an <code>eager<\/code> property.<\/p>\n<h3>Lazy Transformation<\/h3>\n<p>In lazy transformation, the reverse becomes the case. Rather than manipulating videos during upload, you can store the best quality available and manipulate them on delivery.<\/p>\n<p>Therefore, you have the control to dynamically generate a transformed variation of a given video when you are about to embed it in the browser:\n<cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [ {width: 300, height: 300, crop: \\&quot;fill\\&quot;}, {overlay: \\&quot;cloudinary_icon\\&quot;, width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [\\n  {width: 300, height: 300, crop: \\&quot;fill\\&quot;},\\n  {overlay: \\&quot;cloudinary_icon\\&quot;, width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot; \\\/&gt; &lt;Transformation overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot; \\\/&gt;\\n\\t&lt;Transformation overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot; \\\/&gt; &lt;cld-transformation :overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation width=\\&quot;300\\&quot; height=\\&quot;300\\&quot; crop=\\&quot;fill\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation overlay=\\&quot;cloudinary_icon\\&quot; width=\\&quot;0.8\\&quot; flags=\\&quot;relative\\&quot; effect=\\&quot;brightness:200\\&quot; opacity=\\&quot;50\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {transformation: [ {width: 300, height: 300, crop: \\&quot;fill\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {transformation: [\\n  {width: 300, height: 300, crop: \\&quot;fill\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(transformation=[ {&#039;width&#039;: 300, &#039;height&#039;: 300, &#039;crop&#039;: \\&quot;fill\\&quot;}, {&#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;width&#039;: \\&quot;0.8\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;effect&#039;: \\&quot;brightness:200\\&quot;, &#039;opacity&#039;: 50} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(transformation=[\\n  {&#039;width&#039;: 300, &#039;height&#039;: 300, &#039;crop&#039;: \\&quot;fill\\&quot;},\\n  {&#039;overlay&#039;: \\&quot;cloudinary_icon\\&quot;, &#039;width&#039;: \\&quot;0.8\\&quot;, &#039;flags&#039;: \\&quot;relative\\&quot;, &#039;effect&#039;: \\&quot;brightness:200\\&quot;, &#039;opacity&#039;: 50}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::fill()-&gt;width(300)\\n-&gt;height(300))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.8)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(50))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(200)))\\n\\t));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::fill()-&gt;width(300)\\n-&gt;height(300))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::image(\\&quot;cloudinary_icon\\&quot;)\\n\\t-&gt;transformation((new Transformation())\\n\\t-&gt;resize(Resize::scale()-&gt;width(0.8)\\n\\t-&gt;relative()\\n\\t)\\n\\t-&gt;adjust(Adjust::opacity(50))\\n\\t-&gt;adjust(Adjust::brightness()-&gt;level(200)))\\n\\t));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;width\\&quot;=&gt;300, \\&quot;height\\&quot;=&gt;300, \\&quot;crop\\&quot;=&gt;\\&quot;fill\\&quot;), array(\\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.8\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;brightness:200\\&quot;, \\&quot;opacity\\&quot;=&gt;50) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;width\\&quot;=&gt;300, \\&quot;height\\&quot;=&gt;300, \\&quot;crop\\&quot;=&gt;\\&quot;fill\\&quot;),\\n  array(\\&quot;overlay\\&quot;=&gt;\\&quot;cloudinary_icon\\&quot;, \\&quot;width\\&quot;=&gt;\\&quot;0.8\\&quot;, \\&quot;flags\\&quot;=&gt;\\&quot;relative\\&quot;, \\&quot;effect\\&quot;=&gt;\\&quot;brightness:200\\&quot;, \\&quot;opacity\\&quot;=&gt;50)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(300).height(300).crop(\\&quot;fill\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).width(0.8).flags(\\&quot;relative\\&quot;).effect(\\&quot;brightness:200\\&quot;).opacity(50)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .width(300).height(300).crop(\\&quot;fill\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).width(0.8).flags(\\&quot;relative\\&quot;).effect(\\&quot;brightness:200\\&quot;).opacity(50)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, transformation: [ {width: 300, height: 300, crop: \\&quot;fill\\&quot;}, {overlay: \\&quot;cloudinary_icon\\&quot;, width: 0.8, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, transformation: [\\n  {width: 300, height: 300, crop: \\&quot;fill\\&quot;},\\n  {overlay: \\&quot;cloudinary_icon\\&quot;, width: 0.8, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(300).Height(300).Crop(\\&quot;fill\\&quot;).Chain() .Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Width(0.8).Flags(\\&quot;relative\\&quot;).Effect(\\&quot;brightness:200\\&quot;).Opacity(50)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .Width(300).Height(300).Crop(\\&quot;fill\\&quot;).Chain()\\n  .Overlay(new Layer().PublicId(\\&quot;cloudinary_icon\\&quot;)).Width(0.8).Flags(\\&quot;relative\\&quot;).Effect(\\&quot;brightness:200\\&quot;).Opacity(50)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.fill().width(300)\\n.height(300))\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.8)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(50))\\n\\t.adjust(Adjust.brightness().level(200)))\\n\\t)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.fill().width(300)\\n.height(300))\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.8)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(50))\\n\\t.adjust(Adjust.brightness().level(200)))\\n\\t)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(300).setHeight(300).setCrop(\\&quot;fill\\&quot;).chain() .setOverlay(\\&quot;cloudinary_icon\\&quot;).setWidth(0.8).setFlags(\\&quot;relative\\&quot;).setEffect(\\&quot;brightness:200\\&quot;).setOpacity(50)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setWidth(300).setHeight(300).setCrop(\\&quot;fill\\&quot;).chain()\\n  .setOverlay(\\&quot;cloudinary_icon\\&quot;).setWidth(0.8).setFlags(\\&quot;relative\\&quot;).setEffect(\\&quot;brightness:200\\&quot;).setOpacity(50)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(300).height(300).crop(\\&quot;fill\\&quot;).chain() .overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).width(0.8).flags(\\&quot;relative\\&quot;).effect(\\&quot;brightness:200\\&quot;).opacity(50)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .width(300).height(300).crop(\\&quot;fill\\&quot;).chain()\\n  .overlay(new Layer().publicId(\\&quot;cloudinary_icon\\&quot;)).width(0.8).flags(\\&quot;relative\\&quot;).effect(\\&quot;brightness:200\\&quot;).opacity(50)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.fill().width(300)\\n.height(300))\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.8)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(50))\\n\\t.adjust(Adjust.brightness().level(200)))\\n\\t)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.fill().width(300)\\n.height(300))\\n\\t.overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;)\\n\\t.transformation(new Transformation()\\n\\t.resize(Resize.scale().width(0.8)\\n\\t.relative()\\n\\t)\\n\\t.adjust(Adjust.opacity(50))\\n\\t.adjust(Adjust.brightness().level(200)))\\n\\t)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.fill() { width(300)\\n height(300) })\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.8F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(50))\\n\\t adjust(Adjust.brightness() { level(200) }) })\\n\\t })) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.fill() { width(300)\\n height(300) })\\n\\t overlay(Overlay.source(\\n\\tSource.image(\\&quot;cloudinary_icon\\&quot;) {\\n\\t transformation(Transformation {\\n\\t resize(Resize.scale() { width(0.8F)\\n\\t relative()\\n\\t })\\n\\t adjust(Adjust.opacity(50))\\n\\t adjust(Adjust.brightness() { level(200) }) })\\n\\t })) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [ {width: 300, height: 300, crop: \\&quot;fill\\&quot;}, {overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [\\n  {width: 300, height: 300, crop: \\&quot;fill\\&quot;},\\n  {overlay: new cloudinary.Layer().publicId(\\&quot;cloudinary_icon\\&quot;), width: \\&quot;0.8\\&quot;, flags: \\&quot;relative\\&quot;, effect: \\&quot;brightness:200\\&quot;, opacity: 50}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .resize(fill().width(300).height(300))\\n  .overlay(\\n    source(\\n      image(\\&quot;cloudinary_icon\\&quot;).transformation(\\n        new Transformation()\\n          .resize(scale().width(0.8).relative())\\n          .adjust(opacity(50))\\n          .adjust(brightness().level(200))\\n      )\\n    )\\n  );&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/w_300,h_300,c_fill\\\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;width&quot;:&quot;300&quot;,&quot;height&quot;:&quot;300&quot;,&quot;crop_mode&quot;:&quot;fill&quot;},{&quot;overlay&quot;:&quot;cloudinary_icon&quot;,&quot;width&quot;:&quot;0.8&quot;,&quot;flags&quot;:&quot;relative&quot;,&quot;effect&quot;:&quot;brightness:200&quot;,&quot;opacity&quot;:&quot;50&quot;}],&quot;transformation_string&quot;:&quot;w_300,h_300,c_fill\\\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_300,h_300,c_fill\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_300,h_300,c_fill\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_300,h_300,c_fill\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_300,h_300,c_fill\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_300,h_300,c_fill\/l_cloudinary_icon,w_0.8,fl_relative,e_brightness:200,o_50\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<h2>Video Transformation Examples<\/h2>\n<p>Let\u2019s see five interesting techniques you can apply using video transformation:<\/p>\n<h3>1. Resizing and Cropping<\/h3>\n<p>You can adjust the size and width of your videos to fit the user\u2019s screen, which will in turn reduce the amount of kilobytes that will need to be downloaded:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation width=\\&quot;150\\&quot; height=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(width=150, height=150, crop=\\&quot;scale\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(width=150, height=150, crop=\\&quot;scale\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(150)\\n-&gt;height(150));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(150)\\n-&gt;height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;width\\&quot;=&gt;150, \\&quot;height\\&quot;=&gt;150, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;width\\&quot;=&gt;150, \\&quot;height\\&quot;=&gt;150, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(150).height(150).crop(\\&quot;scale\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(150).height(150).crop(\\&quot;scale\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, width: 150, height: 150, crop: \\&quot;scale\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, width: 150, height: 150, crop: \\&quot;scale\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(150).Height(150).Crop(\\&quot;scale\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(150).Height(150).Crop(\\&quot;scale\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)\\n.height(150)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)\\n.height(150)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(150).setHeight(150).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(150).setHeight(150).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(150).height(150).crop(\\&quot;scale\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(150).height(150).crop(\\&quot;scale\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)\\n.height(150)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)\\n.height(150)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(150)\\n height(150) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(150)\\n height(150) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, height: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150).height(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/w_150,h_150\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;width&quot;:&quot;150&quot;,&quot;height&quot;:&quot;150&quot;}],&quot;transformation_string&quot;:&quot;w_150,h_150&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,h_150\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,h_150\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,h_150\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,h_150\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,h_150\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>You also can retain the aspect ratio by providing only the width and using the <code>scale<\/code> crop type:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation width=\\&quot;150\\&quot; crop=\\&quot;scale\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {width: 150, crop: \\&quot;scale\\&quot;}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {width: 150, crop: \\&quot;scale\\&quot;}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(width=150, crop=\\&quot;scale\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(width=150, crop=\\&quot;scale\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(150));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;resize(Resize::scale()-&gt;width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;width\\&quot;=&gt;150, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;width\\&quot;=&gt;150, \\&quot;crop\\&quot;=&gt;\\&quot;scale\\&quot;))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(150).crop(\\&quot;scale\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().width(150).crop(\\&quot;scale\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, width: 150, crop: \\&quot;scale\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, width: 150, crop: \\&quot;scale\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(150).Crop(\\&quot;scale\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Width(150).Crop(\\&quot;scale\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(150).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setWidth(150).setCrop(\\&quot;scale\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(150).crop(\\&quot;scale\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().width(150).crop(\\&quot;scale\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.resize(Resize.scale().width(150)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(150) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t resize(Resize.scale() { width(150) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {width: 150, crop: \\&quot;scale\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).resize(scale().width(150));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/w_150,c_scale\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;width&quot;:&quot;150&quot;,&quot;crop_mode&quot;:&quot;scale&quot;}],&quot;transformation_string&quot;:&quot;w_150,c_scale&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,c_scale\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,c_scale\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,c_scale\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,c_scale\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/w_150,c_scale\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>There are <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#resizing_and_cropping_videos\">other scaling options<\/a> that will help you gain  full control over your videos\u2019 dimensions.<\/p>\n<h3>2. Format and Quality Control<\/h3>\n<p>It is possible to use a desired format or quality level that suites a given video delivery situation. The fact that you uploaded an <code>.mp4<\/code> video does not mean you have to upload another <code>.webm<\/code> version of that video. Cloudinary uses a feature called transcoding that enables you upload a single video and deliver it dynamically in different formats:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video()&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.webm&#039;));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.webm&#039;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.webm&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.webm&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.webm\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.webm\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.webm&#039;).transformation(Transformation());&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.webm&#039;).transformation(Transformation());&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.webm\\&quot;) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.webm\\&quot;) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.webm\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/MLB_Vid.webm&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[],&quot;transformation_string&quot;:&quot;&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.webm&quot;,&quot;extension&quot;:&quot;webm&quot;,&quot;format&quot;:&quot;webm&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>You also can adjust the quality of the video:\n<cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {quality: 50})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {quality: 50})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation quality=\\&quot;50\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation quality=\\&quot;50\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation quality=\\&quot;50\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation quality=\\&quot;50\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation quality=\\&quot;50\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation quality=\\&quot;50\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {quality: 50}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {quality: 50}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(quality=50)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(quality=50)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;delivery(Delivery::quality(50));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;delivery(Delivery::quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;quality\\&quot;=&gt;50))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;quality\\&quot;=&gt;50))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().quality(50)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().quality(50)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, quality: 50)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, quality: 50)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Quality(50)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Quality(50)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.delivery(Delivery.quality(50)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.delivery(Delivery.quality(50)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setQuality(50)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setQuality(50)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().quality(50)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().quality(50)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.delivery(Delivery.quality(50)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.delivery(Delivery.quality(50)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t delivery(Delivery.quality(50)) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t delivery(Delivery.quality(50)) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {quality: 50})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {quality: 50})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).delivery(quality(50));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/q_50\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;quality&quot;:&quot;50&quot;}],&quot;transformation_string&quot;:&quot;q_50&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/q_50\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/q_50\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/q_50\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/q_50\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/q_50\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>Find out more about format and quality control <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#video_settings\">here<\/a><\/p>\n<h3>3. Video Trimming<\/h3>\n<p>You can trim video content and discard the parts you don\u2019t need by telling Cloudinary which part of the videos you want to keep:<\/p>\n<p>If you would like to start at 6.5sec and end after at 10sec:\n<cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation startOffset=\\&quot;6.5\\&quot; endOffset=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation startOffset=\\&quot;6.5\\&quot; endOffset=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation start-offset=\\&quot;6.5\\&quot; end-offset=\\&quot;10\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation start-offset=\\&quot;6.5\\&quot; end-offset=\\&quot;10\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation start-offset=\\&quot;6.5\\&quot; end-offset=\\&quot;10\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation start-offset=\\&quot;6.5\\&quot; end-offset=\\&quot;10\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {startOffset: \\&quot;6.5\\&quot;, endOffset: \\&quot;10\\&quot;}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {startOffset: \\&quot;6.5\\&quot;, endOffset: \\&quot;10\\&quot;}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(start_offset=\\&quot;6.5\\&quot;, end_offset=\\&quot;10\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(start_offset=\\&quot;6.5\\&quot;, end_offset=\\&quot;10\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(6.5)\\n-&gt;endOffset(10.0));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;videoEdit(VideoEdit::trim()-&gt;startOffset(6.5)\\n-&gt;endOffset(10.0));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;start_offset\\&quot;=&gt;\\&quot;6.5\\&quot;, \\&quot;end_offset\\&quot;=&gt;\\&quot;10\\&quot;))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;start_offset\\&quot;=&gt;\\&quot;6.5\\&quot;, \\&quot;end_offset\\&quot;=&gt;\\&quot;10\\&quot;))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().startOffset(\\&quot;6.5\\&quot;).endOffset(\\&quot;10\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().startOffset(\\&quot;6.5\\&quot;).endOffset(\\&quot;10\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().StartOffset(\\&quot;6.5\\&quot;).EndOffset(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().StartOffset(\\&quot;6.5\\&quot;).EndOffset(\\&quot;10\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(6.5)\\n.endOffset(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(6.5)\\n.endOffset(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setStartOffset(\\&quot;6.5\\&quot;).setEndOffset(\\&quot;10\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setStartOffset(\\&quot;6.5\\&quot;).setEndOffset(\\&quot;10\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().startOffset(\\&quot;6.5\\&quot;).endOffset(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().startOffset(\\&quot;6.5\\&quot;).endOffset(\\&quot;10\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(6.5)\\n.endOffset(&#039;10.0&#039;)));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.videoEdit(VideoEdit.trim().startOffset(6.5)\\n.endOffset(&#039;10.0&#039;)));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(6.5F)\\n endOffset(10.0F) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t videoEdit(VideoEdit.trim() { startOffset(6.5F)\\n endOffset(10.0F) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {start_offset: \\&quot;6.5\\&quot;, end_offset: \\&quot;10\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).videoEdit(\\n  trim().startOffset(6.5).endOffset(\\&quot;10.0\\&quot;)\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/so_6.5,eo_10\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;start_offset&quot;:&quot;6.5&quot;,&quot;end_offset&quot;:&quot;10&quot;}],&quot;transformation_string&quot;:&quot;so_6.5,eo_10&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_6.5,eo_10\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_6.5,eo_10\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_6.5,eo_10\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_6.5,eo_10\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/so_6.5,eo_10\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>See more on video trimming <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#trimming_videos\">here<\/a><\/p>\n<h3>4. Video Effects<\/h3>\n<p>Cloudinary lets you add a variety of cool effects to your videos during playtime. Effects like fade in and fade out, visual noise, blur, saturation <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#video_effects\">and lots more<\/a>.<\/p>\n<p>Let\u2019s see a simple example of using Cloudinary to apply fade in to a video at start and fade out at end:\n<cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [ {effect: \\&quot;fade:2000\\&quot;}, {effect: \\&quot;fade:-4000\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [\\n  {effect: \\&quot;fade:2000\\&quot;},\\n  {effect: \\&quot;fade:-4000\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation effect=\\&quot;fade:2000\\&quot; \\\/&gt; &lt;Transformation effect=\\&quot;fade:-4000\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation effect=\\&quot;fade:2000\\&quot; \\\/&gt;\\n\\t&lt;Transformation effect=\\&quot;fade:-4000\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation effect=\\&quot;fade:2000\\&quot; \\\/&gt; &lt;cld-transformation effect=\\&quot;fade:-4000\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation effect=\\&quot;fade:2000\\&quot; \\\/&gt;\\n\\t&lt;cld-transformation effect=\\&quot;fade:-4000\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation effect=\\&quot;fade:2000\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;cl-transformation effect=\\&quot;fade:-4000\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation effect=\\&quot;fade:2000\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n\\t&lt;cl-transformation effect=\\&quot;fade:-4000\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {transformation: [ {effect: \\&quot;fade:2000\\&quot;}, {effect: \\&quot;fade:-4000\\&quot;} ]}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {transformation: [\\n  {effect: \\&quot;fade:2000\\&quot;},\\n  {effect: \\&quot;fade:-4000\\&quot;}\\n  ]}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(transformation=[ {&#039;effect&#039;: \\&quot;fade:2000\\&quot;}, {&#039;effect&#039;: \\&quot;fade:-4000\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(transformation=[\\n  {&#039;effect&#039;: \\&quot;fade:2000\\&quot;},\\n  {&#039;effect&#039;: \\&quot;fade:-4000\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;effect(Effect::fadeIn()-&gt;duration(2000))\\n\\t-&gt;effect(Effect::fadeOut()-&gt;duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;effect(Effect::fadeIn()-&gt;duration(2000))\\n\\t-&gt;effect(Effect::fadeOut()-&gt;duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array( array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:2000\\&quot;), array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:-4000\\&quot;) )))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;transformation\\&quot;=&gt;array(\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:2000\\&quot;),\\n  array(\\&quot;effect\\&quot;=&gt;\\&quot;fade:-4000\\&quot;)\\n  )))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().effect(\\&quot;fade:2000\\&quot;).chain() .effect(\\&quot;fade:-4000\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation()\\n  .effect(\\&quot;fade:2000\\&quot;).chain()\\n  .effect(\\&quot;fade:-4000\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, transformation: [ {effect: \\&quot;fade:2000\\&quot;}, {effect: \\&quot;fade:-4000\\&quot;} ])&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, transformation: [\\n  {effect: \\&quot;fade:2000\\&quot;},\\n  {effect: \\&quot;fade:-4000\\&quot;}\\n  ])&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Effect(\\&quot;fade:2000\\&quot;).Chain() .Effect(\\&quot;fade:-4000\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation()\\n  .Effect(\\&quot;fade:2000\\&quot;).Chain()\\n  .Effect(\\&quot;fade:-4000\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_fade:2000\\\/e_fade:-4000\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_fade:2000\\\/e_fade:-4000\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setEffect(\\&quot;fade:2000\\&quot;).chain() .setEffect(\\&quot;fade:-4000\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation()\\n  .setEffect(\\&quot;fade:2000\\&quot;).chain()\\n  .setEffect(\\&quot;fade:-4000\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().effect(\\&quot;fade:2000\\&quot;).chain() .effect(\\&quot;fade:-4000\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation()\\n  .effect(\\&quot;fade:2000\\&quot;).chain()\\n  .effect(\\&quot;fade:-4000\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_fade:2000\\\/e_fade:-4000\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;e_fade:2000\\\/e_fade:-4000\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t effect(Effect.fadeIn() { duration(2000) })\\n\\t effect(Effect.fadeOut() { duration(4000) }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t effect(Effect.fadeIn() { duration(2000) })\\n\\t effect(Effect.fadeOut() { duration(4000) }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [ {effect: \\&quot;fade:2000\\&quot;}, {effect: \\&quot;fade:-4000\\&quot;} ]})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {transformation: [\\n  {effect: \\&quot;fade:2000\\&quot;},\\n  {effect: \\&quot;fade:-4000\\&quot;}\\n  ]})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;)\\n  .effect(fadeIn().duration(2000))\\n  .effect(fadeOut().duration(4000));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/e_fade:2000\\\/e_fade:-4000\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;effect&quot;:&quot;fade:2000&quot;},{&quot;effect&quot;:&quot;fade:-4000&quot;}],&quot;transformation_string&quot;:&quot;e_fade:2000\\\/e_fade:-4000&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_fade:2000\/e_fade:-4000\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_fade:2000\/e_fade:-4000\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_fade:2000\/e_fade:-4000\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_fade:2000\/e_fade:-4000\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/e_fade:2000\/e_fade:-4000\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<p>The positive fade value controls fade in, while the negative fade value controls fade out.<\/p>\n<h3>5. Text Overlay<\/h3>\n<p>It is possible to add text content to your video at a given play time. Let\u2019s add a text, \u201cCool Video\u201d, at the down-middle part of our video. The text should be displayed after 2 seconds and should be removed after 5 seconds:<\/p>\n<p><cld-code-widget\n      class=\" c-code-widget\"\n      snippets=\"[{&quot;sdkId&quot;:&quot;nodejs&quot;,&quot;framework&quot;:&quot;nodejs&quot;,&quot;language&quot;:&quot;nodejs&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {overlay: {font_family: \\&quot;arial\\&quot;, font_size: 60, text: \\&quot;Cool%20Video\\&quot;}, gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(\\&quot;MLB_Vid\\&quot;, {overlay: {font_family: \\&quot;arial\\&quot;, font_size: 60, text: \\&quot;Cool%20Video\\&quot;}, gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Node.js&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_2&quot;,&quot;framework&quot;:&quot;react_2&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;react&quot;,&quot;framework&quot;:&quot;react&quot;,&quot;language&quot;:&quot;react&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt; &lt;Transformation overlay={{fontFamily: \\&quot;arial\\&quot;, fontSize: 60, text: \\&quot;Cool%20Video\\&quot;}} gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; startOffset=\\&quot;2\\&quot; endOffset=\\&quot;5\\&quot; \\\/&gt; &lt;\\\/Video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;Video publicId=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;Transformation overlay={{fontFamily: \\&quot;arial\\&quot;, fontSize: 60, text: \\&quot;Cool%20Video\\&quot;}} gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; startOffset=\\&quot;2\\&quot; endOffset=\\&quot;5\\&quot; \\\/&gt;\\n&lt;\\\/Video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React&quot;,&quot;packageName&quot;:&quot;cloudinary-react&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue_2&quot;,&quot;framework&quot;:&quot;vue_2&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/vue&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;vue&quot;,&quot;framework&quot;:&quot;vue&quot;,&quot;language&quot;:&quot;vue&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cld-transformation :overlay=\\&quot;{fontFamily: &#039;arial&#039;, fontSize: 60, text: &#039;Cool%20Video&#039;}\\&quot; gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; start-offset=\\&quot;2\\&quot; end-offset=\\&quot;5\\&quot; \\\/&gt; &lt;\\\/cld-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cld-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cld-transformation :overlay=\\&quot;{fontFamily: &#039;arial&#039;, fontSize: 60, text: &#039;Cool%20Video&#039;}\\&quot; gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; start-offset=\\&quot;2\\&quot; end-offset=\\&quot;5\\&quot; \\\/&gt;\\n&lt;\\\/cld-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Vue.js&quot;,&quot;packageName&quot;:&quot;cloudinary-vue&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular_2&quot;,&quot;framework&quot;:&quot;angular_2&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/ng&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;angular&quot;,&quot;framework&quot;:&quot;angular&quot;,&quot;language&quot;:&quot;angular&quot;,&quot;rawCodeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt; &lt;cl-transformation overlay=\\&quot;text:arial_60:Cool%20Video\\&quot; gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; start-offset=\\&quot;2\\&quot; end-offset=\\&quot;5\\&quot;&gt; &lt;\\\/cl-transformation&gt; &lt;\\\/cl-video&gt;&quot;,&quot;codeSnippet&quot;:&quot;&lt;cl-video public-id=\\&quot;MLB_Vid\\&quot; &gt;\\n\\t&lt;cl-transformation overlay=\\&quot;text:arial_60:Cool%20Video\\&quot; gravity=\\&quot;south\\&quot; y=\\&quot;80\\&quot; start-offset=\\&quot;2\\&quot; end-offset=\\&quot;5\\&quot;&gt;\\n\\t&lt;\\\/cl-transformation&gt;\\n&lt;\\\/cl-video&gt;&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Angular&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/angular-5.x&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js_2&quot;,&quot;framework&quot;:&quot;js_2&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;@cloudinary\\\/url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;js&quot;,&quot;framework&quot;:&quot;js&quot;,&quot;language&quot;:&quot;js&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {overlay: new cloudinary.TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;), gravity: \\&quot;south\\&quot;, y: 80, startOffset: \\&quot;2\\&quot;, endOffset: \\&quot;5\\&quot;}).toHtml();&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.videoTag(&#039;MLB_Vid&#039;, {overlay: new cloudinary.TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;), gravity: \\&quot;south\\&quot;, y: 80, startOffset: \\&quot;2\\&quot;, endOffset: \\&quot;5\\&quot;}).toHtml();&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;JS&quot;,&quot;packageName&quot;:&quot;cloudinary-core&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;python&quot;,&quot;framework&quot;:&quot;python&quot;,&quot;language&quot;:&quot;python&quot;,&quot;rawCodeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(overlay={&#039;font_family&#039;: \\&quot;arial\\&quot;, &#039;font_size&#039;: 60, &#039;text&#039;: \\&quot;Cool%20Video\\&quot;}, gravity=\\&quot;south\\&quot;, y=80, start_offset=\\&quot;2\\&quot;, end_offset=\\&quot;5\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;CloudinaryVideo(\\&quot;MLB_Vid\\&quot;).video(overlay={&#039;font_family&#039;: \\&quot;arial\\&quot;, &#039;font_size&#039;: 60, &#039;text&#039;: \\&quot;Cool%20Video\\&quot;}, gravity=\\&quot;south\\&quot;, y=80, start_offset=\\&quot;2\\&quot;, end_offset=\\&quot;5\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Python&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;php_2&quot;,&quot;framework&quot;:&quot;php_2&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::text(\\&quot;Cool Video\\&quot;,(new TextStyle(\\&quot;arial\\&quot;,60))))\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::south()))\\n-&gt;offsetY(80))\\n\\t-&gt;timeline(\\n\\tTimeline::position()-&gt;startOffset(2.0)\\n-&gt;endOffset(5.0))\\n\\t);&quot;,&quot;codeSnippet&quot;:&quot;(new VideoTag(&#039;MLB_Vid.mp4&#039;))\\n\\t-&gt;overlay(Overlay::source(\\n\\tSource::text(\\&quot;Cool Video\\&quot;,(new TextStyle(\\&quot;arial\\&quot;,60))))\\n\\t-&gt;position((new Position())\\n\\t-&gt;gravity(\\n\\tGravity::compass(\\n\\tCompass::south()))\\n-&gt;offsetY(80))\\n\\t-&gt;timeline(\\n\\tTimeline::position()-&gt;startOffset(2.0)\\n-&gt;endOffset(5.0))\\n\\t);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;php&quot;,&quot;framework&quot;:&quot;php&quot;,&quot;language&quot;:&quot;php&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;overlay\\&quot;=&gt;array(\\&quot;font_family\\&quot;=&gt;\\&quot;arial\\&quot;, \\&quot;font_size\\&quot;=&gt;60, \\&quot;text\\&quot;=&gt;\\&quot;Cool%20Video\\&quot;), \\&quot;gravity\\&quot;=&gt;\\&quot;south\\&quot;, \\&quot;y\\&quot;=&gt;80, \\&quot;start_offset\\&quot;=&gt;\\&quot;2\\&quot;, \\&quot;end_offset\\&quot;=&gt;\\&quot;5\\&quot;))&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, array(\\&quot;overlay\\&quot;=&gt;array(\\&quot;font_family\\&quot;=&gt;\\&quot;arial\\&quot;, \\&quot;font_size\\&quot;=&gt;60, \\&quot;text\\&quot;=&gt;\\&quot;Cool%20Video\\&quot;), \\&quot;gravity\\&quot;=&gt;\\&quot;south\\&quot;, \\&quot;y\\&quot;=&gt;80, \\&quot;start_offset\\&quot;=&gt;\\&quot;2\\&quot;, \\&quot;end_offset\\&quot;=&gt;\\&quot;5\\&quot;))&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;PHP&quot;,&quot;packageName&quot;:&quot;cloudinary_php&quot;,&quot;packageStatus&quot;:&quot;legacy&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;java&quot;,&quot;framework&quot;:&quot;java&quot;,&quot;language&quot;:&quot;java&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().overlay(new TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;)).gravity(\\&quot;south\\&quot;).y(80).startOffset(\\&quot;2\\&quot;).endOffset(\\&quot;5\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.url().transformation(new Transformation().overlay(new TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;)).gravity(\\&quot;south\\&quot;).y(80).startOffset(\\&quot;2\\&quot;).endOffset(\\&quot;5\\&quot;)).videoTag(\\&quot;MLB_Vid\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Java&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;ruby&quot;,&quot;framework&quot;:&quot;ruby&quot;,&quot;language&quot;:&quot;ruby&quot;,&quot;rawCodeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, overlay: {font_family: \\&quot;arial\\&quot;, font_size: 60, text: \\&quot;Cool%20Video\\&quot;}, gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cl_video_tag(\\&quot;MLB_Vid\\&quot;, overlay: {font_family: \\&quot;arial\\&quot;, font_size: 60, text: \\&quot;Cool%20Video\\&quot;}, gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Ruby&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;csharp&quot;,&quot;framework&quot;:&quot;csharp&quot;,&quot;language&quot;:&quot;csharp&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Overlay(new TextLayer().FontFamily(\\&quot;arial\\&quot;).FontSize(60).Text(\\&quot;Cool%20Video\\&quot;)).Gravity(\\&quot;south\\&quot;).Y(80).StartOffset(\\&quot;2\\&quot;).EndOffset(\\&quot;5\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.Api.UrlVideoUp.Transform(new Transformation().Overlay(new TextLayer().FontFamily(\\&quot;arial\\&quot;).FontSize(60).Text(\\&quot;Cool%20Video\\&quot;)).Gravity(\\&quot;south\\&quot;).Y(80).StartOffset(\\&quot;2\\&quot;).EndOffset(\\&quot;5\\&quot;)).BuildVideoTag(\\&quot;MLB_Vid\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;.NET&quot;,&quot;packageName&quot;:&quot;CloudinaryDotNet&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;dart&quot;,&quot;framework&quot;:&quot;dart&quot;,&quot;language&quot;:&quot;dart&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Dart&quot;,&quot;packageName&quot;:&quot;cloudinary_dart&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;swift&quot;,&quot;framework&quot;:&quot;swift&quot;,&quot;language&quot;:&quot;swift&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setOverlay(\\&quot;text:arial_60:Cool%20Video\\&quot;).setGravity(\\&quot;south\\&quot;).setY(80).setStartOffset(\\&quot;2\\&quot;).setEndOffset(\\&quot;5\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.createUrl().setResourceType(\\&quot;video\\&quot;).setTransformation(CLDTransformation().setOverlay(\\&quot;text:arial_60:Cool%20Video\\&quot;).setGravity(\\&quot;south\\&quot;).setY(80).setStartOffset(\\&quot;2\\&quot;).setEndOffset(\\&quot;5\\&quot;)).generate(\\&quot;MLB_Vid.mp4\\&quot;)&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;iOS&quot;,&quot;packageName&quot;:&quot;cloudinary&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;5.x&quot;},{&quot;sdkId&quot;:&quot;android&quot;,&quot;framework&quot;:&quot;android&quot;,&quot;language&quot;:&quot;android&quot;,&quot;rawCodeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().overlay(new TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;)).gravity(\\&quot;south\\&quot;).y(80).startOffset(\\&quot;2\\&quot;).endOffset(\\&quot;5\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;codeSnippet&quot;:&quot;MediaManager.get().url().transformation(new Transformation().overlay(new TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;)).gravity(\\&quot;south\\&quot;).y(80).startOffset(\\&quot;2\\&quot;).endOffset(\\&quot;5\\&quot;)).resourceType(\\&quot;video\\&quot;).generate(\\&quot;MLB_Vid.mp4\\&quot;);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Android&quot;,&quot;packageName&quot;:&quot;cloudinary-android&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;3.x&quot;},{&quot;sdkId&quot;:&quot;flutter&quot;,&quot;framework&quot;:&quot;flutter&quot;,&quot;language&quot;:&quot;flutter&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\\&quot;));&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video(&#039;MLB_Vid.mp4&#039;).transformation(Transformation()\\n\\t.addTransformation(\\&quot;l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\\&quot;));&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Flutter&quot;,&quot;packageName&quot;:&quot;cloudinary_flutter&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;kotlin&quot;,&quot;framework&quot;:&quot;kotlin&quot;,&quot;language&quot;:&quot;kotlin&quot;,&quot;rawCodeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t overlay(Overlay.source(\\n\\tSource.text(\\&quot;Cool Video\\&quot;,TextStyle(\\&quot;arial\\&quot;,60))) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.south()))\\n offsetY(80) })\\n\\t timeline(\\n\\tTimeline.position() { startOffset(2.0F)\\n endOffset(5.0F) })\\n\\t }) \\n}.generate()&quot;,&quot;codeSnippet&quot;:&quot;cloudinary.video {\\n\\tpublicId(\\&quot;MLB_Vid.mp4\\&quot;)\\n\\t overlay(Overlay.source(\\n\\tSource.text(\\&quot;Cool Video\\&quot;,TextStyle(\\&quot;arial\\&quot;,60))) {\\n\\t position(Position() {\\n\\t gravity(\\n\\tGravity.compass(\\n\\tCompass.south()))\\n offsetY(80) })\\n\\t timeline(\\n\\tTimeline.position() { startOffset(2.0F)\\n endOffset(5.0F) })\\n\\t }) \\n}.generate()&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;Kotlin&quot;,&quot;packageName&quot;:&quot;kotlin-url-gen&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;},{&quot;sdkId&quot;:&quot;jquery&quot;,&quot;framework&quot;:&quot;jquery&quot;,&quot;language&quot;:&quot;jquery&quot;,&quot;rawCodeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {overlay: new cloudinary.TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;), gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;})&quot;,&quot;codeSnippet&quot;:&quot;$.cloudinary.video(\\&quot;MLB_Vid\\&quot;, {overlay: new cloudinary.TextLayer().fontFamily(\\&quot;arial\\&quot;).fontSize(60).text(\\&quot;Cool%20Video\\&quot;), gravity: \\&quot;south\\&quot;, y: 80, start_offset: \\&quot;2\\&quot;, end_offset: \\&quot;5\\&quot;})&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;jQuery&quot;,&quot;packageName&quot;:&quot;cloudinary-jquery&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;2.x&quot;},{&quot;sdkId&quot;:&quot;react_native&quot;,&quot;framework&quot;:&quot;react_native&quot;,&quot;language&quot;:&quot;react_native&quot;,&quot;rawCodeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;codeSnippet&quot;:&quot;new CloudinaryVideo(\\&quot;MLB_Vid.mp4\\&quot;).overlay(\\n  source(text(\\&quot;Cool Video\\&quot;, new TextStyle(\\&quot;arial\\&quot;, 60)))\\n    .position(\\n      new Position()\\n        .gravity(compass(\\&quot;south\\&quot;))\\n        .offsetY(80)\\n    )\\n    .timeline(position().startOffset(\\&quot;2.0\\&quot;).endOffset(\\&quot;5.0\\&quot;))\\n);&quot;,&quot;status&quot;:0,&quot;statusText&quot;:&quot;Ok&quot;,&quot;displayName&quot;:&quot;React Native&quot;,&quot;packageName&quot;:&quot;cloudinary-react-native&quot;,&quot;packageStatus&quot;:&quot;&quot;,&quot;packageVersion&quot;:&quot;1.x&quot;}]\"\n      parsed-url=\"{&quot;url&quot;:&quot;https:\\\/\\\/res.cloudinary.com\\\/demo\\\/video\\\/upload\\\/l_text:arial_60:Cool%20Video,g_south,y_80,so_2,eo_5\\\/MLB_Vid.mp4&quot;,&quot;cloud_name&quot;:&quot;demo&quot;,&quot;host&quot;:&quot;res.cloudinary.com&quot;,&quot;type&quot;:&quot;upload&quot;,&quot;resource_type&quot;:&quot;video&quot;,&quot;transformation&quot;:[{&quot;overlay&quot;:&quot;text:arial_60:Cool Video&quot;,&quot;gravity&quot;:&quot;south&quot;,&quot;y&quot;:&quot;80&quot;,&quot;start_offset&quot;:&quot;2&quot;,&quot;end_offset&quot;:&quot;5&quot;}],&quot;transformation_string&quot;:&quot;l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5&quot;,&quot;url_suffix&quot;:&quot;&quot;,&quot;version&quot;:&quot;&quot;,&quot;secure&quot;:true,&quot;public_id&quot;:&quot;MLB_Vid.mp4&quot;,&quot;extension&quot;:&quot;mp4&quot;,&quot;format&quot;:&quot;mp4&quot;,&quot;format_code&quot;:true,&quot;url_code&quot;:false,&quot;signature&quot;:&quot;&quot;,&quot;private_cdn&quot;:false,&quot;result_asset_type&quot;:&quot;video&quot;}\"\n      with-url=\"true\"\n    >\n      <span class=\"u-visually-hidden\">Loading code examples<\/span>\n    <\/cld-code-widget><video\n      controls\n      muted\n      preload=\"none\"\n      class=\"c-transformed-asset c-transformed-asset--video\"\n      poster=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/l_text:arial_60:Cool%20Video,g_south,y_80,so_2,eo_5\/MLB_Vid.jpg\"\n      \n    >\n      <source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\/vc_h265\/MLB_Vid.mp4\" type=\"video\/mp4; codecs=hevc\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\/vc_vp9\/MLB_Vid.webm\" type=\"video\/webm; codecs=vp9\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\/vc_auto\/MLB_Vid.mp4\" type=\"video\/mp4\">\n<source src=\"https:\/\/res.cloudinary.com\/demo\/video\/upload\/l_text:arial_60:Cool Video,g_south,y_80,so_2,eo_5\/vc_auto\/MLB_Vid.webm\" type=\"video\/webm\">\n    <\/video><\/p>\n<h2>Adaptive Bitrate Streaming<\/h2>\n<p>Cloudinary can deliver videos optimally using a smart technique know as <strong>Adaptive Bitrate Streaming<\/strong>. This is a video delivery technique that adjusts the quality of a video stream in real time according to detected bandwidth and CPU capacity. With adaptive bitrate streaming, videos start quicker, with fewer buffering interruptions, and is delivered at the best possible quality for the current device and network connection, to maximize user experience.<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"JavaScript\" data-shcb-language-slug=\"javascript\"><span><code class=\"hljs language-javascript shcb-wrap-lines\">cloudinary.uploader.upload(<span class=\"hljs-string\">'MLB_Vid.mp4'<\/span>, \n        <span class=\"hljs-function\"><span class=\"hljs-keyword\">function<\/span>(<span class=\"hljs-params\">result<\/span>) <\/span>{<span class=\"hljs-built_in\">console<\/span>.log(result); }, \n        { <span class=\"hljs-attr\">resource_type<\/span>: <span class=\"hljs-string\">\"video\"<\/span>, \n        <span class=\"hljs-attr\">eager<\/span>: &#91;\n            { <span class=\"hljs-attr\">streaming_profile<\/span>: <span class=\"hljs-string\">\"full_hd\"<\/span>, <span class=\"hljs-attr\">format<\/span>: <span class=\"hljs-string\">\"m3u8\"<\/span> }],                                   \n        <span class=\"hljs-attr\">eager_async<\/span>: <span class=\"hljs-literal\">true<\/span>,\n        <span class=\"hljs-attr\">eager_notification_url<\/span>: <span class=\"hljs-string\">\"http:\/\/mywebsite\/upload_completed\"<\/span>,\n        <span class=\"hljs-attr\">public_id<\/span>: <span class=\"hljs-string\">\"my_MLB\"<\/span>});\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">JavaScript<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">javascript<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<p>An eager transformation is initiated during upload. This transformation is an array that takes a streaming profile configuration. The <code>MLB_Vid.mp4<\/code> video is encoded into HLS format using a Full HD streaming profile.<\/p>\n<p>You can learn more about this technique in the <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#adaptive_bitrate_streaming_hls_and_mpeg_dash\">documentation<\/a><\/p>\n<h2>Responsive Videos<\/h2>\n<p>Eliminate stretching or shrinking videos when adapting them for different screen dimensions. Based on the resizing and cropping transformation feature we have seen, you can perform automatic resizing and cropping to fit the graphic design and layout on any device, at any resolution, using Cloudinary\u2019s powerful URL-based transformations.<\/p>\n<h2>Conclusion<\/h2>\n<p>Now is the time to step back and reflect. Compare what you could afford to do with your videos manually and how long it would take, to what you can accomplish with Cloudinary in your arsenal. With Cloudinary, you\u2019ll improve your productivity with its robust features and be able to cater to whatever media management needs you might have. Get started by <a href=\"https:\/\/cloudinary.com\/users\/register\/free\">signing up<\/a> if you haven\u2019t already!<\/p>\n<hr \/>\n<h2>Further Reading on Video Manipulation<\/h2>\n<ul>\n<li>\n<a href=\"https:\/\/cloudinary.com\/video_api\">Video Transcoding\nand Manipulation<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/top_10_mistakes_in_handling_website_videos_and_how_to_solve_them\">Top 10 Mistakes in Handling Website Videos and How to Solve Them<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/how_to_automate_compression_of_video_files_with_one_line_of_code\">How to Compress Video Size Automatically With One Line of Code<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/exoplayer_android_tutorial_easy_video_delivery_and_editing\">ExoPlayer Android Tutorial: Easy Video Delivery and Editing<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/html5_video_player\">Ultimate HTML5 Video Player Showdown: 10 Players Compared<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/how_to_generate_waveform_images_from_audio_files\">How to Generate Waveform Images From Audio Files<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/with_automatic_video_subtitles_silence_speaks_volumes\">Auto Generate Subtitles Based on Video Transcript<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/auto_generate_video_previews_with_great_results_every_time\">Auto-Generate Video Previews with Great Results Every Time<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/html5_video_tags_won_t_do_for_your_videos\">Adaptive HLS Streaming Using the HTML5 Video Tag<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/optimizing_video_with_cloudinary_and_the_html5_video_player_part_1\">Video Optimization With the HTML5 &lt;\\video&gt; Player<\/a>\n<\/li>\n<li>\n<a href=\"https:\/\/cloudinary.com\/blog\/converting_android_videos_to_animated_gif_images_with_cloudinary_a_tutorial\">Converting Android Videos to Animated GIF Images With Cloudinary: A Tutorial<\/a>\n<\/li>\n<\/ul>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":41,"featured_media":21510,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[25,177,303,305],"class_list":["post-21509","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-asset-management","tag-javascript","tag-video","tag-video-api"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.6 (Yoast SEO v26.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Video Management Made Easy with Cloudinary<\/title>\n<meta name=\"description\" content=\"With Cloudinary, you\u2019ll improve your productivity with its robust video features &amp; be able to cater to whatever media management needs you might have.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Video Management Made Easy\" \/>\n<meta property=\"og:description\" content=\"With Cloudinary, you\u2019ll improve your productivity with its robust video features &amp; be able to cater to whatever media management needs you might have.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2017-04-24T16:55:06+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-06-04T23:14:43+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management-jpg?_i=AA\" \/>\n\t<meta property=\"og:image:width\" content=\"1540\" \/>\n\t<meta property=\"og:image:height\" content=\"847\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"NewsArticle\",\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Video Management Made Easy\",\"datePublished\":\"2017-04-24T16:55:06+00:00\",\"dateModified\":\"2024-06-04T23:14:43+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\"},\"wordCount\":4,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA\",\"keywords\":[\"Asset Management\",\"Javascript\",\"Video\",\"Video API\"],\"inLanguage\":\"en-US\",\"copyrightYear\":\"2017\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\",\"url\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\",\"name\":\"Video Management Made Easy with Cloudinary\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA\",\"datePublished\":\"2017-04-24T16:55:06+00:00\",\"dateModified\":\"2024-06-04T23:14:43+00:00\",\"description\":\"With Cloudinary, you\u2019ll improve your productivity with its robust video features & be able to cater to whatever media management needs you might have.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/video_management_made_easy\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA\",\"width\":1540,\"height\":847},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/video_management_made_easy#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Video Management Made Easy\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"name\":\"Cloudinary Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cloudinary.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\",\"name\":\"Cloudinary Blog\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"width\":312,\"height\":60,\"caption\":\"Cloudinary Blog\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Video Management Made Easy with Cloudinary","description":"With Cloudinary, you\u2019ll improve your productivity with its robust video features & be able to cater to whatever media management needs you might have.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cloudinary.com\/blog\/video_management_made_easy","og_locale":"en_US","og_type":"article","og_title":"Video Management Made Easy","og_description":"With Cloudinary, you\u2019ll improve your productivity with its robust video features & be able to cater to whatever media management needs you might have.","og_url":"https:\/\/cloudinary.com\/blog\/video_management_made_easy","og_site_name":"Cloudinary Blog","article_published_time":"2017-04-24T16:55:06+00:00","article_modified_time":"2024-06-04T23:14:43+00:00","og_image":[{"width":1540,"height":847,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management-jpg?_i=AA","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy"},"author":{"name":"","@id":""},"headline":"Video Management Made Easy","datePublished":"2017-04-24T16:55:06+00:00","dateModified":"2024-06-04T23:14:43+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy"},"wordCount":4,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA","keywords":["Asset Management","Javascript","Video","Video API"],"inLanguage":"en-US","copyrightYear":"2017","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy","url":"https:\/\/cloudinary.com\/blog\/video_management_made_easy","name":"Video Management Made Easy with Cloudinary","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA","datePublished":"2017-04-24T16:55:06+00:00","dateModified":"2024-06-04T23:14:43+00:00","description":"With Cloudinary, you\u2019ll improve your productivity with its robust video features & be able to cater to whatever media management needs you might have.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/video_management_made_easy"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA","width":1540,"height":847},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/video_management_made_easy#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Video Management Made Easy"}]},{"@type":"WebSite","@id":"https:\/\/cloudinary.com\/blog\/#website","url":"https:\/\/cloudinary.com\/blog\/","name":"Cloudinary Blog","description":"","publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cloudinary.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cloudinary.com\/blog\/#organization","name":"Cloudinary Blog","url":"https:\/\/cloudinary.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","width":312,"height":60,"caption":"Cloudinary Blog"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":""}]}},"jetpack_featured_media_url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649724374\/Web_Assets\/blog\/Video_Management\/Video_Management.jpg?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21509","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/comments?post=21509"}],"version-history":[{"count":6,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21509\/revisions"}],"predecessor-version":[{"id":34391,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21509\/revisions\/34391"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/21510"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21509"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21509"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21509"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}