Define an <iframe> tag in your application in which the src URL specifies the content that the player will load as well as any other player parameters you want to set. The <iframe> tag’s height and width parameters specify the dimensions of the player.

If you create the <iframe> 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:

The <iframe> tag below would load a 640x360px player that would play the YouTube video M7lc1UVf-VE. Since the URL sets the autoplay parameter to 1, the video would play automatically once the player has loaded.

Follow the IFrame Player API instructions 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 playerVars property identifies player parameters.

The HTML and Javascript code below shows a simple example that inserts a YouTube player into the page element that has an id value of ytplayer. The onYouTubePlayerAPIReady() method 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.

You can configure your embedded player to load a video, a playlist, or a user’s uploaded videos.

The following list explains these options for loading a video. For an IFrame embed, the YouTube video ID for the video that you want to load is specified in the IFrame’s src URL.

If you are using the YouTube Data API (v3), you can programmatically construct these URLs by retrieving video IDs from search results, playlist item resources, video resources, or other resources. After obtaining a video ID, replace the VIDEO_ID text in the URLs above with that value to create the player URL.

For loading a playlist, set the listType player parameter to playlist. In addition, set the list player parameter to the YouTube playlist ID that you want to load.

Note that you need to prepend the playlist ID with the letters PL as shown in the following example:

If you are using the YouTube Data API (v3), you can programmatically construct these URLs by retrieving playlist IDs from search results, channel resources, or activity resources. After obtaining a playlist ID, replace the PLAYLIST_ID text in the URL above with that value.

For loading a user’s uploaded videos, set the listType player parameter to user_uploads. In addition, set the list player parameter to the YouTube username whose uploaded videos you want to load.

This parameter specifies whether the initial video will automatically start to play when the player loads. Supported values are 0 or 1. The default value is 0.

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.

This parameter specifies the default language that the player will use to display captions. Set the parameter’s value to an ISO 639-1 two-letter language code.

If you use this parameter and also set the cc_load_policy parameter to 1, then the player will show captions in the specified language when the player loads. If you do not also set the cc_load_policy parameter, then captions will not display by default, but will display in the specified language if the user opts to turn captions on.

Setting the parameter’s value to 1 causes closed captions to be shown by default, even if the user has turned captions off. The default behavior is based on user preference.

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 red and white, and, by default, the player uses the color red in the video progress bar.

This parameter indicates whether the video player controls are displayed:

Setting the parameter’s value to 1 causes the player to not respond to keyboard controls. The default value is 0, which means that keyboard controls are enabled. Currently supported keyboard controls are:

Setting the parameter’s value to 1 enables the player to be controlled via IFrame Player API calls. The default value is 0, which means that the player cannot be controlled using that API.

For more information on the IFrame API and how to use it, see the IFrame API documentation.

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.

Note that the time is measured from the beginning of the video and not from either the value of the start player parameter or the startSeconds parameter, which is used in YouTube Player API methods for loading or queueing a video.

Setting this parameter to 0 prevents the fullscreen button from displaying in the player. The default value is 1, which causes the fullscreen button to display.

Sets the player’s interface language. The parameter value is an ISO 639-1 two-letter language code or a fully specified locale. For example, fr and fr-ca are both valid values. Other language input codes, such as IETF language tags (BCP 47) might also be handled properly.

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.

Setting the parameter’s value to 1 causes video annotations to be shown by default, whereas setting to 3 causes video annotations to not be shown by default. The default value is 1.

The list parameter, in conjunction with the listType parameter, identifies the content that will load in the player.

The listType parameter, in conjunction with the list parameter, identifies the content that will load in the player. Valid parameter values are playlist and user_uploads.

If you specify values for the list and listType parameters, the IFrame embed URL does not need to specify a video ID.

In the case of a single video player, a setting of 1 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.

Supported values are 0 and 1, and the default value is 0.

This parameter allows you to use a YouTube player that does not display the YouTube logo. Set the parameter value to 1 to prevent the YouTube logo from being displayed in the control bar. However, a small YouTube text label will appear in the top right corner of a paused video when the user hovers over the player.

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 enablejsapi parameter value to 1, you should always specify your domain as the origin parameter value.

To ensure secure communication between your website and the YouTube Player API, you need to specify the domain of your website as an origin parameter in the iframe embed URL.

Determine the exact domain (including the protocol, http:// or https://) where your YouTube player will be embedded. For example: https://yourwebsite.com.

Why is this important?

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 VIDEO_ID specified in the URL path, and the videos specified in the playlist parameter will play thereafter.

This parameter controls whether videos play inline or fullscreen on iOS. Valid values are:

When privacy_enhanced is switched on, the embedded YouTube player is loaded from www.youtube-nocookie.com — instead of the standard site www.youtube.com. This activates what YouTube officially calls Privacy-Enhanced Mode.

Normally, the moment a page with an embedded YouTube video finishes loading, YouTube may already place cookies in your browser and start collecting information about you — even if you never click the play button. Just seeing the video thumbnail on the page is enough. YouTube (and its parent company Google) can use this to build a profile of your interests across the web.

With Privacy-Enhanced Mode, that early tracking is held back. The rule becomes: YouTube does not store cookies or track the visitor until the visitor actually plays the video. Simply: visiting a page that contains the embedded player leaves no trace in the form of tracking cookies.

Prior to the change, this parameter indicates whether the player should show related videos when playback of the initial video ends.

After the change, you will not be able to disable related videos. Instead, if the rel parameter is set to 0, related videos will come from the same channel as the video that was just played.

If you set the parameter value to 0, information such as the video title or the name of the uploader will not be displayed in the player before the video starts playing.

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 seekTo method, 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.

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 origin 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 widget_referrer parameter value to identify the domain associated with the traffic source.

Queueing methods allow to load or cue a single video into the player at runtime - without creating a new player object.

All queueing methods for videos support two calling conventions: an argument syntax with positional parameters and an object syntax that accepts a single object as parameter. The object syntax additionally supports the endSeconds property, which is not available in the argument syntax.

The cuePlaylist and loadPlaylist methods allow to load and play a playlist. If the object syntax is used to call these methods, they can additionally queue (or load) a list of a user’s uploaded videos.

Plays the currently cued/loaded video. The final player state after this method executes will be playing (1).

Pauses the currently playing video. The final player state after this method executes will be paused (2) unless the player is in the ended (0) state when the method is called, in which case the player state will not change.

Stops and cancels loading of the current video. This method should be reserved for rare situations when you know that the user will not be watching additional video in the player. If your intent is to pause the video, you should just call the pauseVideo method.

If you want to change the video that the player is playing, you can call one of the queueing methods without calling stopVideo first.

Seeks to a specified time in the video. If the player is paused when the method is called, it will remain paused. If the method is called from another state (playing, video cued, etc.), the player will play the video.

The player will advance to the closest keyframe before that time unless the player has already downloaded the portion of the video to which the user is seeking. * The allowSeekAhead parameter determines whether the player will make a new request to the server if the seconds parameter specifies a time outside of the currently buffered video data.

It is recommended that you set this parameter to false while the user drags the mouse along a video progress bar and then set it to true when the user releases the mouse. This approach lets a user scroll to different points of a video without requesting new video streams by scrolling past unbuffered points in the video. When the user releases the mouse button, the player advances to the desired point in the video and requests a new video stream if necessary.

The getPlaybackQuality(), setPlaybackQuality(), and getAvailableQualityLevels() methods are no longer supported (October 24, 2019). In particular, calls to setPlaybackQuality() will be no-op functions, meaning they will not actually have any impact on the viewer’s playback experience.

The following methods read or change the sound volume of a player. Volume values are integers between 0 (silent) and 100 (maximum volume).

The following method changes the size of the <iframe> element that contains a player on the page.

The playback rate controls how fast a video plays. The normal speed is 1. A value of 0.5 plays a video at half speed, a value of 2 at double speed. The following methods read and change the playback rate of the current video.

The following methods control how a playlist is played - for example, whether the list repeats endlessly, or plays its videos in random order.

The following methods navigate within the playlist that is currently loaded: jump to the next or previous video, or play a video at a specific position in the list.

The following methods report what the player is currently doing: how much of the video is buffered, whether the player is playing or paused, and the current playback position.

The following methods return information about the video that is currently loaded or playing - like its duration, its YouTube URL, and its embed code.

The following methods return information about the playlist that is currently loaded: the list of video IDs, and the position of the video that is currently playing.

Besides passing event handlers to the YT.Player constructor, you can add and remove event listeners at runtime using the following methods.

The following methods give you direct access to the <iframe> element of a player, or remove the element from the page completely.

This event fires whenever a player has finished loading and is ready to begin receiving API calls. Your application should implement this method if you want to automatically execute certain operations, such as playing the video or displaying information about the video, as soon as the player is ready.

The example below shows a sample method for handling this event. The event object that the API passes to the method has a target property, which identifies the player. The method retrieves the embed code for the currently loaded video, starts to play the video, and displays the embed code in the page element that has an id value of embed-code.

This event fires whenever the player’s state changes. The data property of the event object that the API passes to your event listener method will specify an integer that corresponds to the new player state. Possible values are:

When the player first loads a video, it will broadcast an unstarted (-1) event. When a video is cued and ready to play, the player will broadcast a video cued (5) event. In your code, you can specify the integer values or you can use one of the following namespaced variables:

This event fires whenever the video playback quality changes. It might signal a change in the viewer’s playback environment. See the YouTube Help Center for more information about factors that affect playback conditions or that might cause the event to fire.

The data property value of the event object that the API passes to the event listener method will be a string that identifies the new playback quality. Possible values are:

This event fires whenever the video playback rate changes. For example, if you call the setPlaybackRate(suggestedRate) method, this event will fire if the playback rate actually changes. Your application should respond to the event and should not assume that the playback rate will automatically change when the setPlaybackRate(suggestedRate) method is called. Similarly, your code should not assume that the video playback rate will only change as a result of an explicit call to setPlaybackRate.

The data property value of the event object that the API passes to the event listener method will be a number that identifies the new playback rate. The getAvailablePlaybackRates method returns a list of the valid playback rates for the currently cued or playing video.

This event fires if an error occurs in the player. The API will pass an event object to the event listener method. That object’s data property will specify an integer that identifies the type of error that occurred.

Possible values are:

This event is fired to indicate that the player has loaded (or unloaded) a module with exposed API methods. Your application can listen for this event and then poll the player to determine which options are exposed for the recently loaded module. Your application can then retrieve or update the existing settings for those options.

The following command retrieves an array of module names for which you can set player options:

Currently, the only module that you can set options for is the captions module, which handles closed captioning in the player. Upon receiving an onApiChange event, your application can use the following command to determine which options can be set for the captions module:

By polling the player with this command, you can confirm that the options you want to access are, indeed, accessible. The following commands retrieve and update module options:

The table below lists the options that the API supports:

This event fires any time the browser blocks autoplay or scripted video playback features, collectively referred to as "autoplay". This includes playback attempted with any of the following player APIs:

Most browsers have policies that can block autoplay in desktop, mobile, and other environments if certain conditions are true. Instances where this policy may be triggered include unmuted playback without user interaction, or when a Permissions Policy to permit autoplay on a cross-origin iframe has not been set.

For complete details, refer to browser-specific policies: Apple Safari / Webkit, Google Chrome, Mozilla Firefox and Mozilla’s autoplay guide.

Use API with existing <iframe>. In this example, an <iframe> element on the page already defines the player with which the API will be used. Note that either the player’s src URL must set the enablejsapi parameter to 1 or the <iframe> element’s enablejsapi attribute must be set to true.

The onPlayerReady method changes the color of the border around the player to orange when the player is ready. The onPlayerStateChange method then changes the color of the border around the player based on the current player status. For example, the color is green when the player is playing, red when paused, blue when buffering, and so forth.

This example uses the following code:

Playback video (loud) at volume set to 100%. This example creates a video player of size 1280px by 720px. The event listener for the onReady event then calls the setVolume method to adjust the volume to the highest setting.

This example uses the following code:

This example sets player parameters to automatically play the video when it loads and hide the video player’s controls. It also adds event listeners for several events that the API broadcasts.

This example uses the following code: