The YouTube Data API gives a simple approach to get to YouTube channel videos and include into our web application. The variours sources package will get video details from YouTube channel utilizing Data API. On the off chance that we have to import and show YouTube video display on our page implies, YouTube Data API will help us to do this. If you want to import videos from YouTube channel and placing on the web page, this sample script will support you. This post will explain you the simple way to get videos from your YouTube channel and displays them in the web page utilizing YouTube Data API using PHP. We will use YouTube Data API to get videos from YouTube channel and list them in the website using PHP.
YouTube Data API Key
In order to use YouTube Data API, you must enable YouTube Data API and generate API key on Google Developer Console. The API key needs to be provided in the YouTube Data API request.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php $API_Url = 'https://www.googleapis.com/youtube/v3/'; $API_Key = 'API_KEY'; // If you don't know the channel ID see below $channelId = 'CHANNEL_ID'; $parameter = [ 'id'=> $channelId, 'part'=> 'contentDetails', 'key'=> $API_Key ]; $channel_URL = $API_Url . 'channels?' . http_build_query($parameter); $json_details = json_decode(file_get_contents($channel_URL), true); ?> |
Making a connection using YouTube Data API
Using API Key and channel ID we can able to get a connection with proper URL and required parameters.
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php $parameter = [ 'part'=> 'snippet', 'playlistId' => $playlist, 'maxResults'=> '50', 'key'=> $API_Key ]; $channel_URL = $API_Url . 'playlistItems?' . http_build_query($parameter); $json_details = json_decode(file_get_contents($channel_URL), true); ?> |
Getting Videos details from YouTube using Data API
Using Data API URL we make a request to google console server then it will return a response as JSON data list with video details. It contains video title, information, thumbnails, publishes date, etc. Get the details and store into an array for further utilization.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?php $my_videos = []; foreach($json_details['items'] as $video){ //$my_videos[] = $video['snippet']['resourceId']['videoId']; $my_videos[] = array( 'v_id'=>$video['snippet']['resourceId']['videoId'], 'v_name'=>$video['snippet']['title'] ); } while(isset($json_details['nextPageToken'])){ $nxt_page_URL = $channel_URL . '&pageToken=' . $json_details['nextPageToken']; $json_details = json_decode(file_get_contents($nxt_page_URL), true); foreach($json_details['items'] as $video) $my_videos[] = $video['snippet']['resourceId']['videoId']; } ?> |
Listing or Display the YouTube Videos
Using the stored videos array we can display the video one by one with a proper format using a foreach loop.
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<?php foreach($my_videos as $video){ if(isset($video)){ echo '<a href="https://www.youtube.com/watch?v='. $video['v_id'] .'" style="background: url(\'https://img.youtube.com/vi/'. $video['v_id'] .'/mqdefault.jpg\')"> <div>'. $video['v_name'] .'</div> </a>'; } } ?> |
Playing videos with pop-up layout
Using the URL link we get the video unique id and display it as iframe using jQuery.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<script> $(document).ready(function(e){ $('#my_video_list a').on('click',function(e){ e.preventDefault(); var video_url = $(this).attr('href'); var video_id = video_url.substring(video_url.search('=')+1,video_url.length); $('#my_player DIV').html('<iframe width="500" height="300" src="https://www.youtube.com/embed/' + video_id + '" frameborder="0" allowfullscreen></iframe>'); $('#my_player').fadeIn(500); }); $('#my_player').on('click',function(e){ $('#my_player').fadeOut(500); $('#my_player DIV').empty(); }); }); </script> |