Plugins
Templates
Template Setup Guides

Embedded YouTube API Player Plugin

Link to plugin page: https://zeroqode.com/plugin/youtube-iframe-player-and-api-1577726778757x131418389645310940

Introduction

Youtube iFrame Player - lets you embed a YouTube video player on your website and control the player using JavaScript. Using the API's JavaScript functions, you can queue videos for playback; play, pause, or stop those videos; adjust the player volume (mute/unmute); or retrieve information about the video being played.

Prerequisites

You must have a developer account with Google to interact with the plugin and API. Create your development account at: https://developers.google.com/youtube

Plugin Setup

Getting Google Developers API Key

1. Create account in Google Account for getting access to Google API Console.

2. Create a project in the Google Developers Console and obtain authorization credentials so your application can submit API requests. After creating your project, make sure the YouTube Data API is one of the services that your application is registered to use:

  • Go to the API Console and select the project that you just registered.

  • Visit the Enabled APIs page. In the list of APIs, make sure the status is ON for the YouTube Data API v3.

3. Create authentication process by setting up the "Credentials" and “OAuth Access Request Window” in order to use the API calls that require authentication.

4. Once you've created the authentication process, get your credentials: Customer ID and Customer Secret Keys.

5. In the plugin settings, once the plugin is installed paste your Customer ID and Customer Secret.

Do not forget to Enable Generic URI Redirect

6. In the Google Console set up the redirect URI for authentication process for the created project.

Redirect URI of your application

7. You should be all set to work with plugin.

Plugin Element

Plugin Visual Element

The plugin contains Youtube visual element which should be used on page.

Youtube Visual Element

Plugin Element Proprieties

Youtube Element Proprieties
  • VideoId -The YouTube video ID that identifies the video that the player will load.

  • ProgressBar Color -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.

  • Set volume - Set standard volume for player.

  • Speed - Set standard speed for player.

  • Autoplay - autoplay: If you set the value to 1, the API will Auto play the embed video when the page loads. Set it 0 and your users will have to manually play the video.

  • iv_load_policy - 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.

  • cc_load_policy - 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.

  • Loop - 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.

  • Playlist - 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.

  • Video Player UI Disabled - When this parameter is checked the on-screen Youtube player UI will be disabled.

Plugin API Calls

Activities: list (Additional Info)

Returns a list of channel activity events that match the request criteria. For example, you can retrieve events associated with a particular channel or with the user's own channel.

Captions: list (Additional Info)

Returns a list of caption tracks that are associated with a specified video. Note that the API response does not contain the actual captions and that the captions.download method provides the ability to retrieve a caption track.

Channels: list (Additional Info)

Returns a collection of zero or more channel resources that match the request criteria.

ChannelSections: list (Additional Info)

Returns a list of channelSection resources that match the API request criteria.

CommentThreads: list (Additional Info)

Returns a list of comment threads that match the API request parameters.

GuideCategories: list (Additional Info)

Returns a list of categories that can be associated with YouTube channels.

PlaylistItems: list (Additional Info)

Returns a collection of playlist items that match the API request parameters. You can retrieve all of the playlist items in a specified playlist or retrieve one or more playlist items by their unique IDs.

Playlists: list (Additional Info)

Returns a collection of playlists that match the API request parameters. For example, you can retrieve all playlists that the authenticated user owns, or you can retrieve one or more playlists by their unique IDs.

Subscriptions: list (Additional Info)

Returns subscription resources that match the API request criteria. retrieved.

VideoAbuseReportReasons: list (Additional Info)

Retrieve a list of reasons that can be used to report abusive videos.

VideoCategories: list (Additional Info)

Returns a list of categories that can be associated with YouTube videos.

Videos: list (Additional Info)

Returns a list of videos that match the API request parameters.

Plugin Events

  • Youtube Play Video - It is used to play the video.

  • Youtube Mute - It is used to mute the current video playing.

  • Youtube Unmute - It is used to unmute the current video playing.

  • Youtube Pause Video - It is used to pause the current video playing.

Plugin Actions

  • StopVideo Youtube - Stops the current video playing.

  • Play Video Youtube - Plays the video

  • Mute / Unmute Youtube - Mutes the current video playing if current video playing is Unmute and Unmutes the current video playing if current video playing is Mute

  • Next Video Youtube - Plays the next video.

  • Previous Video Youtube - Plays the previous video

Plugin States

  • Current time - currentTime property specifies the current playback time in seconds

  • Duration - video duration in seconds

YouTube regulations permission, only muted videos can be auto-played on page load.

Demo to preview the settings: