Docs/Webflow
๐ŸŒŠ

Webflow Installation Guide

Two methods: Embed element (single page) or Project Settings (sitewide).

Estimated time: 3 minutes ยท Difficulty: Easy

Step 1 โ€” Get your embed code

Log in to your FeedPane dashboard and copy your embed code.

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

Method A โ€” Embed Element (one page)

Best for placing the widget in a specific spot on a specific page. Requires a Webflow Site plan (not starter).

  1. 1Open your project in the Webflow Designer
  2. 2In the left panel, click the + Add Elements button (or press A)
  3. 3Search for Embed under the "Components" or "Basic" section and drag it onto your canvas where you want the widget
  4. 4A code editor will open โ€” paste your FeedPane embed code and click Save & Close
  5. 5Publish your site to see the widget live

๐Ÿ’ก The Embed element shows a placeholder in the Designer โ€” you'll only see the live widget after publishing.

Method B โ€” Project Settings Custom Code (sitewide)

Best for adding the widget to the footer of every page on your Webflow site.

  1. 1Go to your project's Settings (gear icon, top left)
  2. 2Click the Custom Code tab
  3. 3In the Footer Code section, paste your FeedPane embed code
  4. 4Click Save Changes and republish your site

Positioning tips for Webflow

  • Wrap the Embed element in a Container or Section to control width and centering
  • For a full-width slider, put the Embed inside a 100% wide section with no padding
  • Use data-cols="4" or data-layout="slider" attributes to match your Webflow design

Slider layout example:

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

Troubleshooting

Embed option is greyed out / not available

The Embed element requires a paid Webflow plan. On the free Webflow plan, you can still use Project Settings โ†’ Custom Code to add the widget.

Widget not showing after publish

Make sure you've connected Instagram in FeedPane and your embed code contains your actual API key (not "YOUR_UNIQUE_KEY"). Check the browser console for errors.

Add Instagram to your Webflow site

Lightweight, responsive, and loads asynchronously.

Get Started Free โ†’