Setting up a feed and the official Instagram API

One ore more 'feeds' can be created within the Instagram Feeds / Feeds section of the Dashboard

A feed is simply a reference to an Instagram account and the images it finds when they are fetched.

Fetch Method 

There are two different ways that feeds can be configured to fetch images:

  • Official API - The current official way Instagram provides API access. It takes about 5 minutes to set up.
  • Simple Method - this only needs the Instagram handle. It is very easy to set up, but it may cease to function in the future. 

 

Using the Official API

Check out a video guide on how to use the official API.

Some instructions are provided on the Feed setup page within the add-on, but the steps are:

  • Create a new feed in the dashboard, entering in your Instagram handle and selecting the Official API as the fetch method. You will see two fields, Client ID and Client Secret - you will need to copy some text into these.
  • Before saving this feed, open https://www.instagram.com/developer/ in a new tab/window and log in with the same credentials as the Instagram handle you have entered.
  • If prompted complete the 'developer' sign up steps
  • Click on 'Manage Clients' on the top toolbar
  • Click on 'Register a New Client'
  • Enter in the details for your site. Specially you will need to copy an address display within the 'Register Feed' page within concrete5's dashboard into the Valid redirect URIs, it will be in the format http://yourwebsite.com/index.php/dashboard/instagram_feeds/feeds
  • Once you have entered all details the Client can be registered (the Security tab can be ignored)
  • Click the Manage button next to the newly registed client
  • Towards the top of the screen you will see two long codes, one for Client ID and one for Client Secret. Copy these two codes into the corresponding fields on the Register Feed page. Once you have done this you can close the Instagram developer page.
  • Finally, press the Add Feed button within the Dashboard page.
  • You will be redirected to an Instagram page where it will ask for your Authorization. Press the Authorization button.
  • You will then be redirected back to your concrete5 website and see a message 'Access Token Saved'.

After these steps, you should be able to press the green Fetch Now button against your new feed. After a few moments the page will refresh and report that some images have been found. Editing the feed again you should see an additional field, Access Token. If you see another code in this field you have successfully connected to Instagram's API.

If through this process you view a simple white screen with an error message, hit the back button and check the credentials you entered. Also, if you have an Access Token, but the feed appears to stop working correctly, remove the Access Token (but leaving the Client ID and Client Secret values) and save the feed again - a new access token will be saved.

It is recommended that you set up your feeds using the Offical API, but if you simply cannot get this to work, the Simple Method can be used as the alternative.