How To Use Instagram Module

Instagram block is easy to use and configure module that allows you to show your instagram photos on site in a block.

To use this module, you need to create Instagram client application. The steps are as follows:

1. Login to instagram with the account from which you want to show photos.

2. Goto https://www.instagram.com/developer/clients/manage/ and click on "Register a new client"

3. Fill in all the details and register. Make sure you enter URL with HTTP or HTTPS in redirect URI. This URI should be URL of your website.

4. Upon saving the Client, you will see client ID and client secret. This Client ID will be used later to generate access token to use with instagram module.

Once Instagram client is created, it's time to download and enable instagram block module. The module can be found here . 

Steps to configure instagram_module:

1. Download this module and enable it normally.

2. Go to admin/config/services/instagram_block, you will see that you need to add user ID and access token here. Note that user ID is not same as Client ID generated with Instagram client.

3. To get these details, we need to use following URL: https://www.instagram.com/oauth/authorize/?client_id=[client id from Instagram client]7&redirect_uri=[redirect URI from instagram client]&response_type=token (You might get "Implicit authentication is disabled" error. In this case, edit your client and uncheck "Disable implicit OAuth" from security tab.)

You will be asked to authorise the user and once you authorise you will be redirected to redirect URI you specified in client info. The URL will contain the access_token as well.

For example, http://test.com/#access_token=xxxxxxxxxx.yyyyyyyyyyyyyyyyyy Everything that precedes the first dot in access_token is the User id. Check this screenshot:

4. Add these details in admin/config/services/instagram_block and save.

5. Goto admin/structure/block. Instagram blocks add a block called "Instagram Block - User Block". You can control how many images to show, image resolution and preview style from this block configuration. Assign this block to desired region and you are all set.

Here’s the final results:

You can also use multiblock to make a more than one instagram blocks on the site.

You can style this block the way you want. Change number of images showing and size of images.