• Resolved navyspitfire

    (@navyspitfire)


    I’m trying to use the youtube API on two of my template pages. Obviously I want to enqueue it correctly. When I put this code in my footer.php page, I got it to work:

    <script type="text/javascript" src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>
    <script src="https://apis.google.com/js/plusone.js"></script>
    <script type="text/javascript">
    function vidinfolist(data) {
        var dat = data.feed.entry;
        var pageOutput = '<ul>';
        for (var i=0; i<data.feed.entry.length; i++) {
        var datID=dat[i].id.$t.substring(38);
        var datTitle=dat[i].title.$t;
        var datDescription=dat[i].media$group.media$description.$t;
        var datThumbnail=dat[i].media$group.media$thumbnail[0].url;
        pageOutput += '<li><h2>' + datTitle + '</h2>';
        pageOutput += '<li><p>' + datDescription + '</p>';
        pageOutput += '<div class="g-ytsubscribe" data-channel="droptroucomedy" data-layout="default"></div>';
        pageOutput+='<iframe width="952" height="540" src="https://www.youtube.com/embed/'+datID+'?wmode=transparent&HD=0&rel=0&showinfo=0&controls=1&fs=1&autoplay=0" width= frameborder="0" allowfullscreen></iframe></li>';
        }
        document.getElementById('videoCode').innerHTML = pageOutput;
        pageOutput +='</ul>';
    }
    </script>
    <script type="text/javascript" src="https://gdata.youtube.com/feeds/users/droptroucomedy/uploads?alt=json-in-script&callback=vidinfolist&max-results=1"></script>

    Seeing that it works, I deleted it and placed the following code in my function.php file. My youtube_js.js file is down below. It’s not working, and I’m not sure why, any suggestions? Am I supposed to add anything in my template-name.php files?

    add_action ( 'wp_enqueue_scripts', 'dtrou_youtube_api' );
    
    function dtrou_youtube_api() {
        wp_register_script( 'dtrou-youtube', get_template_directory_uri() . '/js/youtube_js.js', array('jquery'), '', true );
        wp_register_script( 'youtube-subscribe-btn', 'https://apis.google.com/js/plusone.js', array(), '', true );
        wp_register_script( 'youtube-subscribe-featured', 'https://gdata.youtube.com/feeds/users/droptroucomedy/uploads?alt=json-in-script&callback=vidinfolist&max-results=1', array(), '', true );
        wp_register_script( 'youtube-subscribe-videos', 'https://gdata.youtube.com/feeds/users/droptroucomedy/uploads?alt=json-in-script&callback=vidinfolist&max-results=100', array(), '', true );
    
    if ( is_page_template('t-featured.php') ) {
        wp_enqueue_script('dtrou-youtube');
        wp_enqueue_script('youtube-subscribe-featured');
        wp_enqueue_script('youtube-subscribe-btn');
    }
    
    if ( is_page_template('t-videos.php') ) {
        wp_enqueue_script('dtrou-youtube');
        wp_enqueue_script('youtube-subscribe-videos');
        wp_enqueue_script('youtube-subscribe-btn');
    }
    }

    youtube_js.js

    function vidinfolist(data) {
    var dat = data.feed.entry;
    var pageOutput = '<ul>';
    for (var i=0; i<data.feed.entry.length; i++) {
    var datID=dat[i].id.$t.substring(38);
    var datTitle=dat[i].title.$t;
    var datDescription=dat[i].media$group.media$description.$t;
    var datThumbnail=dat[i].media$group.media$thumbnail[0].url;
    pageOutput += '<li><h2>' + datTitle + '</h2>';
    pageOutput += '<li><p>' + datDescription + '</p>';
    pageOutput += '<div class="g-ytsubscribe" data-channel="droptroucomedy" data-layout="default"></div>';
    pageOutput+='<iframe width="952" height="540" src="https://www.youtube.com/embed/'+datID+'?wmode=transparent&HD=0&rel=0&showinfo=0&controls=1&fs=1&autoplay=0" width= frameborder="0" allowfullscreen></iframe></li>';
    }
    document.getElementById('videoCode').innerHTML = pageOutput;
    pageOutput +='</ul>';
    }

Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
  • The topic ‘wp_enqueue & youtube API on different templates’ is closed to new replies.