Docs/Shopify
๐Ÿ›๏ธ

Shopify Installation Guide

Add your Instagram feed using the Shopify Customize editor โ€” no coding needed.

Estimated time: 3 minutes ยท Difficulty: Easy ยท Coding required: No

Prerequisites

  • โœ“ A FeedPane account with Instagram connected (sign up free)
  • โœ“ Your FeedPane embed code (from your dashboard)
  • โœ“ Access to your Shopify admin panel

Step 1 โ€” Get your embed code

  1. 1Log in to your FeedPane dashboard
  2. 2Find the Embed Code section in the left sidebar
  3. 3Click Copy Code to copy your personalised embed script

Your embed code looks like:

<script src="https://feedpane.com/widget.js" data-key="YOUR_UNIQUE_KEY"></script>

Step 2 โ€” Open your Shopify theme editor

  1. 1Go to Shopify Admin โ†’ Online Store โ†’ Themes
  2. 2Next to your active theme, click Customize
  3. 3Navigate to the page where you want to add the feed (e.g., your homepage)

Step 3 โ€” Add a Custom Liquid section

  1. 1In the left sidebar of the theme editor, scroll down and click Add section
  2. 2Search for Custom Liquid and click it
  3. 3A text editor box will appear. Paste your FeedPane embed code into the Liquid/HTML field
  4. 4Drag the section to your preferred position on the page (above footer or below collections works well)
  5. 5Click Save in the top right

Step 4 โ€” Verify it works

Open your Shopify storefront in a new browser tab. Scroll to where you placed the widget โ€” you should see your Instagram feed loading within a few seconds.

โœ… Success indicator: You'll see a grid (or slider) of your Instagram photos. If it shows a loading message briefly before the feed appears, that's normal โ€” the widget loads asynchronously.

Optional: Customise the widget

You can customise the layout by adding attributes to your script tag:

Grid layout (default) โ€” 3 columns on desktop, 2 on mobile:

<script src="https://feedpane.com/widget.js" data-key="YOUR_KEY"></script>

Slider/carousel layout:

<script src="https://feedpane.com/widget.js" data-key="YOUR_KEY" data-layout="slider"></script>

4-column grid with small gap:

<script src="https://feedpane.com/widget.js" data-key="YOUR_KEY" data-cols="4" data-gap="3"></script>

Recommended placement on Shopify stores

  • Above the footer โ€” high visibility, seen on every page visit
  • Below "Featured Collections" โ€” great for social proof near products
  • On a dedicated "Gallery" page โ€” for photography or lifestyle brands
  • Product page โ€” shows real-world usage of the product

Troubleshooting

Widget isn't showing up

Make sure your Instagram account is connected in the FeedPane dashboard and your account has posts. Also check that you pasted the embed code โ€” not just the API key โ€” into the Custom Liquid field.

Widget shows "No posts found"

Your Instagram account may have just been connected. Feed data is fetched hourly โ€” wait up to 60 minutes, then refresh.

Custom Liquid section isn't available

Custom Liquid requires Shopify Online Store 2.0 themes (Dawn, Craft, Sense, etc.). If you're on an older theme, use the Theme Code Editor instead: go to Online Store โ†’ Themes โ†’ Edit Code โ†’ find the template file for your page, and add the embed code where you want the feed to appear.

Ready to get started?

Create your free FeedPane account and have your Instagram feed on Shopify in under 5 minutes.

Get Started Free โ†’