{"id":21925,"date":"2019-08-07T16:03:05","date_gmt":"2019-08-07T16:03:05","guid":{"rendered":"http:\/\/easily_customize_and_embed_your_video_player"},"modified":"2023-07-06T16:32:55","modified_gmt":"2023-07-06T23:32:55","slug":"easily_customize_and_embed_your_video_player","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player","title":{"rendered":"Easily Customize and Embed your Video Player"},"content":{"rendered":"<div class=\"wp-block-cloudinary-markdown \"><link href=\"https:\/\/unpkg.com\/cloudinary-video-player@1.2.1\/dist\/cld-video-player.min.css\" \n   rel=\"stylesheet\">\n<script src=\"https:\/\/unpkg.com\/cloudinary-core@2.6.3\/cloudinary-core-shrinkwrap.min.js\" \n   type=\"text\/javascript\"><\/script>\n<script src=\"https:\/\/unpkg.com\/cloudinary-video-player@1.2.1\/dist\/cld-video-player.min.js\" \n   type=\"text\/javascript\"><\/script>\n<p>Steve Forbes, editor of Forbes Magazine, once said, \u201cYour brand is the single most-important investment you can make in your business\u201d. That bold statement is spot on, especially with respect to digital media. Furthermore, consistency in brand experience is crucial for building trust with users.<\/p>\n<p>For videos, the many useful capabilities on Cloudinary\u2019s Dynamic Video Platform, such as <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#adding_image_overlays\">overlays<\/a> and <a href=\"https:\/\/cloudinary.com\/documentation\/video_manipulation_and_delivery#concatenate_videos_with_custom_transitions\">custom video transitions<\/a>, ensure that you stay on brand. But how to do that when playing videos on your site? Play them with the latest version of Cloudinary\u2019s video player, whose multiple customizable features enable you to tailor it to match your brands color scheme and imagery, enhancing the user experience by leaps and bounds.<\/p>\n<p>But, that\u2019s not all, we are launching Cloudinary <a href=\"https:\/\/studio.cloudinary.com\">Video Player Studio<\/a>, complete with a simple, intuitive UI through which you can easily design and customize video players by toggling features or selecting colors, with the auto-generated output conveniently displayed alongside. When your design is a wrap, simply copy and paste the output to <a href=\"https:\/\/cloudinary.com\/glossary\/video-embed\">embed<\/a> it into your site\u2013and you\u2019re good to go. No coding necessary. Be sure to try out Cloudinary Video Player Studio and unlock all the great features of the Cloudinary Video Player while maintaining that all-important brand.<\/p>\n<h2>Tailoring Your Video Experience<\/h2>\n<p>Let\u2019s take a look at how easy it is to match your video player to your brand or add different functionality depending on your use case. First up, the visual appearance.\nIf you just want to keep it simple, you can choose Cloudinary\u2019s predefined dark or light skin themes. These two themes provide a sleek look that can work well with most site designs. Of course, if you really want to tailor it to your brand, you\u2019ll want to use your own color scheme and logo. Lets take the Cloudinary brand as an example and show you how easy it can be done.<\/p>\n<p>The player allows you to configure three colors: base, accent and text. The two colors we will use for the base and accent (alongside a simple white white for the text) are the Cloudinary light blue and orange that you see in our logo:<\/p>\n<div class=\"row\">\n<div class=\"color-wrapper col-xs-5 col-md-3\">\n<div class=\"color-container\">\n<div class=\"color\" style=\"background-color:#0071ba;\"><\/div>\n<p>#0071BA<\/p>\n<\/div>\n<\/div>\n<div class=\"color-wrapper col-xs-5 col-md-3\">\n<div class=\"color-container\">\n<div class=\"color\" style=\"background-color:#db8226;\"><\/div>\n<p>#DB8226<\/p>\n<\/div>\n<\/div>\n<\/div>\n<style>\n  .color-container {  \n    border: solid 1px #bbb;\n    box-shadow: 0 1px 2px #bbb;\n    margin: 0 10px 30px;\n    padding: 3px 3px 0;\n    text-align: center;\n    color: #4d4d4d;\n    font-size: 14px;\n    font-family: \"Roboto\";\n    line-height: 1.429;\n}\n.color {\n   height: 80px;\n}\n<\/style>\n<p><video \nclass=\"cld-video-player cld-video-player-skin-light\"\ndata-cld-public-id=\"elephants\"\ndata-cld-colors='{ \"base\": \"#0071ba\", \"accent\": \"#db8226\", \"text\": \"#fff\" }'\ndata-cld-logo-image-url=\"https:\/\/res.cloudinary.com\/cloudinary\/image\/upload\/b_rgb:ffffff,c_scale,w_200\/v1\/logo\/for_white_bg\/cloudinary_vertical_logo_for_white_bg.png\"\ndata-cld-logo-onclick-url=\"https:\/\/cloudinary.com\/documentation\/cloudinary_video_player\"    \ndata-cld-floating-when-not-visible=\"left\"     \ncontrols\nautoplay\nmuted>\n<\/video><\/p>\n<p>We\u2019ve also swapped the original Cloudinary logo for a slightly different one and updated the link to take you to the video player documentation.<\/p>\n<h2>Floating Some Ideas<\/h2>\n<p>Configuring and customizing your video player to suit your users and all the different video use cases you have is a great way to increase engagement. Did you notice how the video above starts playing automatically and if you scroll down a little further it appears as a floating player in the bottom corner? Great for an article or blog post like this as you can keep watching as you scroll the rest of the page.<\/p>\n<p>If you\u2019re more interested in short product videos to show off all your wares, you\u2019d be more likely to want to strip out the controls, play the video automatically on load and make it repeat. Once again, Cloudinary\u2019s video player can do this super easily.<\/p>\n<p><video \nclass=\"cld-video-player cld-video-player-skin-light\"\ndata-cld-public-id=\"dog\"\nloop\nautoplay\nmuted>\n<\/video><\/p>\n<p>How about a playing a longer video? Maybe a webinar or a lecture you want to post? You\u2019re probably going to want to help your users jump forwards and back by a few seconds and give them the full set of controls to ease their viewing experience. You could even add subtitles and allow your users to toggle them on or off:<\/p>\n<p><video \nid=\"tutorial\"\ndata-cld-show-jump-controls=\"true\"   \ncontrols\nmuted>\n<\/video><\/p>\n<p>You can customize all this functionality by setting a handful of parameters in the JavaScript, but it\u2019s so much easier to just select the options you want using Cloudinary Video Player Studio.<\/p>\n<h2>Step into the Studio and Build Your Player<\/h2>\n<p>Now that you know you can customize your player and add some nice functionality, let\u2019s take a look at how simple this is using the new Cloudinary Video Player Studio.<\/p>\n<h3>Start with the Video<\/h3>\n<p>The video tab is step one. Simply enter your Cloudinary cloud name and the Public ID of the video you want to play in the player. The preview on the right will update so you can take a peek at how it\u2019ll all look once you\u2019re done.<\/p>\n<div class='c-callout  c-callout--inline-title c-callout--tip'><strong class='c-callout__title'>Tip:<\/strong> <p>You can find your cloud name in the Cloudinary Console and use the Media Library to find the Public IDs of your videos.<\/p><\/div>\n<p>Here you can also customize the <a href=\"https:\/\/cloudinary.com\/glossary\/video-posters\">poster image<\/a> that shows before the video plays, the title and subtitle that is displayed with the video or add in some captions\/subtitles.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/image\/upload\/w_700,c_fill,f_auto,q_auto,dpr_2.0\/Web_Assets\/blog\/Screen_Shot_2019-08-05_at_8.22.09_AM.png\" alt=\"Video tab\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"1400\" height=\"716\"\/><\/p>\n<h3>Customize it the Visual Way<\/h3>\n<p>The customization tab is all about tweaking the visual appearance of the player and ensuring it matches that all important brand. This is where you can set your three colors for the player (or pick a skin theme), choose whether you want a fixed size for your player or one that is responsive, as well as updating the font and logo.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/image\/upload\/w_700,c_fill,f_auto,q_auto,dpr_2.0\/Web_Assets\/blog\/Screen_Shot_2019-08-05_at_8.22.29_AM.png\" alt=\"Customization tab\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"1400\" height=\"716\"\/><\/p>\n<h3>Advance your Video Player Customizations<\/h3>\n<p>The final tab is where you\u2019ll find some of the more advanced customizations, including whether to show the player controls, add in the jump back and forward buttons and whether to trigger a floating player when it\u2019s scrolled out of view.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/image\/upload\/w_700,c_fill,f_auto,q_auto,dpr_2.0\/Web_Assets\/blog\/Screen_Shot_2019-08-05_at_8.22.46_AM.png\" alt=\"Advanced tab\" loading=\"lazy\" class=\"c-transformed-asset\"  width=\"1400\" height=\"716\"\/><\/p>\n<h3>Time for Embed<\/h3>\n<p>Cloudinary Video Player Studio makes it really easy to embed the video player in your website. Just copy the iframe code from the embed tab and paste into your web page source file at the location you want it to display. If you\u2019ve selected a responsive player, it\u2019ll even adjust the size perfectly for all the different screen sizes. If you\u2019re used to using the JavaScript then you can copy that instead, have a look at the <a href=\"https:\/\/cloudinary.com\/documentation\/video_player_how_to_embed\">documentation<\/a> for more on how to embed using JavaScript.<\/p>\n<p>Here\u2019s an example of how your embed iframe code might look:<\/p>\n<pre class=\"js-syntax-highlighted\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"HTML, XML\" data-shcb-language-slug=\"xml\"><span><code class=\"hljs language-xml shcb-wrap-lines\"><span class=\"hljs-tag\">&lt;<span class=\"hljs-name\">iframe<\/span>\n  <span class=\"hljs-attr\">src<\/span>=<span class=\"hljs-string\">\"https:\/\/player.cloudinary.com\/embed\/?cloud_name=demo&amp;public_id=elephants&amp;fluid=true&amp;controls=true&amp;colors%5Bbase%5D=%230071ba&amp;colors%5Baccent%5D=%23db8226\"<\/span>\n  <span class=\"hljs-attr\">width<\/span>=<span class=\"hljs-string\">\"640\"<\/span>\n  <span class=\"hljs-attr\">height<\/span>=<span class=\"hljs-string\">\"480\"<\/span>\n  <span class=\"hljs-attr\">allow<\/span>=<span class=\"hljs-string\">\"autoplay; fullscreen; encrypted-media; picture-in-picture\"<\/span>\n  <span class=\"hljs-attr\">allowfullscreen<\/span>\n  <span class=\"hljs-attr\">frameborder<\/span>=<span class=\"hljs-string\">\"0\"<\/span>\n&gt;<\/span><span class=\"hljs-tag\">&lt;\/<span class=\"hljs-name\">iframe<\/span>&gt;<\/span>\n<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">HTML, XML<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">xml<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n<h2>Get Designing<\/h2>\n<p>There you have it. The Cloudinary Video Player offers loads of customization options for fitting your video player to your brand and all your video use-cases; all with super-simple and super-quick UI configuration options using the <a href=\"https:\/\/studio.cloudinary.com\">Cloudinary Video Player Studio<\/a>.<\/p>\n<p>Go ahead, start designing your video player to suit your needs. Give your users the best video experience and keep your branding consistent throughout your media delivery.<\/p>\n<script>\n     var cld = cloudinary.Cloudinary.new({ cloud_name: 'demo' });\n\n      \/\/ Initialize players\n      var players = cld.videoPlayers('.cld-video-player', {\n        transformation: { width: 500, crop: 'limit' },\n        colors: { base: \"#0071ba\", accent: \"#db8226\", text: \"#fff\" }\n      });\n\n  var tutorialPlayer = cld.videoPlayer('tutorial').width(500);\n\n  tutorialPlayer.source('docs\/intro-video-cloudinary', {\n      textTracks: {\n        captions: {\n          label: 'English captions',\n          language: 'en',\n          default: true,\n          url: 'https:\/\/res.cloudinary.com\/demo\/raw\/upload\/docs\/tutorial.vtt'\n        }\n      }\n  });\n\n<\/script>\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":41,"featured_media":21926,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-21925","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"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>Customize your video player with Cloudinary Studio<\/title>\n<meta name=\"description\" content=\"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.\" \/>\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\/easily_customize_and_embed_your_video_player\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Easily Customize and Embed your Video Player\" \/>\n<meta property=\"og:description\" content=\"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2019-08-07T16:03:05+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-06T23:32:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b-jpg?_i=AA\" \/>\n\t<meta property=\"og:image:width\" content=\"2000\" \/>\n\t<meta property=\"og:image:height\" content=\"1100\" \/>\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\/easily_customize_and_embed_your_video_player#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Easily Customize and Embed your Video Player\",\"datePublished\":\"2019-08-07T16:03:05+00:00\",\"dateModified\":\"2023-07-06T23:32:55+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\"},\"wordCount\":7,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA\",\"inLanguage\":\"en-US\",\"copyrightYear\":\"2019\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\",\"url\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\",\"name\":\"Customize your video player with Cloudinary Studio\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA\",\"datePublished\":\"2019-08-07T16:03:05+00:00\",\"dateModified\":\"2023-07-06T23:32:55+00:00\",\"description\":\"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA\",\"width\":2000,\"height\":1100},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Easily Customize and Embed your Video Player\"}]},{\"@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":"Customize your video player with Cloudinary Studio","description":"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.","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\/easily_customize_and_embed_your_video_player","og_locale":"en_US","og_type":"article","og_title":"Easily Customize and Embed your Video Player","og_description":"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.","og_url":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player","og_site_name":"Cloudinary Blog","article_published_time":"2019-08-07T16:03:05+00:00","article_modified_time":"2023-07-06T23:32:55+00:00","og_image":[{"width":2000,"height":1100,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b-jpg?_i=AA","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player"},"author":{"name":"","@id":""},"headline":"Easily Customize and Embed your Video Player","datePublished":"2019-08-07T16:03:05+00:00","dateModified":"2023-07-06T23:32:55+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player"},"wordCount":7,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA","inLanguage":"en-US","copyrightYear":"2019","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player","url":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player","name":"Customize your video player with Cloudinary Studio","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA","datePublished":"2019-08-07T16:03:05+00:00","dateModified":"2023-07-06T23:32:55+00:00","description":"Learn how to design, customize and embed your video player with ease, using Cloudinary Video Player Studio.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA","width":2000,"height":1100},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/easily_customize_and_embed_your_video_player#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Easily Customize and Embed your Video Player"}]},{"@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\/v1649734903\/Web_Assets\/blog\/Video-Player-Studio-2000x1100-v2a_219269371b\/Video-Player-Studio-2000x1100-v2a_219269371b.jpg?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21925","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=21925"}],"version-history":[{"count":6,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21925\/revisions"}],"predecessor-version":[{"id":30096,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21925\/revisions\/30096"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/21926"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21925"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21925"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21925"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}