Instagram API (token)

Flatsome 3.16.8 introduces a tokenized integration method, for transitioning from Instagram Graph API to Instagram Basic Display, utilizing tokens instead of an app. This change was driven and added by the need to address continued changes and reviews on META's side. By using tokens instead of an app, the integration is less dependent. This reduces the risk of unexpected issues or downtime caused by changes or updates to the app, ensuring a more stable and reliable integration.

This guide will help you create an Instagram access token in 3 simple steps, using only your Instagram account and Facebook Developers. You will learn how to create an app on the Facebook Developer site, configure Instagram Basic Display, and generate your Instagram access token.

At first glance, transitioning to a token-based connection might seem a bit intimidating. However, this should not deter you from embracing the change. Once you become acquainted with the process, you will find that tokenized integration is very straightforward.

Make sure that your Instagram account is public.

Step 1: Add a New App on Facebook Developers

First, go to the Facebook Developers site and sign in using your Facebook profile credentials. Next, click on the 'My Apps' button at the top-right of the page. This will take you to a new page where you can click on the 'Create App' button to add a new app on Facebook Developer.

Select the "Other" option and click to the Next button.

Once you click this button, you'll be asked to choose the purpose of your app. This determines the permissions your app will require. In this case, select the "Consumer" option as shown below. Click the next button.

Next, provide a name for your app in the 'Add an app name' input field. Enter your email address and select a Business Manager if you have one. When you're finished, click on the 'Create App' button.

Congratulations! You've successfully created a new app on Facebook Developers. Now it's time to set up the Instagram Basic Display API, which allows your app to access your profile information, photos, and videos from your Instagram account. Proceed to the next step to learn how to set up Instagram Basic Display.

Step 2: Configure Instagram Basic Display

Upon creating your app on Facebook Developer, you will be directed to a new page with several options, as shown below. Click on the 'Set Up' button under Instagram Basic Display.

You will be taken to the 'Basic Display' page. Scroll down and find the 'Create New App' button. Click on this button and then enter the name of the app you created earlier.

You've now finished configuring Instagram Basic Display. It's time to retrieve your Instagram access token.

Step 3: Generate your Instagram Access Token

To obtain your Instagram access token, first, add an Instagram Test user. From the 'Basic Display' page, scroll down until you find the 'Add or Remove Instagram Testers' button.

Add the Instagram user ID of the person you want to set as your tester. If you plan on sharing your own photos and videos, simply add your own Instagram username to grant access to your account.

Once that's done, click to the "Apps and Websites" link as shown below.

Now return to your Facebook Developers dashboard. Click on the app you created and navigate to the 'Basic Display' page. Scroll down to the 'User Token Generator' section and click on the 'Generate Token' button.

A pop-up will appear that asks you to login to your Instagram account and allow the App you've just created.

Then your Instagram access token will appear as soon as you click to the "I Understand" checkbox. Copy this token to your clipboard, and you'll be able to display your Instagram posts, by adding the token to the Flatsome → Instagram → Accounts.

In the Flatsome → Instagram section enter the generated/copied token and press the '+' button. After validation, the account will appear in the account list. Press 'Save All Changes' at the bottom to save the account(s).

Requirements

3.16.8 or greater
Public Instagram account

Deprecated Instagram Graph API integration (pre 3.16.8)

From Flatsome 3.16.8 or greater use the above-tokenized connection method instead! The app is prone to error out with "Cannot call API for app xxxxxxxxxx on behalf of user xxxxxxxxxx" if the Instagram Graph API app is in review mode.

Flatsome 3.9+ is using the new Instagram Graph API to connect to Instagram. To use it, you'll need an Instagram Business or Creator account. This is a new limitation made by Facebook / Instagram and not by the Flatsome theme.

The theme will connect by an older method with Instagram by default, for backward compatibility reasons. This older method can stop working for anyone at any time due to Instagram restriction, so we highly encourage you to connect your Instagram as explained in this document.

If an error is shown "Instagram has returned invalid data" this means the theme is trying to connect with the older method and the new method is not setup/connected correctly.

1: You'll need at least Flatsome v3.9 installed.

2: Follow these steps to set up an Instagram Business Account https://www.facebook.com/help/502981923235522

Steps should be performed from a mobile device as some settings are not available from a desktop.

3: Connect your Instagram Business Account to a Facebook Page.

4: Navigate to Flatsome → Advanced → Instagram and connect to your account and select your Facebook Page.

When your account is set up and linked you should only use the connected Instagram feed account name in elements or use any hashtag