Get Instagram Access Token
With the Instagram Feed widget (a part of the Ocean Elementor Widgets premium extension), you need to generate an access token in order to display your photos. It is assumed you already have a registered public Instagram account and photos published.
Step 1 - Register Application on Facebook for Developers
Before getting your Access Token you need to "create an app" on Facebook for Developers.
1.1 Log into Facebook
1.2 Go to Facebook Developers Account
Facebook for Developers is an independent service. You can use your existing or you can register a new account which you will confirm using the verification code Facebook will send to your mobile phone.
1.3 Add a New App
Clicking the Create App button will trigger a modal window where you will need to specify what exactly should your app do.
First select More Options.
Then choose Something Else in order to register an app with a custom permissions set.
Step 2 - Register New App
Adding an app will open a pop-up window where you need to insert:
- a name for your app,
- contact email address,
- connect your Business Manager Account in case you have one and wish to connect it.
Note: You may be prompted to go through a "I'm not a robot" and reCaptcha security check.
Step 3 - Configure Instagram Basic Display
After you have successfully added a new app, you will be redirected to a new page where you need to configure Instagram Basic Display and also add a tester in order to generate your Access Token.
3.1 Click Set Up under the Instagram Basic Display
Note, you will see two different Instagram options. Choose Instagram Basic Display.
3.2 Navigate to the Basic Display and scroll to the very bottom of the page. Click the Create New App button
You will be redirected to Basic Display section automatically, but in case you wonder off go back to this section.
3.3 As the name of the App choose the name you created in Step 2
This name will be displayed automatically so do not change it.
Step 4 - Get the Access Token
This is the part where you need to add an Instagram Tester (test user) in order to generate an Access Token.
4.1 Navigate to the Basic Display section
After creating an app you will be automatically redirected to this section.
4.2 Find the Add or Remove Instagram Testers section and click the button
Note, there are two tester options, so make sure to add a tester to the Instagram Tester section.
4.3 Add the Instagram User ID (IG username) for the account you want to add as an Instagram Tester
When you add the IG username to the field, a dropdown menu with suggested IG users will appear so as to make sure you have entered correct details.
4.4 Log into the Instagram account of the username you added as the Instagram Tester
Log into your Instagram account here.
4.5. Navigate to Settings > Apps and Websites, and click on the Tester Invites tab
4.6 Click Accept to approve the invitation
4.7 Now navigate back to the Facebook Developers dashboard
4.8 Find the app you created, then navigate to Basic Display
4.9 Scroll to the User Token Generator Section and click the Generate Token button
Note, you may need to re-login to the Instagram account again in order to allow specific permissions before the token is being generated.
4.10 Copy the Access Token from the pop-up window
Step 5 - Display your feed in the Instagram Feed widget
The last step is to add the Access Token. Go to the page where you added the Instagram widget and copy the Access Token into the input box provided. That's it! You are ready to display the Instagram Feed on your website!