Adding an Instagram feed to your website can greatly enhance user engagement and elevate the overall visual appeal of your site. With the help of Elementor Addon Elements plugin, you have the convenient option of integrating an Instagram Feed widget, enabling you to incorporate an Instagram feed seamlessly. However, to connect an Instagram feed to your site, it is essential to generate an Instagram access token first.
In this article, we’ll walk you through the process of generating your Instagram token effortlessly. By following these steps, you’ll be able to seamlessly integrate your Instagram feed, attract more followers, and boost engagement on your website.
Table of Contents
What is an Instagram Token?
An Instagram token is a unique access key that allows you to use our Instagram Feed widget effectively. It is a mandatory requirement for utilizing the widget and displaying your Instagram feed on your website. With an Instagram token, you gain the ability to seamlessly integrate and showcase your Instagram content, creating an engaging visual experience for your website visitors.
Why do you need to generate an Instagram Token?
In order to prioritize data security and adhere to Instagram’s policies, sharing photos from third-party applications is not permitted. To ensure the integrity of your data and maintain compliance with Instagram’s guidelines, an Instagram token serves as a valuable feature.
This token acts as a secure authorization mechanism, verifying that you have permission to access and display your Instagram feed. By utilizing this token, you can confidently showcase your photos while maintaining compliance with Instagram’s policies, safeguarding your data, and providing an optimal user experience.
How to Generate an Instagram Token?
Now, we will discuss the process of generating an Instagram token. One thing you need to do is make sure that your Instagram account is public in order to generate tokens.
To begin, it is essential to have a Meta (Facebook) for the Developers’ Account or create one if you do not have it already.
Once you are ready, you can follow these steps to get the details of your Instagram app:
Step 1 – Sign in to your Meta for Developers Account. Then, locate and click on the “My Apps” option situated in the top right corner of the page.
Step 2 – Next, proceed to create a new app by selecting the “Create App” option. From there, choose either the “Consumer” app type and click on “Next“.
Step 3 – Provide a name for your app, and finally, click the “Create App” button to complete the process.
Step 4 – Once your app is successfully created, you will be directed to your App Dashboard. From there, navigate to App Settings -> Basic. Scroll down to the bottom of the page and locate the “Add Platform” button. Click on it and select “Website” as the platform option. Finally, click “Next” to proceed.
Step 5 – Now, you will notice a new section with the “Site URL” field has appeared. Enter your website URL in this field, and remember to save the changes.
Instagram Basic Display
Now, you will need to add the “Instagram Basic Display” product to your app and configure it accordingly.
Step 6 – On your App Dashboard, navigate to the menu and select “Add Product” option.
Step 7 – Scroll down until you find “Instagram Basic Display” and click on the “Set Up” button associated with it.
Step 8 – Once you have successfully added the Instagram Basic Display product, go to the Instagram Basic Display -> Basic Display. Scroll down to the bottom of the page and click on “Create New App” button.
Step 9 – Provide a name for your Instagram Display App. Subsequently, a form will appear, and you will need to complete the following fields.
- Valid OAuth Redirect URIs: This refers to a dedicated URL that is capable of capturing redirect query string parameters.
- Deauthorize Callback URL: This is a URL that is capable of handling deauthorization notifications.
- Data Deletion Request Callback URL: This refers to a URL that is used to handle data deletion requests.
At this point, you have the option to use your website URL for these fields. However, please note that you will need to replace them with valid URLs later on.
Once you have entered the required information, click on “Save Changes” to save the app settings.
Add an Instagram Test User
Before generating access tokens, it is necessary to include an Instagram tester user in your app.
Step 10 – In the App Dashboard, go to App Roles -> Roles. Scroll down to the Instagram Testers section and click on “Add Instagram Testers“. Enter your Instagram account username and click on the “Submit” button to send the invitation.
Step 11 – Next, open a new browser tab and log in to your Instagram account. Go to Profile -> Edit Profile -> Apps and Websites -> Tester Invite section and accept the invitation to become a tester for the app.
Get Your Instagram API Details
Step 12 – Go back to your App Dashboard(Meta for Developers). Click on your app and then navigate to Instagram Basic Display -> Basic Display.
Step 13 – Further down, you will find the User Token Generator section. There will be a list of test users. Locate the specific user you added earlier and click on the “Generate Token” button next to their name. A popup window will appear, and you need to click “Allow” to grant the necessary permissions.
Once your Instagram access token is generated, make sure to copy it and save it for future use.
In conclusion, generating an Instagram access token is a straightforward process that allows you to seamlessly integrate an Instagram feed into your website using Elementor Addon Elements. By following the steps outlined in this article, you can obtain the necessary access token and unlock the power of showcasing your Instagram content, enhancing user engagement, and enriching the visual appeal of your website.