Setup Instagram Feed – Instagram Basic Display API • Facebook Account • Facebook Developer Account • Instagram Account

Step 1: Create Facebook App

1. Go to https://developers.facebook.com/ 2. Log in with your Facebook account to get a Facebook Developer Account

3. Create a New App ID

a. Fill in Display Name b. Fill in Contact Email c. Click Create App ID

4. Verify you are not a robot.

5. In the App Dashboard, go to the sidebar and click on Settings, it will dropdown, click Basic

a. Scroll down to the bottom and click on Add Platform b. Choose Website, add your website’s URL (https://groupname.caltech.edu) c. Click on Save Changes

Step 2: Configure Instagram Basic Display 1. Go to the sidebar and click on PRODUCTS

2. Find Instagram and click Set Up 3. Instagram will appear underneath PRODUCTS in the sidebar. In the dropdown, click on

Basic Display and scroll to the bottom and click on Create New App

4. Create New App:

a. Fill in Display Name b. Fill in Valid OAuth Redirect URIs with your website URL

(https://groupname.caltech.edu) c. Fill in Deauthorize Callback URL with your website URL d. Fill in Data Deletion Request Callback URL with your website URL e. Skip App Review and save

Step 3: Add an Instagram Test User 1. Navigate to Roles > Roles and scroll down to the Instagram Testers section. Click Add

Instagram Testers and enter your Instagram account’s username and send the invitation.

2. Open in a new web browser and go to https://www.instagram.com and sign into your

Instagram account that you just invited. Navigate to (Profile Icon) > Edit Profile > Apps and Websites > Tester Invites and accept the invitation.

3. Your Instagram account is now eligible to be accessed by your Facebook app while it is

in Development Mode.

Step 4: Get User Access Token If your app is solely for the purpose of generating access tokens with the User Token Generator, you do not need to submit your app for App Review. The User Token Generator does not require any permissions and can be used while your app is in Development Mode.

1. You can access the token generator in the App Dashboard > Products > Instagram > Basic Display tab.

2. Scroll down to User Token Generator and click on Generate Token next to your

account. 3. You will need to log into the Instagram account to confirm. 4. After confirming click on I understand, you might be prompt to provide your Facebook

password in order to view the user access token. You will need this for Step 5.

5. Make sure to also collect the Instagram App ID and Instagram App Secret on the same

page. You will be prompted for a password to see the Instagram App Secret.

Step 5: Link your Caltech website with your Instagram Things you’ll need from Step 4:

• Instagram App ID • Instagram App Secret • Instagram Access Token (the user access token that was just generated)

1. Log into your website and navigate to Settings > Setting Preferences 2. Select the Social Media tab at the top menu and scroll down to the Social Media Feeds

section. 3. Fill in your Instagram information:

a. Your Instagram URL b. Instagram Username c. Instagram App ID d. Instagram App Secret e. Instagram Access Token

4. Save Changes 5. Go to a page in edit mode and insert the Instagram feed.

6. Save and view your page!