Instagram Block: Step-by-Step Guide to Displaying Instagram Posts on Your Website

Instagram Block: Step-by-Step Guide to Displaying Instagram Posts on Your Website

By Michael Thompson

November 25, 2024 at 03:15 AM

Instagram blocks showcase your most recent Instagram posts directly on your website. They automatically sync with your feed, providing a dynamic showcase of your content.

To Set Up Instagram Blocks:

  1. Connect Your Instagram Account:
  • Open Connected Accounts panel
  • Click Re-authenticate
  • Convert to a business account if needed
  • Click Reset Data after connecting
  1. Add an Instagram Block:
  • Click Add Block while editing
  • Select Instagram from the menu
  • Choose your connected account
  • Set number of posts (max 20)
  • Customize design settings
  • Save changes

Design Options:

  • Slideshow: Posts appear sequentially
  • Carousel: Shows partial previews of adjacent posts
  • Grid: Thumbnail layout in grid format
  • Stacked: Full-width posts arranged vertically

Key Limitations:

  • No hashtag or search term filtering
  • Must use public accounts for clickable links
  • Only shows first image from multi-image posts
  • Doesn't support IGTV, Stories, Reels, or shared posts
  • Pinned posts won't appear at top

Troubleshooting Steps:

  1. Check Connection:
  • Open Connected Accounts
  • Verify Download Data is checked
  • Reset Data
  • Save and refresh
  1. Reconnect Account:
  • Disconnect existing account
  • Log out of Instagram
  • Reconnect through Connected Accounts
  • Reselect account in block settings
  1. Replace Block:
  • Delete existing block
  • Add new Instagram block
  • Reconnect account
  • Refresh page

Alternative Solution: If you don't have a business account, use an Embed block:

  1. Get embed code from Instagram post
  2. Add Embed block to page
  3. Paste code in Code Snippet field

For optimal performance, ensure ad blockers are disabled and keep your Instagram account public. Remember to customize caption display and click behavior in block settings for the best user experience.

Related Articles

Previous Articles