How Do I Show My Instagram Feed on Squarespace?

Displaying your Instagram feed on your Squarespace website can greatly enhance the visual appeal and social engagement of your site. Here’s a comprehensive guide to integrating your Instagram feed with Squarespace:

Steps to Display Your Instagram Feed on Squarespace:

1. Connect Your Instagram Account

Before you can display your feed, you need to connect your Instagram account to your Squarespace account:

1. Log In to Squarespace:

2. Navigate to your Squarespace website and log in to your account.

3. Open Settings:

4. Click on the "Settings" button located in the left-hand panel.

5. Access Connected Accounts:

6. In the “Settings” menu, go to “Connected Accounts.”

7. Connect to Instagram:

8. Click on the “Connect Account” button.
9. Select “Instagram” from the list of available accounts.

10. A pop-up window will appear prompting you to log in to your Instagram account. Enter your Instagram credentials and authorize Squarespace to access your Instagram account.

11. Configure Settings:

12. After connecting, you can configure how your Instagram posts appear (e.g., showing captions, selecting the number of posts to display).

2. Add Instagram Feed to Your Website

Once your Instagram account is connected, you can add the feed to your pages or sections on your Squarespace site:

Using the Instagram Block:

1. Edit Your Page:

2. Navigate to the page where you want to display the Instagram feed.

3. Add a Block:

4. Click the “Edit” button to enter edit mode.

5. Hover over the area where you want to add the Instagram feed and click on the “+” (Plus) icon to add a block.

6. Select Instagram Block:

7. In the “Block Menu,” scroll through or search for the “Instagram Block.”

8. Click on the Instagram Block to add it to your page.

9. Configure Instagram Block:

10. The block will automatically display posts from the connected Instagram account.
11. You can further customize the display settings such as the number of posts (up to 20), grid display, and spacing between images.

3. Design and Customize

Fine-tuning the appearance of your Instagram feed to match your website’s design:

1. Style Options:
2. Many Squarespace templates and blocks offer style customization options.

3. You can adjust the layout, number of columns, gutter spacing between images, and more within the block’s settings.

4. CSS Customization (Advanced Users):

5. For advanced customizations, you can inject custom CSS. Go to “Design” > “Custom CSS” and add your own styles.
6. This requires knowledge of CSS, but it allows for extensive customization beyond the built-in options.

4. Verify and Test

Ensure everything is functioning and displaying as desired:

1. Check Responsiveness:
2. Verify that your Instagram feed looks good on both desktop and mobile views.

3. Adjust settings if required for better responsiveness.

4. Test Functionality:

5. Ensure that the Instagram block is dynamically updating with new posts from your Instagram feed.
6. Sometimes, it may take a few minutes for changes to reflect.

Considerations and Limitations:

• API Changes: Instagram’s API policies and access permissions may change, affecting how third-party integrations work. Always ensure your account maintains necessary permissions.

• Privacy Settings: Ensure your Instagram account is not set to private, or the feed won’t display on the website.

• Data Refresh Rate: Updates to your Instagram feed on your website may not reflect instantly due to caching and data refresh rates.

• Custom Layouts: For unique or branded layouts, consider using third-party plugins or embedding custom code if your design needs aren’t fully met by Squarespace’s built-in blocks.

By following these steps, you can effectively show your Instagram feed on your Squarespace site, enhancing both visual appeal and user engagement.