JSFiddle - React, Tailwind, and code Playground

by Luke Marlow

HTML

<script src="http://hemeon.com/instafeed.min.js"></script>
<div id="instafeed"></div>

CSS

/* Gillys :: 1738911902 */

.instabox { 
    width: 25%;
    float: left;
    position:relative;
}
.instabox img {
    width:100%;
    height:auto;
}
.instacaption {
    position:absolute;
    width: 100%;
    height: 40px;
    background: rgba(0,0,0,0.6);
    bottom:0;
    left:0;
    color: white;
}

JavaScript

$(function() {
    load_instagram();
});

function load_instagram() {
    var template = '<div class="instabox">'+
        		   '<img src="{{image}}" />'+
        		   '<div class="instacaption">'+
        		     '<div class="instalikes">{{likes}} likes</div>'+
        		     '<div class="instacomments">{{comments}} comments</div>'+
        		   '</div>'+
        		   '</div>';
    var userFeed = new Instafeed({
    	get: 'user',
    	userId: 1738911902,
        accessToken: '1738911902.467ede5.c9573ab665874454834eefc9b883ebf3',
        template: template
	});
	userFeed.run();
}

/*
	MINE;
    
    userId: 183266267,
    accessToken: '183266267.467ede5.a65b043461fb4f979dda7e9ac41a2fc6',
 
 	GILLYS;
    1738911902
	accessToken: 1738911902.467ede5.c9573ab665874454834eefc9b883ebf3
*/