<!-- **** IMPORTANT *****
You need to add a reference to both the JS File link from your Instant Tokens account and the Instafeedv3.js in your HEAD Tag
<script src="[LINK TO INSTANT TOKENS JS FILE GOES HERE]"></script>
<script src="[LINK TO INSTAFEEDV3.JS FILE GOES HERE]"></script>
-->
<!-- Container for Instagram Feed -->
<div id="instafeed">
</div>
/* Custom Styles for demo purposes */
$lg: 580px;
html,
body {
margin: 0;
padding: 10px;
background: darken(whitesmoke, 10%);
}
#instafeed {
max-width:1080px;
width: 100%;
margin: auto;
display: flex;
flex-wrap: wrap;
a {
display: flex;
align-items: center;
position: relative;
width: 50%;
background: white;
@media only screen and (min-width: $lg) {
width: 25%;
}
img {
display: block;
width: 270px;
max-width:270px;
height: 270px
}
}
}
View Compiled
<!-- JS Code to load and Run the Instafeed.js plugin -->
<!-- The variable InstagramToken is automatically created from the Instant Tokens JS File -->
$(document).ready(function() {
var feed = new Instafeed({
accessToken: InstagramToken,
});
feed.run();
});
This Pen doesn't use any external CSS resources.