我在codepen上制作了一个instagram小部件。它工作得很好，功能也很好。然而，当我尝试将其添加到我的站点时，它并没有显示出来。有人对我如何使用instagram小部件有什么建议吗？

代码笔-https://codepen.io/elle343/pen/owBoyE

我的html

<ul id="rudr_instafeed"></ul>

我的css

#rudr_instafeed{
   margin: 42px 0 0;
  overflow: hidden;
  white-space: nowrap;
  vertical-align: middle;
  position: relative;
  text-align: center; 
  list-style:none;
}
#rudr_instafeed li{
display: inline-block;
    vertical-align: middle;
    position: relative;
}
#rudr_instafeed li img{
max-height: 260px;
      position: relative;
      z-index: 0;
}

instagram页脚。js公司

var token = \'5219525.f0b48c7.17327f93adbe4fbb89ccd13a1a226a33\',
    num_photos = 20;

$.ajax({
    url: \'https://api.instagram.com/v1/users/self/media/recent\',
    dataType: \'jsonp\',
    type: \'GET\',
    data: {access_token: token, count: num_photos},
    success: function(data){
        console.log(data);
        for( x in data.data ){
            $(\'ul\').append(\'<li><img src="\'+data.data[x].images.low_resolution.url+\'"></li>\');
        }
    },
    error: function(data){
        console.log(data);
    }
});

功能。php

function instagramfooter() {
 wp_enqueue_script( \'instagramfooter\', get_stylesheet_directory_uri() . \'/js/instagram-footer.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'jquery-2.2.4\', get_template_directory_uri() . \'/js/jquery-2.2.4.min.js\', array( \'jquery\' ), \'2.2.4\', true );

}
 add_action( \'wp_enqueue_scripts\', \'instagramfooter\' );

在我的JS文件夹/JS/jquery-2.2.4中。min.js（从这里开始-https://code.jquery.com/jquery-2.2.4.min.js)