Youtube Video Gallery in PHP and/or Javascript

Asked

Viewed 1,290 times

1

I had a Youtube video gallery that showed up on the screen the last video of a channel, in normal size and then appeared just below 50 more videos in miniature, and when it was clicked on one of these thumbnails, the video was opened in place of the one that had the largest size, until then all right!

But with the change from API v2 to v3, the videos no longer appear, but a youtube videos with a support message. I already visited the page of this support but could not solve.

Does anyone know how to fix this or has a code that answers this situation?

1 answer

0


I solved this situation in parts, I do not understand much of the subject, but I saw a video in English and I was able to take advantage of the subject.

First you enter the address: www.console.Developers.google.com/project/507871535838/apiui/Credential , logs in and generates a Key for browser applications, similar to this: AIzaSyAUdzBYnsoHcgeDqY9sflH0bv0XaIBjpsI you will use it in script.js

Then you download the file jquery-1.11.3.min.js and creates 2 files: index.html and script.js

In the index.html that you created, calls the files .js and to show the videos, you call through the code below in the body of index.

<ul id="results"></ul>

Now create the script.js:

var channelName = 'Aqui vai o nome do canal';
var vidWidth = 250; //largura de cada vídeos
var vidHeight = 187; //altura de cada vídeos
var vidResults = 10; //qtd de vídeos que vai aparecer na galeria max 50

$(document).ready(function(){
$.get(
    "https://www.googleapis.com/youtube/v3/channels",{
        part: 'contentDetails',
        forUsername: channelName,
        key: 'AIzaSyAUdzBYnsoHcgeDqY9sflH0bv0XaIBjpsI'},//altere para sua chave
        function(data){
            $.each(data.items, function(i, item){
                console.log(item);
                pid = item.contentDetails.relatedPlaylists.uploads;
                getVids(pid);
            })
        }
);

function getVids(pid){
    $.get(
        "https://www.googleapis.com/youtube/v3/playlistItems",{
            part: 'snippet',
            maxResults: vidResults,
            playlistId: pid,
            key: 'AIzaSyAUdzBYnsoHcgeDqY9sflH0bv0XaIBjpsI'},//altere para sua chave
            function(data){
                var output;
                $.each(data.items, function(i, item){
                    console.log(item);
                    videTitle = item.snippet.title;
                    videoId = item.snippet.resourceId.videoId;
                    output = '<li><iframe width="'+vidWidth+'" height="'+vidHeight+'" src=\"https://www.youtube.com/embed/'+videoId+'\"></iframe></li>';
                    //Append to resultes listStyleType
                    $('#results').append(output);
                })
            }
    );    
}
});

I hope I’ve helped, like I said, I’m a layman, but if anyone wants to get better, feel free.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.