YouTube Embedded Players and Player Parameters | YouTube IFrame Player API

<!doctype html> <html lang="en" dir="ltr"> <head><script type="text/javascript" src="https://web-static.archive.org/_static/js/bundle-playback.js?v=7YQSqjSh" charset="utf-8"></script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="https://web-static.archive.org/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("https://developers.google.com/youtube/player_parameters","20230130013753","https://web.archive.org/","web","https://web-static.archive.org/_static/", "1675042673"); </script> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/banner-styles.css?v=p7PEIJWi" /> <link rel="stylesheet" type="text/css" href="https://web-static.archive.org/_static/css/iconochive.css?v=3PDvdIFv" />  <meta name="google-signin-client-id" content="721724668570-nbkv1cfusk7kk4eni4pjvepaus73b13t.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Google Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#ff0000"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/web/20230130013753/https://developers.google.com/_pwa/developers/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//web.archive.org/web/20230130013753/https://www.gstatic.com/" crossorigin> <link rel="preconnect" href="//web.archive.org/web/20230130013753/https://fonts.gstatic.com/" crossorigin> <link rel="preconnect" href="//web.archive.org/web/20230130013753/https://fonts.googleapis.com/" crossorigin> <link rel="preconnect" href="//web.archive.org/web/20230130013753/https://apis.google.com/" crossorigin> <link rel="preconnect" href="//web.archive.org/web/20230130013753/https://www.google-analytics.com/" crossorigin><link rel="stylesheet" href="//web.archive.org/web/20230130013753cs_/https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//web.archive.org/web/20230130013753cs_/https://fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=block"><link rel="stylesheet" href="https://web.archive.org/web/20230130013753cs_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/css/app.css"> <link rel="shortcut icon" href="https://web.archive.org/web/20230130013753im_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/favicon.png"> <link rel="apple-touch-icon" href="https://web.archive.org/web/20230130013753im_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/touchicon-180.png"><link rel="canonical" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters"><link rel="search" type="application/opensearchdescription+xml" title="Google Developers" href="https://web.archive.org/web/20230130013753/https://developers.google.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters"/><link rel="alternate" hreflang="x-default" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters"/><link rel="alternate" hreflang="zh-Hans" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=zh-cn"/><link rel="alternate" hreflang="fr" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=fr"/><link rel="alternate" hreflang="de" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=de"/><link rel="alternate" hreflang="it" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=it"/><link rel="alternate" hreflang="ja" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=ja"/><link rel="alternate" hreflang="ko" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=ko"/><link rel="alternate" hreflang="pl" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=pl"/><link rel="alternate" hreflang="pt-BR" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=pt-br"/><link rel="alternate" hreflang="ru" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=ru"/><link rel="alternate" hreflang="es" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=es"/><link rel="alternate" hreflang="tr" href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters?hl=tr"/><title>YouTube Embedded Players and Player Parameters  |  YouTube IFrame Player API  |  Google Developers</title> <meta property="og:title" content="YouTube Embedded Players and Player Parameters | YouTube IFrame Player API | Google Developers"><meta property="og:url" content="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters"><meta property="og:image" content="https://web.archive.org/web/20230130013753im_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/opengraph/youtube-theme.png"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="675"><meta property="og:locale" content="en"><meta name="twitter:card" content="summary_large_image"><script type="application/ld+json"> { "@context": "https://web.archive.org/web/20230130013753/https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "YouTube", "item": "https://web.archive.org/web/20230130013753/https://developers.google.com/youtube" },{ "@type": "ListItem", "position": 2, "name": "IFrame Player API", "item": "https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" },{ "@type": "ListItem", "position": 3, "name": "YouTube Embedded Players and Player Parameters", "item": "https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/player_parameters" }] } </script> <link rel="stylesheet" href="/web/20230130013753cs_/https://developers.google.com/extras.css"></head> <body class="" template="page" theme="youtube-theme" type="reference" layout="docs" pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"><devsite-header> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube"> <div class="devsite-product-logo-container" size="medium"> <img class="devsite-product-logo" alt="YouTube" src="https://web.archive.org/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-youtube.svg" srcset="" sizes="64px" loading="lazy"> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" aria-label="Product breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="YouTube"> YouTube </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="YouTube IFrame Player API"> IFrame Player API </a> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> </div> <devsite-search aria-expanded="false" aria-haspopup="listbox" enable-signin enable-search enable-suggestions enable-query-completion project-name="YouTube IFrame Player API" tenant-name="Google Developers" project-scope="/youtube/iframe_api_reference" url-scoped="https://developers.google.com/s/results/youtube/iframe_api_reference" role="combobox"> <form class="devsite-search-form" action="https://web.archive.org/web/20230130013753/https://developers.google.com/s/results" method="GET"> <div class="devsite-search-container"> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-haspopup="false" aria-multiline="false" aria-label="Search box" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="searchbox" type="text" value=""> <div class="devsite-search-image material-icons" aria-hidden="true"></div> </div> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en">English</a> </li> <li role="presentation"> <a role="menuitem" lang="id">Bahasa Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="de">Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es">Español</a> </li> <li role="presentation"> <a role="menuitem" lang="fr">Français</a> </li> <li role="presentation"> <a role="menuitem" lang="it">Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl">Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br">Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="tr">Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru">Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn">中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="ja">日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko">한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles fp-auth id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab active> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" track-metadata-eventdetail="https://developers.google.com/youtube/iframe_api_reference" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - reference" track-metadata-module="primary nav" aria-label="Reference, selected" data-category="Site-Wide Custom Events" data-label="Tab: Reference" track-name="reference"> Reference </a> </tab> <tab> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/youtube_player_demo" track-metadata-eventdetail="https://developers.google.com/youtube/youtube_player_demo" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - samples" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Samples" track-name="samples"> Samples </a> </tab> <tab> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/players/support" track-metadata-eventdetail="https://developers.google.com/youtube/players/support" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - support" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support"> Support </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars> <div class="devsite-book-nav-filter "> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube"> <div class="devsite-product-logo-container" size="medium"> <img class="devsite-product-logo" alt="YouTube" src="https://web.archive.org/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-youtube.svg" srcset="" sizes="64px" loading="lazy"> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" aria-label="Upper header breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="YouTube"> YouTube </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="YouTube IFrame Player API"> IFrame Player API </a> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Reference" track-name="reference" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Reference" track-type="navMenu" track-metadata-eventdetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip> Reference </span> <span class="devsite-nav-icon material-icons" data-icon="forward"> </span> </a> </li> <li class="devsite-nav-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/youtube_player_demo" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Samples" track-name="samples" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Samples" track-type="navMenu" track-metadata-eventdetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip> Samples </span> </a> </li> <li class="devsite-nav-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/players/support" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Support" track-type="navMenu" track-metadata-eventdetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip> Support </span> <span class="devsite-nav-icon material-icons" data-icon="forward"> </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom" role="navigation"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item"><a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /youtube/iframe_api_reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/youtube/iframe_api_reference"><span class="devsite-nav-text" tooltip>IFrame API</span></a></li> <li class="devsite-nav-item"><a href="/web/20230130013753/https://developers.google.com/youtube/player_parameters" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /youtube/player_parameters" track-type="bookNav" track-name="click" track-metadata-eventdetail="/youtube/player_parameters"><span class="devsite-nav-text" tooltip>Player Parameters</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Mobile APIs</span> </div></li> <li class="devsite-nav-item devsite-nav-external"><a href="/web/20230130013753/https://developers.google.com/youtube/players/android_player_api" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /youtube/players/android_player_api" track-type="bookNav" track-name="click" track-metadata-eventdetail="/youtube/players/android_player_api"><span class="devsite-nav-text" tooltip>Android Player API</span><span class="devsite-nav-icon material-icons" data-icon="external" data-title="External" aria-hidden="true"></span></a></li> <li class="devsite-nav-item"><a href="/web/20230130013753/https://developers.google.com/youtube/v3/guides/ios_youtube_helper" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /youtube/v3/guides/ios_youtube_helper" track-type="bookNav" track-name="click" track-metadata-eventdetail="/youtube/v3/guides/ios_youtube_helper"><span class="devsite-nav-text" tooltip>iOS Helper Library</span></a></li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" has-book-nav has-sidebar> <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars></devsite-toc> <devsite-recommendations-sidebar class="nocontent devsite-nav"> </devsite-recommendations-sidebar> </div> </div> <devsite-content> <article class="devsite-article"> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail=""> Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/products" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail=""> Products </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="YouTube"> YouTube </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="YouTube IFrame Player API"> IFrame Player API </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <h1 class="devsite-page-title">YouTube Embedded Players and Player Parameters</h1><devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded> </devsite-toc> <devsite-recommendations-dropdown class="nocontent"></devsite-recommendations-dropdown> <div class="devsite-article-body clearfix "> <div itemscope itemtype="http://developers.google.com/ReferenceObject"> <meta itemprop="name" content="Player Parameters"/> <h2 id="Overview" data-text="Overview">Overview</h2> <p>This document explains how to embed a YouTube player in your application and also defines the parameters that are available in the YouTube embedded player.</p> <p>By appending parameters to the IFrame URL, you can customize the playback experience in your application. For example, you can automatically play videos using the <code class="notranslate" dir="ltr"><a href="#autoplay">autoplay</a></code> parameter or cause a video to play repeatedly using the <code class="notranslate" dir="ltr"><a href="#loop">loop</a></code> parameter. You can also use the <code class="notranslate" dir="ltr"><a href="#enablejsapi">enablejsapi</a></code> parameter to enable the player to be controlled via the <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame Player API</a>.</p> <p>This page currently defines all parameters supported in <span id="first_change_text">any YouTube embedded player</span>. Each parameter definition identifies the players that support the corresponding parameter.</p> <p class="note"><strong>Note:</strong> Embedded players must have a viewport that is at least 200px by 200px. If the player displays controls, it must be large enough to fully display the controls without shrinking the viewport below the minimum size. We recommend 16:9 players be at least 480 pixels wide and 270 pixels tall.</p> <h2 id="Embedding_a_Player" data-text="Embed a YouTube player">Embed a YouTube player</h2> <p>You can use any of the following methods to embed a YouTube player in your application and specify player parameters. Note that the instructions below demonstrate how to embed a player that loads a single video. The following section explains how to configure your player to load a playlist or a user's uploaded videos.</p> <h3 id="Manual_IFrame_Embeds" data-text="Embed a player using an <iframe> tag">Embed a player using an <code class="notranslate" dir="ltr"><iframe></code> tag</h3> <p>Define an <code class="notranslate" dir="ltr"><iframe></code> tag in your application in which the <code class="notranslate" dir="ltr">src</code> URL specifies the content that the player will load as well as any other player parameters you want to set. The <code class="notranslate" dir="ltr"><iframe></code> tag's <code class="notranslate" dir="ltr">height</code> and <code class="notranslate" dir="ltr">width</code> parameters specify the dimensions of the player.</p> <p>If you create the <code class="notranslate" dir="ltr"><iframe></code> element yourself (rather than using the IFrame Player API to create it), you can append player parameters directly to the end of the URL. The URL has the following format:</p> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed/<strong>VIDEO_ID</strong></pre> <p>The <code class="notranslate" dir="ltr"><iframe></code> tag below would load a 640x360px player that would play the YouTube video <code class="notranslate" dir="ltr">M7lc1UVf-VE</code>. Since the URL sets the <code class="notranslate" dir="ltr">autoplay</code> parameter to <code class="notranslate" dir="ltr">1</code>, the video would play automatically once the player has loaded.</p> <pre class="notranslate" dir="ltr"> <iframe id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1&origin=http://example.com" frameborder="0"></iframe> </pre> <h3 id="IFrame_Player_API" data-text="Embed a player using the IFrame Player API">Embed a player using the IFrame Player API</h3> <p>Follow the <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player">IFrame Player API instructions</a> to insert a video player in your web page or application after the Player API's JavaScript code has loaded. The second parameter in the constructor for the video player is an object that specifies player options. Within that object, the <code class="notranslate" dir="ltr">playerVars</code> property identifies player parameters.</p> <p>The HTML and JavaScript code below shows a simple example that inserts a YouTube player into the page element that has an <code class="notranslate" dir="ltr">id</code> value of <code class="notranslate" dir="ltr">ytplayer</code>. The <code class="notranslate" dir="ltr">onYouTubePlayerAPIReady()</code> function specified here is called automatically when the IFrame Player API code has loaded. This code does not define any player parameters and also does not define other event handlers.</p> <pre class="notranslate" dir="ltr"> <div id="ytplayer"></div> <script> // Load the IFrame Player API code asynchronously. var tag = document.createElement('script'); tag.src = "https://www.youtube.com/player_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); // Replace the 'ytplayer' element with an <iframe> and // YouTube player after the API code downloads. var player; function onYouTubePlayerAPIReady() { player = new YT.Player('ytplayer', { height: '360', width: '640', videoId: 'M7lc1UVf-VE' }); } </script> </pre> <h2 id="Selecting_Content_to_Play" data-text="Select content to play">Select content to play</h2> <p>You can configure your embedded player to load a video, a playlist, or a user's uploaded videos.</p> <p>The following list explains these options:</p> <ul> <li> <p><strong>Loading a video</strong></p> <p>For an IFrame embed, the YouTube video ID for the video that you want to load is specified in the IFrame's <code class="notranslate" dir="ltr">src</code> URL.</p> <pre translate="no" dir="ltr">https://www.youtube.com/embed/<strong>VIDEO_ID</strong></pre> <p>If you are using the YouTube Data API (v3), you can programmatically construct these URLs by retrieving video IDs from <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/search#resource">search results</a>, <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/playlistItems#resource">playlist item resources</a>, <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/videos#resource">video resources</a>, or other resources. After obtaining a video ID, replace the <code class="notranslate" dir="ltr">VIDEO_ID</code> text in the URLs above with that value to create the player URL.</p> </li> <li> <p><strong>Loading a playlist</strong></p> <p>Set the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> player parameter to <code class="notranslate" dir="ltr">playlist</code>. In addition, set the <code class="notranslate" dir="ltr"><a href="#list">list</a></code> player parameter to the YouTube playlist ID that you want to load.</p> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed?listType=playlist&list=<strong>PLAYLIST_ID</strong></pre> <p>Note that you need to prepend the playlist ID with the letters <code class="notranslate" dir="ltr">PL</code> as shown in the following example:</p> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed?listType=playlist&list=<strong>PLC77007E23FF423C6</strong></pre> <p>If you are using the YouTube Data API (v3), you can programmatically construct these URLs by retrieving playlist IDs from <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/search#resource">search results</a>, <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/channels#contentDetails.relatedPlaylists">channel resources</a>, or <a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/activities#resource">activity resources</a>. After obtaining a playlist ID, replace the <code class="notranslate" dir="ltr">PLAYLIST_ID</code> text in the URL above with that value.</p> </li> <li> <p><strong>Loading a user's uploaded videos</strong></p> <p>Set the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> player parameter to <code class="notranslate" dir="ltr">user_uploads</code>. In addition, set the <code class="notranslate" dir="ltr"><a href="#list">list</a></code> player parameter to the YouTube username whose uploaded videos you want to load.</p> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed?listType=user_uploads&list=<strong>USERNAME</strong></pre> </li> </ul> <h2 id="Parameters" data-text="Supported parameters">Supported parameters</h2> <p>All of the following parameters are optional.</p> <table class="details responsive"> <thead> <tr> <th colspan="2">Parameters</th> </tr> </thead> <tbody> <tr> <td> <h3 id="autoplay" data-text="autoplay"><code class="notranslate" itemprop="property" dir="ltr">autoplay</code></h3> </td> <td> This parameter specifies whether the initial video will automatically start to play when the player loads. Supported values are <code class="notranslate" dir="ltr">0</code> or <code class="notranslate" dir="ltr">1</code>. The default value is <code class="notranslate" dir="ltr">0</code>.<br><br> If you enable Autoplay, playback will occur without any user interaction with the player; playback data collection and sharing will therefore occur upon page load. </td> </tr> <tr> <td> <h3 id="cc_lang_pref" data-text="cc_lang_pref"><code class="notranslate" itemprop="property" dir="ltr">cc_lang_pref</code></h3> </td> <td> This parameter specifies the default language that the player will use to display captions. Set the parameter's value to an <a href="https://web.archive.org/web/20230130013753/http://www.loc.gov/standards/iso639-2/php/code_list.php" target="_blank">ISO 639-1 two-letter language code</a>.<br/><br/>If you use this parameter and also set the <code class="notranslate" dir="ltr"><a href="#cc_load_policy">cc_load_policy</a></code> parameter to <code class="notranslate" dir="ltr">1</code>, then the player will show captions in the specified language when the player loads. If you do not also set the <code class="notranslate" dir="ltr"><a href="#cc_load_policy">cc_load_policy</a></code> parameter, then captions will not display by default, but will display in the specified language if the user opts to turn captions on. </td> </tr> <tr> <td> <h3 id="cc_load_policy" data-text="cc_load_policy"><code class="notranslate" itemprop="property" dir="ltr">cc_load_policy</code></h3> </td> <td> Setting the parameter's value to <code class="notranslate" dir="ltr">1</code> causes closed captions to be shown by default, even if the user has turned captions off. The default behavior is based on user preference. </td> </tr> <tr> <td> <h3 id="color" data-text="color"><code class="notranslate" itemprop="property" dir="ltr">color</code></h3> </td> <td> This parameter specifies the color that will be used in the player's video progress bar to highlight the amount of the video that the viewer has already seen. Valid parameter values are <code class="notranslate" dir="ltr">red</code> and <code class="notranslate" dir="ltr">white</code>, and, by default, the player uses the color red in the video progress bar. See the <a href="https://web.archive.org/web/20230130013753/http://youtube-eng.blogspot.com/2011/08/coming-soon-dark-player-for-embeds_5.html">YouTube API blog</a> for more information about color options.<br/><br/><strong>Note:</strong> Setting the <code class="notranslate" dir="ltr">color</code> parameter to <code class="notranslate" dir="ltr">white</code> will disable the <code class="notranslate" dir="ltr"><a href="#modestbranding">modestbranding</a></code> option. </td> </tr> <tr> <td> <h3 id="controls" data-text="controls"><code class="notranslate" itemprop="property" dir="ltr">controls</code></h3> </td> <td> This parameter indicates whether the video player controls are displayed: <p><ul> <li><code class="notranslate" dir="ltr">controls=0</code> – Player controls do not display in the player.</li> <li><code class="notranslate" dir="ltr">controls=1</code> (default) – Player controls display in the player.</li> </ul></p> </dd> </td> </tr> <tr> <td> <h3 id="disablekb" data-text="disablekb"><code class="notranslate" itemprop="property" dir="ltr">disablekb</code></h3> </td> <td> Setting the parameter's value to <code class="notranslate" dir="ltr">1</code> causes the player to not respond to keyboard controls. The default value is <code class="notranslate" dir="ltr">0</code>, which means that keyboard controls are enabled. Currently supported keyboard controls are: <p><ul> <li>Spacebar or [k]: Play / Pause</li> <li>Arrow Left: Jump back 5 seconds in the current video</li> <li>Arrow Right: Jump ahead 5 seconds in the current video</li> <li>Arrow Up: Volume up</li> <li>Arrow Down: Volume Down</li> <li>[f]: Toggle full-screen display</li> <li>[j]: Jump back 10 seconds in the current video</li> <li>[l]: Jump ahead 10 seconds in the current video</li> <li>[m]: Mute or unmute the video</li> <li>[0-9]: Jump to a point in the video. <code translate="no" dir="ltr">0</code> jumps to the beginning of the video, <code translate="no" dir="ltr">1</code> jumps to the point 10% into the video, <code translate="no" dir="ltr">2</code> jumps to the point 20% into the video, and so forth.</li> </ul></p> </td> </tr> <tr> <td> <h3 id="enablejsapi" data-text="enablejsapi"><code class="notranslate" itemprop="property" dir="ltr">enablejsapi</code></h3> </td> <td> Setting the parameter's value to <code class="notranslate" dir="ltr">1</code> enables the player to be controlled via <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame</a> Player API calls. The default value is <code class="notranslate" dir="ltr">0</code>, which means that the player cannot be controlled using that API.<br><br>For more information on the IFrame API and how to use it, see the <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame API documentation</a>. </td> </tr> <tr> <td> <h3 id="end" data-text="end"><code class="notranslate" itemprop="property" dir="ltr">end</code></h3> </td> <td> This parameter specifies the time, measured in seconds from the start of the video, when the player should stop playing the video. The parameter value is a positive integer.<br><br>Note that the time is measured from the beginning of the video and not from either the value of the <code class="notranslate" dir="ltr">start</code> player parameter or the <code class="notranslate" dir="ltr">startSeconds</code> parameter, which is used in YouTube Player API functions for loading or queueing a video. </td> </tr> <tr> <td> <h3 id="fs" data-text="fs"><code class="notranslate" itemprop="property" dir="ltr">fs</code></h3> </td> <td> Setting this parameter to <code class="notranslate" dir="ltr">0</code> prevents the fullscreen button from displaying in the player. The default value is <code class="notranslate" dir="ltr">1</code>, which causes the fullscreen button to display. </td> </tr> <tr> <td> <h3 id="hl" data-text="hl"><code class="notranslate" itemprop="property" dir="ltr">hl</code></h3> </td> <td> Sets the player's interface language. The parameter value is an <a href="https://web.archive.org/web/20230130013753/http://www.loc.gov/standards/iso639-2/php/code_list.php">ISO 639-1 two-letter language code</a> or a fully specified locale. For example, <code translate="no" dir="ltr">fr</code> and <code translate="no" dir="ltr">fr-ca</code> are both valid values. Other language input codes, such as IETF language tags (BCP 47) might also be handled properly.<br/><br/>The interface language is used for tooltips in the player and also affects the default caption track. Note that YouTube might select a different caption track language for a particular user based on the user's individual language preferences and the availability of caption tracks. </td> </tr> <tr> <td> <h3 id="iv_load_policy" data-text="iv_load_policy"><code class="notranslate" itemprop="property" dir="ltr">iv_load_policy</code></h3> </td> <td> Setting the parameter's value to <code class="notranslate" dir="ltr">1</code> causes video annotations to be shown by default, whereas setting to <code class="notranslate" dir="ltr">3</code> causes video annotations to not be shown by default. The default value is <code class="notranslate" dir="ltr">1</code>. </td> </tr> <tr> <td> <h3 id="list" data-text="list"><code class="notranslate" itemprop="property" dir="ltr">list</code></h3> </td> <td> The <code class="notranslate" dir="ltr">list</code> parameter, in conjunction with the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> parameter, identifies the content that will load in the player. <p><ul> <li>If the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> parameter value is <code class="notranslate" dir="ltr">user_uploads</code>, then the <code class="notranslate" dir="ltr">list</code> parameter value identifies the YouTube channel whose uploaded videos will be loaded.</li> <li>If the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> parameter value is <code class="notranslate" dir="ltr">playlist</code>, then the <code class="notranslate" dir="ltr">list</code> parameter value specifies a YouTube playlist ID. In the parameter value, you need to prepend the playlist ID with the letters <code class="notranslate" dir="ltr">PL</code> as shown in the example below.<br/> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed?<br>    listType=playlist<br>    &list=PLC77007E23FF423C6</pre></li> <li>If the <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> parameter value is <code class="notranslate" dir="ltr">search</code>, then the <code class="notranslate" dir="ltr">list</code> parameter value specifies the search query. <span style="color: red"><b>Note:</b> This functionality is <a href="#release_notes_10_13_2020">deprecated</a> and will no longer be supported as of <nobr>15 November 2020</nobr>.</span></li> </ul> <strong>Note:</strong> If you specify values for the <code class="notranslate" dir="ltr">list</code> and <code class="notranslate" dir="ltr">listType</code> parameters, the IFrame embed URL does not need to specify a video ID.<br/><br/> </td> </tr> <tr> <td> <h3 id="listType" data-text="listType"><code class="notranslate" itemprop="property" dir="ltr">listType</code></h3> </td> <td> The <code class="notranslate" dir="ltr">listType</code> parameter, in conjunction with the <code class="notranslate" dir="ltr"><a href="#list">list</a></code> parameter, identifies the content that will load in the player. Valid parameter values are <code class="notranslate" dir="ltr">playlist</code> and <code class="notranslate" dir="ltr">user_uploads</code>.<br/><br/>If you specify values for the <code class="notranslate" dir="ltr"><a href="#list">list</a></code> and <code class="notranslate" dir="ltr">listType</code> parameters, the IFrame embed URL does not need to specify a video ID. <br><br><span style="color: red"><b>Note:</b> A third parameter value, <code class="notranslate" dir="ltr">search</code>, has been <a href="#release_notes_10_13_2020">deprecated</a> and will no longer be supported as of <nobr>15 November 2020</nobr>.</span> </td> </tr> <tr> <td> <h3 id="loop" data-text="loop"><code class="notranslate" itemprop="property" dir="ltr">loop</code></h3> </td> <td> In the case of a single video player, a setting of <code class="notranslate" dir="ltr">1</code> causes the player to play the initial video again and again. In the case of a playlist player (or custom player), the player plays the entire playlist and then starts again at the first video.<br/><br/> Supported values are <code class="notranslate" dir="ltr">0</code> and <code class="notranslate" dir="ltr">1</code>, and the default value is <code class="notranslate" dir="ltr">0</code>.<br><br><strong>Note:</strong> This parameter has limited support in IFrame embeds. To loop a single video, set the <code class="notranslate" dir="ltr">loop</code> parameter value to <code class="notranslate" dir="ltr">1</code> and set the <code class="notranslate" dir="ltr"><a href="#playlist">playlist</a></code> parameter value to the same video ID already specified in the Player API URL:<br/> <pre class="notranslate" dir="ltr">https://www.youtube.com/embed/<strong>VIDEO_ID</strong>?playlist=<strong>VIDEO_ID</strong>&loop=1</pre> </td> </tr> <tr> <td> <h3 id="modestbranding" data-text="modestbranding"><code class="notranslate" itemprop="property" dir="ltr">modestbranding</code></h3> </td> <td> This parameter lets you use a YouTube player that does not show a YouTube logo. Set the parameter value to <code class="notranslate" dir="ltr">1</code> to prevent the YouTube logo from displaying in the control bar. Note that a small <code class="notranslate" dir="ltr">YouTube</code> text label will still display in the upper-right corner of a paused video when the user's mouse pointer hovers over the player. </td> </tr> <tr> <td> <h3 id="origin" data-text="origin"><code class="notranslate" itemprop="property" dir="ltr">origin</code></h3> </td> <td> This parameter provides an extra security measure for the IFrame API and is only supported for IFrame embeds. If you are using the IFrame API, which means you are setting the <code class="notranslate" dir="ltr"><a href="#enablejsapi">enablejsapi</a></code> parameter value to <code class="notranslate" dir="ltr">1</code>, you should always specify your domain as the <code class="notranslate" dir="ltr">origin</code> parameter value. </td> </tr> <tr> <td> <h3 id="playlist" data-text="playlist"><code class="notranslate" itemprop="property" dir="ltr">playlist</code></h3> </td> <td> This parameter specifies a comma-separated list of video IDs to play. If you specify a value, the first video that plays will be the <code class="notranslate" dir="ltr">VIDEO_ID</code> specified in the URL path, and the videos specified in the <code class="notranslate" dir="ltr">playlist</code> parameter will play thereafter. </td> </tr> <tr> <td> <h3 id="playsinline" data-text="playsinline"><code class="notranslate" itemprop="property" dir="ltr">playsinline</code></h3> </td> <td> This parameter controls whether videos play inline or fullscreen on iOS. Valid values are: <p><ul> <li><code class="notranslate" dir="ltr">0</code>: Results in fullscreen playback. This is currently the default value, though the default is subject to change.</li> <li><code class="notranslate" dir="ltr">1</code>: Results in inline playback for mobile browsers and for <code translate="no" dir="ltr">WebViews</code> created with the <code translate="no" dir="ltr"><a href="https://web.archive.org/web/20230130013753/https://developer.apple.com/documentation/webkit/wkwebviewconfiguration/1614793-allowsinlinemediaplayback?language=objc">allowsInlineMediaPlayback</a></code> property set to <code translate="no" dir="ltr">YES</code>.</li> </ul> </td> </tr> <tr> <td> <h3 id="rel" data-text="rel"><code class="notranslate" itemprop="property" dir="ltr">rel</code></h3> </td> <td> <span><b>Note:</b> This parameter is <a href="#release_notes_08_23_2018">changing</a> on or after September 25, 2018.</span><br><br> Prior to the change, this parameter indicates whether the player should show related videos when playback of the initial video ends. <ul> <li>If the parameter's value is set to <code class="notranslate" dir="ltr">1</code>, which is the default value, then the player does show related videos.</li> <li>If the parameter's value is set to <code class="notranslate" dir="ltr">0</code>, then the player does not show related videos.</li> </ul> After the change, you will not be able to disable related videos. Instead, if the <code translate="no" dir="ltr">rel</code> parameter is set to <code class="notranslate" dir="ltr">0</code>, related videos will come from the same channel as the video that was just played. </td> </tr> <tr> <td> <h3 id="start" data-text="start"><code class="notranslate" itemprop="property" dir="ltr">start</code></h3> </td> <td> This parameter causes the player to begin playing the video at the given number of seconds from the start of the video. The parameter value is a positive integer. Note that similar to the <code class="notranslate" dir="ltr"><a href="/web/20230130013753/https://developers.google.com/youtube/js_api_reference#seekTo">seekTo</a></code> function, the player will look for the closest keyframe to the time you specify. This means that sometimes the play head may seek to just before the requested time, usually no more than around two seconds. </td> </tr> <tr> <td> <h3 id="widget_referrer" data-text="widget_referrer"><code class="notranslate" itemprop="property" dir="ltr">widget_referrer</code></h3> </td> <td> This parameter identifies the URL where the player is embedded. This value is used in YouTube Analytics reporting when the YouTube player is embedded in a widget, and that widget is then embedded in a web page or application. In that scenario, the <code translate="no" dir="ltr"><a href="#origin">origin</a></code> parameter identifies the widget provider's domain, but YouTube Analytics should not identify the widget provider as the actual traffic source. Instead, YouTube Analytics uses the <code translate="no" dir="ltr">widget_referrer</code> parameter value to identify the domain associated with the traffic source. </td> </tr> </tbody> </table> <h2 id="Revision_History" data-text="Revision history">Revision history</h2> <div class="notranslate"> <a name="release_notes_04_27_2021"></a> <h3 class="hide-from-toc" id="april-27,-2021" data-text="April 27, 2021">April 27, 2021</h3> <p>The <code translate="no" dir="ltr"><a href="#playsinline">playsinline</a></code> parameter definition has been updated slightly to explain that the parameter pertains to both mobile browsers on iOS and iOS WebViews.</p> <a name="release_notes_10_15_2020"></a> <h3 class="hide-from-toc" id="october-15,-2020" data-text="October 15, 2020">October 15, 2020</h3> <p>The <code translate="no" dir="ltr"><a href="#autoplay">autoplay</a></code> parameter definition has been updated to explain that if you enable Autoplay, playback will occur without any user interaction with the player; playback data collection and sharing will therefore occur upon page load.</p> <a name="release_notes_10_13_2020"></a> <h3 class="hide-from-toc" id="october-13,-2020" data-text="October 13, 2020">October 13, 2020</h3> <p class="caution"><b>Note:</b> This is a deprecation announcement for the embedded player functionality that lets you configure the player to load search results. This announcement affects the player's <code translate="no" dir="ltr"><a href="#list">list</a></code> and <code translate="no" dir="ltr"><a href="#listType">listType</a></code> parameters.</p> <p>This change will become effective on or after <nobr>15 November 2020</nobr>. After that time, setting the <code translate="no" dir="ltr">listType</code> parameter value to <code translate="no" dir="ltr">search</code> will generate a <code translate="no" dir="ltr">4xx</code> response code, such as <code translate="no" dir="ltr">404</code> (<code translate="no" dir="ltr">Not Found</code>) or <code translate="no" dir="ltr">410</code> (<code translate="no" dir="ltr">Gone</code>).</p> <p>As an alternative, you can use the YouTube Data API's <code translate="no" dir="ltr"><a href="/web/20230130013753/https://developers.google.com/youtube/v3/docs/search/list">search.list</a></code> method to retrieve search results and then load selected videos in the player.</p> <p>In addition to the change described above, the <code translate="no" dir="ltr">showinfo</code> parameter, which was <a href="#release_notes_08_23_2018">deprecated</a> in 2018, has been removed from this document. <a name="release_notes_08_23_2018"></a> <h3 class="hide-from-toc" id="august-23,-2018" data-text="August 23, 2018">August 23, 2018</h3> <p class="caution"><b>Note:</b> This is a deprecation announcement for the <code class="notranslate" dir="ltr">showinfo</code> parameter. In addition, the behavior for the <code class="notranslate" dir="ltr">rel</code> parameter is changing. Titles, channel information, and related videos are an important part of YouTube’s core user experience, and these changes help to make the YouTube viewing experience consistent across different platforms.</p> <ul> <li>The behavior for the <code translate="no" dir="ltr">rel</code> parameter is changing on or after September 25, 2018. The effect of the change is that you will not be able to disable related videos. However, you will have the option of specifying that the related videos shown in the player should be from the same channel as the video that was just played.<br><br> To be more specific: <ul> <li>Prior to the change, if the parameter's value is set to <code class="notranslate" dir="ltr">0</code>, then the player does not show related videos.</li> <li>After the change, if the <code translate="no" dir="ltr">rel</code> parameter is set to <code class="notranslate" dir="ltr">0</code>, the player will show related videos that are from the same channel as the video that was just played.</li> </ul> </li> <li>The <code translate="no" dir="ltr">showinfo</code> parameter, which indicates whether the player should display information like the video title and uploader before the video starts playing, is also being deprecated. Following the change, the channel avatar and video title will always display before playback begins, when playback is paused, and when playback ends. The avatar being displayed is new behavior that will be consistent across all embedded players.</li> </ul> <p>These changes will become effective on or after September 25, 2018. After that time, the <code translate="no" dir="ltr">showinfo</code> parameter will be ignored. The behavior following the changes is consistent with the current default behavior for embedded players with the exception of the channel avatar changes mentioned above.</p> <a name="release_notes_08_16_2018"></a> <h3 class="hide-from-toc" id="august-16,-2018" data-text="August 16, 2018">August 16, 2018</h3> <p>The <code class="notranslate" dir="ltr"><a href="#cc_lang_pref">cc_lang_pref</a></code> parameter can be used to specify the default language that the player will use to display captions. This parameter can be used in conjunction with the <code class="notranslate" dir="ltr"><a href="#cc_load_policy">cc_load_policy</a></code> parameter to automatically show captions in the specified language during playback.</p> <a name="release_notes_09_15_2017"></a> <h3 class="hide-from-toc" id="september-15,-2017" data-text="September 15, 2017">September 15, 2017</h3> <p>The <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> parameter's definition has been updated to remove references to the deprecated Flash (AS3) player. The value <code translate="no" dir="ltr">2</code> has been deprecated as it was originally designed to provide a performance improvement for embeds that loaded a Flash player.</p> <a name="release_notes_06_12_2017"></a> <h3 class="hide-from-toc" id="june-12,-2017" data-text="June 12, 2017">June 12, 2017</h3> <p>The new <code class="notranslate" dir="ltr"><a href="#widget_referrer">widget_referrer</a></code> parameter helps to enable more accurate YouTube Analytics reporting when the YouTube player is embedded in a widget, and that widget is then embedded in a web page or application.</p> <a name="release_notes_11_01_2016"></a> <h3 class="hide-from-toc" id="november-1,-2016" data-text="November 1, 2016">November 1, 2016</h3> <p>This document has been updated to remove references to the deprecated Flash (AS3) player as well as to parameters only supported by that player. The YouTube Flash player was deprecated in January 2015.</p> <a name="release_notes_10_20_2016"></a> <h3 class="hide-from-toc" id="october-20,-2016" data-text="October 20, 2016">October 20, 2016</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The <code translate="no" dir="ltr"><a href="#disablekb">disablekb</a></code> parameter definition has been corrected to note that the default value is <code translate="no" dir="ltr">0</code>, which means that keyboard controls are enabled. A value of <code translate="no" dir="ltr">1</code> indicates that keyboard controls should be disabled.</p> <p>The list of keyboard controls that the player supports has also been updated to include the following:</p> <ul> <li>[f]: Toggle full-screen display</li> <li>[j]: Jump back 10 seconds in the current video</li> <li>[k]: Play / Pause</li> <li>[l]: Jump ahead 10 seconds in the current video</li> <li>[m]: Mute or unmute the video</li> <li>[0-9]: Jump to a point in the video. <code translate="no" dir="ltr">0</code> jumps to the beginning of the video, <code translate="no" dir="ltr">1</code> jumps to the time 10% into the video, <code translate="no" dir="ltr">2</code> jumps to the point 20% into the video, and so forth.</li> </ul> <p>In addition, the effect of pressing the [arrow left] or [arrow right] keys has changed. These keys now jump 5 seconds back (arrow left) or ahead (arrow right) in the current video.</p> </li> </ul> <a name="release_notes_08_11_2016"></a> <h3 class="hide-from-toc" id="august-11,-2016" data-text="August 11, 2016">August 11, 2016</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The newly published YouTube API Services Terms of Service ("the Updated Terms"), discussed in detail on the <a href="https://web.archive.org/web/20230130013753/http://youtube-eng.blogspot.com/">YouTube Engineering and Developers Blog</a>, provides a rich set of updates to the current Terms of Service. In addition to the <a href="/web/20230130013753/https://developers.google.com/youtube/terms/api-services-terms-of-service">Updated Terms</a>, which will go into effect as of February 10, 2017, this update includes several supporting documents to help explain the policies that developers must follow.</p> <p>The full set of new documents is described in the <a href="/web/20230130013753/https://developers.google.com/youtube/terms/revision-history">revision history for the Updated Terms</a>. In addition, future changes to the Updated Terms or to those supporting documents will also be explained in that revision history. You can subscribe to an RSS feed listing changes in that revision history from a link in that document.</p> </li> </ul> <a name="release_notes_12_18_2015"></a> <h3 class="hide-from-toc" id="december-18,-2015" data-text="December 18, 2015">December 18, 2015</h3> <p>European Union (EU) laws require that certain disclosures must be given to and consents obtained from end users in the EU. Therefore, for end users in the European Union, you must comply with the <a href="https://web.archive.org/web/20230130013753/https://www.google.com/about/company/user-consent-policy.html">EU User Consent Policy</a>. We have added a notice of this requirement in our <a href="/web/20230130013753/https://developers.google.com/youtube/terms#notices-to-users">YouTube API Terms of Service</a>.</p> <a name="release_notes_08_19_2015"></a> <h3 class="hide-from-toc" id="august-19,-2015" data-text="August 19, 2015">August 19, 2015</h3> <ul> <li> <p>The <code translate="no" dir="ltr"><a href="#autohide">autohide</a></code> parameter has been deprecated for the HTML5 player. In HTML5 players, the video progress bar and player controls display or hide automatically. That behavior corresponds to an <code translate="no" dir="ltr">autohide</code> setting of <code translate="no" dir="ltr">1</code>.</p> </li> <li> <p>The <code translate="no" dir="ltr">theme</code> parameter has been deprecated for the HTML5 player. HTML5 players now always use the dark theme.</p> </li> </ul> <a name="release_notes_03_09_2015"></a> <h3 class="hide-from-toc" id="march-9,-2015" data-text="March 9, 2015">March 9, 2015</h3> <ul> <li> <p>The document has been updated to reflect the fact that YouTube <code translate="no" dir="ltr"><object></code> embeds, the YouTube Flash Player API and the YouTube JavaScript Player API have all been <a href="https://web.archive.org/web/20230130013753/http://youtube-eng.blogspot.com/2015/01/youtube-now-defaults-to-html5_27.html">deprecated</a> as of January 27, 2015. A deprecation warning appears in several sections of this document to help point readers to the <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame Player API</a> as an alternative.</p> </li> <li> <p>The definition of the <code translate="no" dir="ltr"><a href="#autohide">autohide</a></code> parameter has been updated to clarify the meaning of the parameter's values. The default behavior (<code translate="no" dir="ltr">autohide=2</code>) is that if the player has a 16:9 or 4:3 aspect ratio, the player's video progress bar and player controls display or hide automatically. Otherwise, those controls are visible throughout the video.</p> </li> <li> <p>The definition of the <code translate="no" dir="ltr"><a href="#hl">hl</a></code> parameter has been updated to note that the parameter value could be an ISO 639-1 two-letter language code or a fully specified locale. For example, <code translate="no" dir="ltr">fr</code> and <code translate="no" dir="ltr">fr-ca</code> are both valid parameter values.</p> </li> <li> <p>The definition of the <code translate="no" dir="ltr"><a href="#enablejsapi">enablejsapi</a></code> parameter has been reworded to clarify that the parameter enables a player to be controlled via API calls. The API could be either the <a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame Player API</a> or the <a href="/web/20230130013753/https://developers.google.com/youtube/js_api_reference">JavaScript Player API</a>.</p> </li> </ul> <a name="release_notes_10_14_2014"></a> <h3 class="hide-from-toc" id="october-14,-2014" data-text="October 14, 2014">October 14, 2014</h3> <ul> <li> <p>The HTML5 player now supports the <code translate="no" dir="ltr"><a href="#cc_load_policy">cc_load_policy</a></code>, <code translate="no" dir="ltr"><a href="#disablekb">disablekb</a></code>, <code translate="no" dir="ltr"><a href="#end">end</a></code>, <code translate="no" dir="ltr"><a href="#fs">fs</a></code>, <code translate="no" dir="ltr"><a href="#list">list</a></code>, and <code translate="no" dir="ltr"><a href="#listType">listType</a></code> parameters. The parameter descriptions have been updated accordingly.</p> </li> </ul> <a name="release_notes_07_18_2014"></a> <h3 class="hide-from-toc" id="july-18,-2014" data-text="July 18, 2014">July 18, 2014</h3> <ul> <li> <p>The new <code class="notranslate" dir="ltr"><a href="#hl">hl</a></code> parameter can be used to set the player's interface language. The interface language is used for tooltips in the player and also affects the default caption track. The selected caption track may also depend on the availability of caption tracks and user's individual language preferences.</p> <p>The parameter's value is an <a href="https://web.archive.org/web/20230130013753/http://www.loc.gov/standards/iso639-2/php/code_list.php">ISO 639-1 two-letter language code</a>, though other language input codes, such as IETF language tags (BCP 47) may also be handled properly.</p> </li> <li> <p>The definition of the <code class="notranslate" dir="ltr"><a href="#playsinline">playsinline</a></code> parameter, which only affects HTML5 players on iOS, has been modified slightly. The definition now notes that setting the parameter value to <code translate="no" dir="ltr">1</code> causes inline playback only for <code translate="no" dir="ltr">UIWebViews</code> created with the <code translate="no" dir="ltr">allowsInlineMediaPlayback</code> property set to <code translate="no" dir="ltr">TRUE</code>.</p> </li> </ul> <a name="release_notes_01_28_2014"></a> <h3 class="hide-from-toc" id="january-28,-2014" data-text="January 28, 2014">January 28, 2014</h3> <ul> <li> <p>The <code class="notranslate" dir="ltr"><a href="#playsinline">playsinline</a></code> parameter controls whether videos play inline or fullscreen in an HTML5 player on iOS. Setting the value to <code class="notranslate" dir="ltr">1</code> causes inline playback.</p> </li> <li> <p>The <a href="#Selecting_Content_to_Play">Selecting content to play</a> section has been updated to explain how to find YouTube video IDs and playlist IDs using the YouTube Data API (v3) rather than the older API version.</p> </li> <li> <p>The <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> parameter's definition has been updated to reflect the fact that the parameter value only affects the time that the Flash player actually loads in IFrame embeds. In addition, for IFrame embeds, the parameter value also determines when the controls display in the player. If you set the parameter's value to <code class="notranslate" dir="ltr">2</code>, then the controls display and the Flash player loads after the user initiates the video playback.</p> </li> </ul> <a name="release_notes_05_10_2013"></a> <h3 class="hide-from-toc" id="may-10,-2013" data-text="May 10, 2013">May 10, 2013</h3> <p>This update contains the following changes:</p> <ul> <li> <p>YouTube no longer identifies experimental API features and services. Instead, we now provide a list of <a href="/web/20230130013753/https://developers.google.com/youtube/youtube-api-list">YouTube APIs that are subject to the deprecation policy</a>.</p> </li> </ul> <a name="release_notes_07_20_2012"></a> <h3 class="hide-from-toc" id="july-20,-2012" data-text="July 20, 2012">July 20, 2012</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The definition of the <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> parameter has been updated to reflect support for a parameter value of <code class="notranslate" dir="ltr">2</code> and to explain that, for AS3 players, the parameter value determines the time when the Flash player actually loads. If the <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> parameter is set to <code class="notranslate" dir="ltr">0</code> or <code class="notranslate" dir="ltr">1</code>, the Flash player loads immediately. If the parameter value is <code class="notranslate" dir="ltr">2</code>, the Flash player does not load until the video playback is initiated.</p> </li> </ul> <a name="release_notes_06_05_2012"></a> <h3 class="hide-from-toc" id="june-5,-2012" data-text="June 5, 2012">June 5, 2012</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The HTML5 player now supports the <code class="notranslate" dir="ltr"><a href="#color">color</a></code>, <code class="notranslate" dir="ltr"><a href="#modestbranding">modestbranding</a></code>, and <code class="notranslate" dir="ltr"><a href="#rel">rel</a></code> parameters, and the definitions for these parameters have been updated accordingly.</p> </li> <li> <p>The definition of the <code class="notranslate" dir="ltr"><a href="#showinfo">showinfo</a></code> parameter has been updated to explain how that if the player is loading a playlist, and you explicitly set the parameter value to <code class="notranslate" dir="ltr">1</code>, then, upon loading, the player will also display thumbnail images for the videos in the playlist. Note that this functionality is only supported for the AS3 player since that is the only player that can load a playlist.</p> </li> </ul> <a name="release_notes_05_04_2012"></a> <h3 class="hide-from-toc" id="may-4,-2012" data-text="May 4, 2012">May 4, 2012</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The <code class="notranslate" dir="ltr"><a href="#showinfo">showinfo</a></code> parameter's definition has been updated to reflect the fact that the HTML5 player supports this parameter.</p> </li> </ul> <a name="release_notes_05_03_2012"></a> <h3 class="hide-from-toc" id="may-3,-2012" data-text="May 3, 2012">May 3, 2012</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The new <code class="notranslate" dir="ltr"><a href="#end">end</a></code> parameter specifies the time, measured in seconds from the start of the video, when the player should stop playing a video. Note that the time when playback is stopped is measured from the beginning of the video and not from the value of either the <code class="notranslate" dir="ltr">start</code> player parameter or the <code class="notranslate" dir="ltr">startSeconds</code> parameter, which is used in YouTube Player API functions for loading or queueing a video.</p> </li> </ul> <a name="release_notes_03_29_2012"></a> <h3 class="hide-from-toc" id="march-29,-2012" data-text="March 29, 2012">March 29, 2012</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The new <a href="#Embedding_a_Player">Embedding a YouTube player</a> section explains different ways to embed a YouTube player in your application. This section covers manual IFrame embeds, IFrame embeds that use the IFrame Player API, and AS3 and AS2 object embeds. This section incorporates information from the old <strong>Example usage</strong> section, which has been removed.</p> </li> <li> <p>The new <a href="#Selecting_Content_to_Play">Selecting content to play</a> section explains how to configure the player to load a video, a playlist, search results for a specified query, or uploaded videos for a specified user.</p> </li> <li> <p>The new <code class="notranslate" dir="ltr"><a href="#list">list</a></code> and <code class="notranslate" dir="ltr"><a href="#listType">listType</a></code> parameters let you specify the content that the player should load. You can specify a playlist, a search query, or a particular user's uploaded videos.</p> </li> <li> <p>The definitions of the <code class="notranslate" dir="ltr"><a href="#fs">fs</a></code> and <code class="notranslate" dir="ltr"><a href="#rel">rel</a></code> parameters have been updated to more clearly explain the default parameter values for the AS3 player.</p> </li> <li> <p>The <code class="notranslate" dir="ltr"><a href="#border">border</a></code>, <code class="notranslate" dir="ltr"><a href="#color1">color1</a></code>, <code class="notranslate" dir="ltr"><a href="#egm">egm</a></code>, <code class="notranslate" dir="ltr"><a href="#hd">hd</a></code>, and <code class="notranslate" dir="ltr"><a href="#showsearch">showsearch</a></code> parameters, which are all only supported for the deprecated AS2 Player API, have been moved to a new section named <a href="#Deprecated_Parameters">deprecated parameters only used in the AS2 Player API</a>.</p> </li> <li> <p>The document no longer provides a way to filter the parameter list to only display parameters supported in either the AS3, AS2, or HTML5 player. Instead, each parameter definition has been updated to identify the players that support that parameter.</p> </li> </ul> <a name="release_notes_08_11_2011"></a> <h3 class="hide-from-toc" id="august-11,-2011" data-text="August 11, 2011">August 11, 2011</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The new <code class="notranslate" dir="ltr"><a href="#theme">theme</a></code> and <code class="notranslate" dir="ltr"><a href="#color">color</a></code> parameters let you customize the appearance of the embedded player's player controls. See the <a href="https://web.archive.org/web/20230130013753/http://apiblog.youtube.com/2011/08/coming-soon-dark-player-for-embeds.html">YouTube API blog</a> for more information.</p> </li> </ul> <a name="release_notes_06_08_2011"></a> <h3 class="hide-from-toc" id="june-8,-2011" data-text="June 8, 2011">June 8, 2011</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The new <code class="notranslate" dir="ltr"><a href="#modestbranding">modestbranding</a></code> parameter lets you use a YouTube player that does not show a YouTube logo. As of this release, the parameter was only supported for the AS3 embedded player and for IFrame embeds that loaded the AS3 player. As of June 5, 2012, the HTML5 player also supported this parameter.</p> </li> </ul> <a name="release_notes_02_14_2011"></a> <h3 class="hide-from-toc" id="february-14,-2011" data-text="February 14, 2011">February 14, 2011</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The documentation has been updated to note that the AS2 Player API has been deprecated. The deprecation of the AS2 Player API was actually <a href="https://web.archive.org/web/20230130013753/http://apiblog.youtube.com/2009/10/actionscript-3-youtube-chromeless.html">announced</a> on October 14, 2009.</p> </li> </ul> <a name="release_notes_02_03_2011"></a> <h3 class="hide-from-toc" id="february-3,-2011" data-text="February 3, 2011">February 3, 2011</h3> <p>This update contains the following changes:</p> <ul> <li> <p>The documentation has been updated to identify parameters supported in the HTML5 (<a href="/web/20230130013753/https://developers.google.com/youtube/iframe_api_reference">IFrame</a>) embedded player.</p> </li> <li> <p>The document now displays all of the parameters supported in any of YouTube's embedded players (HTML5, AS3, AS2).</p> </li> <li> <p>The following parameters are supported in the AS2 player but have been deprecated for the newer AS3 and HTML5 players: <code class="notranslate" dir="ltr"><a href="#border">border</a></code>, <code class="notranslate" dir="ltr"><a href="#color">color1</a></code>, <code class="notranslate" dir="ltr"><a href="#color">color2</a></code>, <code class="notranslate" dir="ltr"><a href="#egm">egm</a></code>, <code class="notranslate" dir="ltr"><a href="#hd">hd</a></code>, and <code class="notranslate" dir="ltr"><a href="#showsearch">showsearch</a></code>.</p> <p>In addition, the <code class="notranslate" dir="ltr"><a href="#loop">loop</a></code> parameter has limited support in the AS3 player and in IFrame embeds, which could load either an AS3 or HTML player. Currently, the <code class="notranslate" dir="ltr"><a href="#loop">loop</a></code> parameter only works in the AS3 player when used in conjunction with the <code class="notranslate" dir="ltr"><a href="#playlist">playlist</a></code> parameter. To loop a single video, set the <code class="notranslate" dir="ltr"><a href="#loop">loop</a></code> parameter to <code class="notranslate" dir="ltr">1</code> and set the <code class="notranslate" dir="ltr"><a href="#playlist">playlist</a></code> parameter value to the same video ID already specified in the Player API URL:<br/><pre class="notranslate" dir="ltr">https://www.youtube.com/v/<strong>VIDEO_ID</strong>?version=3&loop=1&playlist=<strong>VIDEO_ID</strong></pre></p> <p>Similarly, the <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> and <code class="notranslate" dir="ltr"><a href="#playlist">playlist</a></code> parameters are supported in the AS3 and HTML5 players but are not and will not be supported in the AS2 player.</p> <p>As noted above, IFrame embeds can load either an AS3 or HTML5 player. Though some parameters are not supported in both players, an IFrame embed that loads the AS3 player will support all parameters that work with that player and ignore all other parameters. Similarly, an IFrame embed that loads the HTML5 player will support all parameters that work with that player while ignoring all other parameters.</p> </li> <li> <p>The parameter list has been updated to include the <code class="notranslate" dir="ltr"><a href="#autohide">autohide</a></code> parameter, which indicates whether the player's video controls will automatically hide after a video begins playing.</p> </li> <li> <p>The parameter list has been updated to include the <code class="notranslate" dir="ltr"><a href="#controls">controls</a></code> parameter, which indicates whether the player's video controls will display at all. (Player controls do display by default.)</p> </li> <li> <p>The parameter list has been updated to include the <code class="notranslate" dir="ltr"><a href="#playlist">playlist</a></code> parameter, which specifies a comma-separated list of video IDs to play.</p> </li> <li> <p>The definition of the <code class="notranslate" dir="ltr"><a href="#fs">fs</a></code> has been updated to note that the fullscreen option will not work if you load the YouTube player into another SWF.</p> </li> <li> <p>The <a href="#AS3_Object_Embeds">example</a> at the end of the document has been updated to use the embedded AS3 player instead of the embedded AS2 player. The parameters used in the example have also been updated to only include parameters that the AS3 player supports.</p> <p>In addition, the instructions for constructing the URLs that contain player parameters have been updated to reflect the URL formats used by the AS3 and AS2 embedded and chromeless players as well as by the HTML5 player.</p> </li> </ul> </div>  </div> </div> <devsite-recommendations display="in-page" hidden yield> </devsite-recommendations> <devsite-thumb-rating position="footer"> </devsite-thumb-rating> <devsite-recommendations id="recommendations-link" yield></devsite-recommendations> </article> <devsite-content-footer class="nocontent"> <p>Except as otherwise noted, the content of this page is licensed under the <a href="https://web.archive.org/web/20230130013753/https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 License</a>, and code samples are licensed under the <a href="https://web.archive.org/web/20230130013753/https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0 License</a>. For details, see the <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/site-policies">Google Developers Site Policies</a>. Java is a registered trademark of Oracle and/or its affiliates.</p> <p>Last updated 2022-11-04 UTC.</p> </devsite-content-footer> <devsite-notification> </devsite-notification> <div class="devsite-content-data"> <template class="devsite-thumb-rating-down-categories"> [{ "type": "thumb-down", "id": "missingTheInformationINeed", "label":"Missing the information I need" },{ "type": "thumb-down", "id": "tooComplicatedTooManySteps", "label":"Too complicated / too many steps" },{ "type": "thumb-down", "id": "outOfDate", "label":"Out of date" },{ "type": "thumb-down", "id": "samplesCodeIssue", "label":"Samples / code issue" },{ "type": "thumb-down", "id": "otherDown", "label":"Other" }] </template> <template class="devsite-thumb-rating-up-categories"> [{ "type": "thumb-up", "id": "easyToUnderstand", "label":"Easy to understand" },{ "type": "thumb-up", "id": "solvedMyProblem", "label":"Solved my problem" },{ "type": "thumb-up", "id": "otherUp", "label":"Other" }] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> <nav class="devsite-footer-promos nocontent" aria-label="Promotions"> <ul class="devsite-footer-promos-list"> <li class="devsite-footer-promo"> <a href="https://web.archive.org/web/20230130013753/https://blog.youtube/" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 1)"> <img class="devsite-footer-promo-icon" src="/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-youtube.svg" loading="lazy" alt="Blog"> Blog </a> <div class="devsite-footer-promo-description">The latest news on the YouTube blog</div> </li> <li class="devsite-footer-promo"> <a href="https://web.archive.org/web/20230130013753/https://github.com/youtube/api-samples" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 2)"> <img class="devsite-footer-promo-icon" src="/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-github.svg" loading="lazy" alt="GitHub"> GitHub </a> <div class="devsite-footer-promo-description">Find API code samples and other YouTube open-source projects.</div> </li> <li class="devsite-footer-promo"> <a href="https://web.archive.org/web/20230130013753/https://issuetracker.google.com/issues/new?component=186600&template=874803" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 3)"> <img class="devsite-footer-promo-icon" src="/web/20230130013753im_/https://developers.google.com/static/site-assets/developers_64dp.png" loading="lazy" alt="Issue Tracker"> Issue Tracker </a> <div class="devsite-footer-promo-description">Something wrong? Send us a bug report!</div> </li> <li class="devsite-footer-promo"> <a href="https://web.archive.org/web/20230130013753/http://stackoverflow.com/questions/ask?tags=youtube-api" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 4)"> <img class="devsite-footer-promo-icon" src="/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-stack-overflow.svg" loading="lazy" alt="Stack Overflow"> Stack Overflow </a> <div class="devsite-footer-promo-description">Ask a question under the youtube-api tag</div> </li> <li class="devsite-footer-promo"> <a href="https://web.archive.org/web/20230130013753/https://www.youtube.com/user/YouTubeDev" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 5)"> <img class="devsite-footer-promo-icon" src="/web/20230130013753im_/https://developers.google.com/static/site-assets/logo-youtube.svg" loading="lazy" alt="Videos"> Videos </a> <div class="devsite-footer-promo-description">Check out the YouTube Developer Relations team's YouTube channel</div> </li> </ul> </nav> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Tools</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/apis-explorer/#p/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)"> Google APIs Explorer </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/youtube_player_demo" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)"> YouTube Player Demo </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/youtube_subscribe_button" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)"> Configure a Subscribe Button </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Issue Tracker</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://web.archive.org/web/20230130013753/https://issuetracker.google.com/issues/new?component=186600&template=874803" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)"> File a bug </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://web.archive.org/web/20230130013753/https://issuetracker.google.com/issues/new?component=186600&template=874803" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)"> Request a feature </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://web.archive.org/web/20230130013753/https://issuetracker.google.com/issues?q=componentid:186600" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)"> See open issues </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Product Info</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/terms" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)"> Terms of Service </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/branding_guidelines" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)"> Branding Guidelines </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/creating_monetizable_applications" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)"> Monetization Guidelines </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/web/20230130013753/https://developers.google.com/youtube/youtube-api-list" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)"> APIs subject to Deprecation Policy </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-sites" aria-label="Other Google Developers websites"> <a href="https://web.archive.org/web/20230130013753/https://developers.google.com/" class="devsite-footer-sites-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Developers Link"> <picture> <source srcset="https://web.archive.org/web/20230130013753im_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/lockup-developers-dark-theme.svg" media="(prefers-color-scheme: none)" class="devsite-dark-theme" loading="lazy" alt="Google Developers"> <img class="devsite-footer-sites-logo" src="https://web.archive.org/web/20230130013753im_/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/lockup-developers.svg" loading="lazy" alt="Google Developers"> </picture> </a> <ul class="devsite-footer-sites-list"> <li class="devsite-footer-sites-item"> <a href="//web.archive.org/web/20230130013753/https://developer.android.com/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Android Link"> Android </a> </li> <li class="devsite-footer-sites-item"> <a href="//web.archive.org/web/20230130013753/https://developer.chrome.com/home" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Chrome Link"> Chrome </a> </li> <li class="devsite-footer-sites-item"> <a href="//web.archive.org/web/20230130013753/https://firebase.google.com/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Firebase Link"> Firebase </a> </li> <li class="devsite-footer-sites-item"> <a href="//web.archive.org/web/20230130013753/https://cloud.google.com/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Cloud Platform Link"> Google Cloud Platform </a> </li> <li class="devsite-footer-sites-item"> <a href="/web/20230130013753/https://developers.google.com/products" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer All products Link"> All products </a> </li> </ul> </nav> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="/web/20230130013753/https://developers.google.com/terms/site-terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link"> Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//web.archive.org/web/20230130013753/https://policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link"> Privacy </a> </li> <li class="devsite-footer-utility-item devsite-footer-utility-button"> <span class="devsite-footer-utility-description">Sign up for the Google Developers newsletter</span> <a class="devsite-footer-utility-link gc-analytics-event" href="//web.archive.org/web/20230130013753/https://services.google.com/fb/forms/googledevelopersnews" data-category="Site-Wide Custom Events" data-label="Footer Subscribe link"> Subscribe </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en">English</a> </li> <li role="presentation"> <a role="menuitem" lang="id">Bahasa Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="de">Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es">Español</a> </li> <li role="presentation"> <a role="menuitem" lang="fr">Français</a> </li> <li role="presentation"> <a role="menuitem" lang="it">Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl">Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br">Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="tr">Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru">Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn">中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="ja">日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko">한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar type="cookie-notification" data-cookie-notice="0"> </devsite-snackbar> <devsite-tooltip></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics analytics-iframe> <script type="application/json" analytics>[{"dimensions": {"dimension3": false, "dimension1": "Signed out", "dimension6": "en", "dimension11": false, "dimension4": "YouTube IFrame Player API", "dimension5": "en"}, "gaid": "UA-24532603-1", "metrics": {"ratings_count": "metric2", "ratings_value": "metric1"}}]</script> <script type="application/json" gtm>{"parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "reference", "projectName": "YouTube IFrame Player API", "signedIn": "False", "tenant": "developers", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}, "tags": []}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="FNvapV4o5UeccXLqo4322vbIWgkI5G"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://web.archive.org/web/20230130013753/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/js/app_loader.js', '[1,"en",null,"/js/devsite_app_module.js","https://web.archive.org/web/20230130013753/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1","https://web.archive.org/web/20230130013753/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers","https://web.archive.org/web/20230130013753/https://developers-dot-devsite-v2-prod.appspot.com",null,null,["/_pwa/developers/manifest.json","https://web.archive.org/web/20230130013753/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/images/video-placeholder.svg","https://web.archive.org/web/20230130013753/https://www.gstatic.com/devrel-devsite/prod/vf835aa6b9cd89b3f27e5e46b762d88066cfe5cc51e31c466c45c27dbcd2bcca1/developers/images/favicon.png","https://web.archive.org/web/20230130013753/https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,40,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,111,112,113,115,116,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,144,147,148,149,150,151,152,154,155,156,157,158,159,161,163,164,165,168,169,170,172,173,179,180,182,183,186,190,191,193,196],"AIzaSyAP-jjEJBzmIyKR4F-3XITp8yM9T1gEEI8","AIzaSyB6xiKGDR5O3Ak2okS4rLkauxGUG7XP0hg","developers.google.com","AIzaSyAQk0fBONSGUqCNznf6Krs82Ap1-NV6J4o","AIzaSyCCxcqdrZ_7QMeLCRY20bh_SXdAYqy70KY",null,null,null,["Localization__enable_locale_redirects","BookNav__enable_collapsible_book_nav","MiscFeatureFlags__enable_footprints_record_views","SignIn__enable_auto_signin_oauth","Profiles__enable_developer_profiles_interests","Profiles__enable_developer_profiles_dashboard_recommendations","Significatio__enable_experiment_id_caching","Profiles__enable_profile_notifications_ui","MiscFeatureFlags__emergency_css","Cloud__enable_cloudx_experiment_ids","Badges__enable_drag_and_drop_badges","Badges__enable_delete_badges","BookNav__enable_book_nav_filtering","Experiments__reqs_query_experiments","Profiles__enable_public_developer_profiles","Search__enable_devsite_serp","Cloud__enable_cloud_dlp_service","Cloud__enable_cloud_shell_fte_user_flow","Search__enable_acl_suggestions","Profiles__enable_page_saving","Search__enable_suggestions_from_borg","Cloud__enable_cloud_shell","Profiles__require_profile_eligibility_for_signin","MiscFeatureFlags__enable_tls_version_for_gaia_calls","Cloud__enable_cloud_facet_chat","Search__enable_page_map","Profiles__enable_profile_collections","Profiles__enable_developer_profiles_callout","Experiments__enable_experiments","Significatio__enable_by_tenant"]]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

YouTube Embedded Players and Player Parameters | YouTube IFrame Player API | Google Developers