Prerequisites

The.com BasicsZapier

Intro

Instagram has changed how its API works, and we are working on developing an integration that pulls Instagram information directly to The.com.

A current solution is to use Zapier to get post information from Instagram and then send it to a Sheet. You will need a Zapier account.

Set up

Zapier allows access to the following pieces of data from an Instagram post:

• Username

• Caption

• Media URL

• Permalink

• Post Type

• Timestamp

• Thumbnail URL

• ID

• Children (if multiple media items in a post)

In The.com, you'll need to set up a Sheet to hold the information from Instagram and a Block to show it.

Set up a Sheet

Create a new Sheet and give a column name for the data you want to include from Instagram.

In the example above, we've set up columns for:

• Username

• Caption

• Media URL

• Permalink

• Post Type

• Timestamp

• Thumbnail URL

• ID

• Children

When setting up the Zap, you can choose which pieces of data you want, so you don't have to get all of them. Remember to save the Sheet.

Create an Instagram Post Block

You can choose how to display the post data however you want. This tutorial will go through making a post with an image, username, and caption.

The steps below can be seen in the video above.

1. Create a block and name it Insta Post.

2. Add an Image and a Div element to the block. Give the Image a width and max-width of 100% so it spans the full width of its container.

3. Within the created Div, nest a Paragraph and then nest two Inline elements within that Paragraph.

4. Click on Set Variables and create three variables called Image, Username, and Caption. Paste a file URL (or drag and drop a file) in the default value for the Image variable. The image is just a placeholder, so it doesn't matter what it is. Write whatever you want in the Username and Caption default values.

5. Click on Back to Edit and assign the variables to the Elements.

6. Style the Div with 1rem 0.5rem for padding and make the first Inline Element (the username) bold.

7. Add a background color of #FFF to the whole block.

Now with the Sheet and Block set up in The.com, we can start creating the Zap.

Instagram to The.com Zap

1) Connect your Zapier, Instagram, and The.com accounts.

1. On the Sheet you set up earlier, click Zapier

2. Follow the steps to sign in to Zapier if you haven't. Then follow the steps to sign in to your Instagram account. If you are already signed in on your current browser, you won't have to sign in manually.

3. Select the email address that is associated with your The.com account.

2) Start Configuring the Zap

Now with all the accounts linked, you can start creating the Zap by configuring a trigger and an action.

1. Select Create or update or Create. This means that the Zap will trigger either when a post is created and updated or just when a post is created.

2. Select the Site and the Sheet ID you want this Zap to go to.

3. Follow the steps to include or exclude any values that are being pulled from Instagram.

4. Make sure that the right data points from Instagram are going to the correct columns in your Sheet.

5. Click Send Test, then turn on the Zap.

6. Refresh the page and click on the Insta Info Sheet. You should now see a row that corresponds to your most recent Instagram post.

3) Create the Sheetfeed

1. Create a new Block and name it Insta Feed

2. Add a Sheetfeed Element and select it to pull data from the Insta Info Sheet.

3. Click on this element's corner menu to get access to its attributes. Change the starting row to 2, since the first row is column headers. Exit this editing mode.

4. Add the Insta Post Block so that it is a child of the Sheetfeed. Click in to edit its attributes. Set the Username to =A, Image to =C, and Caption =B .

You should now see the data from Instagram populate your Block!

Zapier Limitations

Can only display the first media item.

This means that if your post is a carousel with multiple images, you will only be able to show the first one.

Cannot pull in data from previous posts.

Only new posts will be added to the Insta Info Sheet.