Instagram Feed Design with Instafeed.js

A Instafeed.js nice design. This is a similar design to Victoria Secret Pink Instagram Follow.

This is an example of the instagram API using instafeed.js. This is a similar design used in Instagram Feed from Victoria Secret Pink.

This is the styles that being used in the design.

<style type="text/css">
      #theContainer{
        margin-top: 80px;
      }
      h1{
        font-family: 'Raleway', sans-serif;
        font-weight: 300;
      }
      .instaImg img{
        width: 20%;
      }
      .center{
        text-align: center;
      }
      .instagramFollow{
        background-color: #f39c12;
        padding-top: 5px;
        padding-bottom: 5px;
        border-bottom-left-radius: 0.5em;
        border-bottom-right-radius: 0.5em;
      }
      .instagramFollow h3{
        font-family: 'Changa One', cursive;
        text-transform: uppercase;
        margin-top: 8px;
        color: #ecf0f1;
      }
      .instagramFollow a{
        color: #ecf0f1;
      }
      .followIcon{
        float: right;
        padding-right: 10px;
      }
</style>

 

This are the HTML element using the instagram.min.js plugin. 

<div class="container"> 
      <div class="col-md-12" id="theContainer">
        <h1 class="center">Instagram Feed Similar to Victoria Secret Design</h1>
        <div id="instafeed"></div>
        <div class="instagramFollow">
          <h3 class="center"><a href="http://instagram.com/houzz" target="_blank">FOLLOW @houzz </a><span class="followIcon"><a href=""><i class="fa fa-instagram"></i></a></span></h3>
        </div>
      </div>
</div>

 

View Demo

GitHub Files