/ Programming

How to Embed Instagram on Ghost

We will embed instagram using Instafeed. Recently, Instagram very aware about security, because we know Facebook Data Scandal happened in early 2018.


Step by step:

  1. Download Instafeed.js

  2. Write this javascript code to another file, let say instagram.js

  var userFeed = new Instafeed({
    get: 'user',
    userId: '2301975641', // chage with your userID
    clientId: 'c85e772b1dd9405eae654e0e333a80d1', // change with your clientID
    accessToken: '2301975641.c85e772.049f3b97326b4d3ea7a1bb976066d419', // change with your accessToken
    resolution: 'standard_resolution',
    sortBy: 'most-recent',
    limit: 5,
    links: true
  });
  userFeed.run();
  1. In default.hbs create <div id="instafeed"></div>. Instafeed with automatically look for a <div id="instafeed"></div> and fill it with linked thumbnails.

  2. Call your javascript instafeed.js and instagram.js in default.hbs

<script type="text/javascript" src="{{asset "js/instafeed.js"}}"></script>
<script type="text/javascript" src="{{asset "js/instagram.js"}}"></script>

Summary

So, if you are developer or end user. You just need to change userId, clientID, and accessToken. You could get it from https://www.instagram.com/developer/