Instagram Webflow Integration

Your Instagram feed was pasted into the site as an afterthought. Now the page loads slower, the grid ignores your design system, and somebody has to fix it every few months when a token expires or a script changes.

Here is the short answer. Webflow has no one-click native Instagram connection. There are four routes: the SI Instagram Feed app, an embed widget, automation into the Webflow CMS, and the Instagram Graph API with custom code. Each one trades design control, speed, SEO value and upkeep differently.

This page helps you pick the route by what your site has to do, not by which widget has the best landing page. It also shows how we build it at Overflow, so your marketing team runs it without a developer.

One requirement up front: to show a live feed, you need an Instagram Business or Creator account. A personal account won't connect.

How does Instagram connect to Webflow?

Instagram and Webflow connect through a tool in the middle. Webflow explains that Instagram's Graph API authentication can't be handled by frontend hosting alone. So you use an app, a widget service, an automation tool, or your own server-side code to fetch the posts.

For live content, the Instagram account must be a Business or Creator account. Those are the account types with access to the Graph API.

The four routes in one line each:

• SI Instagram Feed app: the only native Instagram app in the Webflow Marketplace. Install, authorize, pick a layout.
• Embed widget: build the feed in a service like Elfsight or EmbedSocial, then paste its snippet into a Code Embed element.
• Automation into the CMS: Zapier, IFTTT or viaSocket create Webflow CMS items from new Instagram posts.
• Graph API plus Webflow Data API: your own code fetches posts and writes them to Webflow, with full control over mapping.

Many sites combine two of these, for example a widget in the footer and a synced collection for a news page.

Which Instagram Webflow integration method should you use?

Judge the methods on what a B2B site needs: design control, setup effort, SEO value of the content, page speed risk, cost and who maintains it. Here is how the four compare.

• SI Instagram Feed app. Design control: limited to the app's layouts. Setup: low, no code. SEO value: low, the posts aren't Webflow CMS content. Speed risk: medium, it loads an external feed. Cost: has a free plan. Maintained by: the app vendor, with you re-authorizing if needed.
• Embed widget (Elfsight, EmbedSocial). Design control: medium, through the widget's settings and custom CSS. Setup: low to medium. SEO value: low, the content sits inside a script. Speed risk: medium to high, because it adds a third-party script. Cost: free tiers exist, full features need a paid plan. Maintained by: the widget vendor, plus you for the embed.
• Automation into the CMS (Zapier, IFTTT, viaSocket). Design control: full, because the posts are CMS items styled in your design system. Setup: medium. SEO value: medium, the content can be real HTML on the page. Speed risk: low if kept light. Cost: automation subscription. Maintained by: your team, with the automation as a dependency.
• Graph API plus Webflow Data API. Design control: full. Setup: high, it needs server-side code and token handling. SEO value: medium to high, depending on what you publish. Speed risk: low. Cost: development and hosting. Maintained by: a developer.

Four questions that decide it

• Does it have to match the brand exactly? If yes, lean towards CMS sync or the API. A widget can get close but not all the way.
• Should the posts be indexable content? Only CMS items or API-published content can be real text on your pages. Most embeds are not.
• Do you need Stories or hashtag feeds? Widget services cover these. The other routes mostly don't.
• Who will maintain it? If the answer is "nobody", choose the app or a widget. If marketing owns it, a CMS collection is easier to live with than a script.

Facts to know before you start

• The SI Instagram Feed app is the only native Instagram app in the Webflow Marketplace. The others are third party.
• The Code Embed element needs a paid Site plan, so widgets don't work on a free plan.
• Widgets don't render on the Designer canvas. You see a placeholder and have to check the feed on a published site.

Method 1: Install the SI Instagram Feed app

This is the fastest route to a working feed, and it needs no code. Per Webflow's integration page, the app has a free plan, and it doesn't require a Code Embed element.

1. Install SI Instagram Feed from Webflow Apps.
2. Authorize it with your Instagram Business or Creator account.
3. Choose a layout and set up the feed in the app: marquee with scrolling rows, masonry grid, slider, or a featured grid for magazine-style sections.
4. Add it to the page, publish, and check it on the live site.

Best for: a quick feed on a page where Instagram is a small supporting element.

Limits: you get less layout control than with your own components, and the posts are not Webflow CMS content. You can't filter, tag or reuse them across pages the way you can with a collection. "Approved by Webflow" means it passed a quality review, not that Webflow endorses it.

Method 2: Embed a widget with Elfsight or EmbedSocial

Widget services handle Instagram authentication, token refresh and polling for you. You configure the feed in their dashboard and paste a snippet into Webflow. The steps are the same for most services, and Webflow has a help article for Elfsight.

1. Create the feed in the widget dashboard: choose a template and add your source.
2. Style it in the editor and publish the widget.
3. Copy the embed code.
4. In Webflow, add a Code Embed element, paste the code and save.
5. Publish the site and test the feed on the live or staging domain.

What each service is good at

• Elfsight can combine accounts, hashtags and specific post URLs in one widget, and has filters to show or hide posts by words or hashtags.
• EmbedSocial supports Instagram Stories, shoppable posts and content moderation. Webflow's page notes a free plan with one source.

Trade-offs

A widget adds a third-party script to your page. That costs load time, and styling stops where the widget's settings stop. Full features usually sit on paid monthly plans. If the feed is low on the page, load it late. Our guide to Webflow page speed covers how scripts affect the metrics Google measures.

Single post: Instagram's native embed

If you only want to feature one campaign post or Reel, use the embed option on the post itself in a desktop browser. It needs no third-party account and no Business account. But it shows that one post permanently and never updates.

Method 3: Sync Instagram posts into Webflow CMS collections

With this route, Zapier, IFTTT or viaSocket creates a Webflow CMS item each time you publish a new Instagram post. The post is no longer a script on the page. It is content in your CMS.

That gives you full design control. The items use your own components and classes, so they match the rest of the site exactly. You can also filter, tag and reuse posts: show only event posts on the events page, or a few recruiting posts on the careers page.

How we model it

We keep the CMS collection small: image, caption, permalink, date and a category. The category is the field that makes reuse possible. Because it's plain content and not a heavy script, the feed stays light, and your team can hide or reorder items in the CMS like any other content.

If you already use Zapier in your stack, see our Webflow Zapier integration page for how we set up automations.

Caveats

• You need an automation subscription, and your volume of posts affects which plan you need.
• There is a short delay between posting and the item appearing.
• Check Instagram's terms for media use, and decide where images are hosted, before you store content in your own CMS. If the content isn't yours, get clarity on rights first.

Method 4: Build with the Instagram Graph API and Webflow Data API

The API route gives you full control over mapping, publishing and data handling. Your own code calls the Instagram Graph API for media, then uses the Webflow Data API to create or update CMS items. It needs server-side code, because tokens must be stored and refreshed somewhere safe, not in the browser.

It's worth the cost in three cases:

• You run many accounts, for example several brands or regional teams, and need one logic for all of them.
• You need strict governance: approval steps, field mapping rules, or logging of what was published.
• Instagram content drives templates at scale, and you need more than an automation tool can handle.
• If none of these apply, Method 3 will do the job for much less.

Some pieces, like a small front-end enhancement, can sit in Webflow custom code. The token handling and sync job should live on a server you control.

What to watch out for: speed, SEO and tracking

Speed

Lazy-load the feed when it sits below the fold, so it doesn't compete with your hero content and hurt Core Web Vitals. Limit the number of posts shown. Run Lighthouse before and after you add the feed, so you see what it costs. Our Webflow page speed guide explains the metrics.

SEO

Embedded feeds are mostly not indexable text. Search engines see a script, not your captions. CMS-synced content can be indexed, but only add it if it helps readers. A wall of captions about lunch breaks adds nothing to a service page. For the wider picture, see Webflow SEO.

Accessibility, links and privacy

• Write useful alt text for images you control. For synced posts, consider using the caption or a short description.
• Open Instagram links in a way that fits the page, and make link text clear.
• Third-party widgets may set cookies or load external resources. Check cookie and privacy needs with whoever owns privacy in your company. This isn't legal advice.

Does your B2B site need an Instagram feed?

Sometimes. A feed works well for culture, events, recruiting and showing that the company is active. A buyer who lands on your careers page or event page likes to see real people and real moments.

It is not a substitute for case studies, clear messaging and a strong offer. Those convert B2B buyers. Place the feed where it supports trust, usually lower on the page, not above the offer. If your Instagram is quiet or off-brand, leave it out and spend the effort on content that sells.

How Overflow builds Instagram Webflow integrations

We build integrations like this as part of Playbook 01, our B2B Marketing Website: strategy, Figma design system, Webflow development, QA and handover. The Instagram feed is one component in that system, not an add-on bolted on at the end.

1. We pick the method with you, based on what the feed must do on your site and who will run it.
2. We build it into the design system and components, so it follows your styles and works on every breakpoint.
3. We test speed, with Lighthouse before and after.
4. We hand over with docs and video, so your marketing team runs it without a developer.

We are an official Webflow Certified Partner, we have built 40+ Webflow sites, and our builds ship in 4 to 8 weeks, with Lighthouse scores of 95 to 98+ on our cases. We don't promise specific results, because they depend on your market and content.

Want an Instagram feed that fits your design and doesn't slow the site down? Talk to us about your Webflow site. See what a Webflow agency engagement looks like, or browse all Webflow integrations.

Related Webflow integrations

The rest of your stack matters as much as the feed:

• Webflow HubSpot integration for forms, CRM and lead tracking.
• Webflow Zapier integration for automations between your tools.
• Webflow Mailchimp integration for newsletter sign-ups.
• Webflow Google Sheets integration for simple data sync and reporting.

Instagram Webflow integration FAQ

Is there an official Instagram integration for Webflow?

Only the SI Instagram Feed app is a native app in the Webflow Marketplace. Widgets like Elfsight and EmbedSocial, and automation tools like Zapier, are third party.

Do I need a paid Webflow plan?

For the Code Embed element, yes. Widget feeds need a paid Site plan. The SI Instagram Feed app doesn't need a Code Embed element.

Can I show an Instagram feed without a third-party tool?

For single posts, yes: use Instagram's native embed. It doesn't update. Live feeds need an app, a widget or your own API build.

Why doesn't my feed show in the Designer?

Widgets render only after you publish. In the Designer you see a placeholder. Check the feed on your staging or live domain.

Can I display hashtag or Stories content?

Yes, through widget services. Elfsight supports hashtag sources, and EmbedSocial supports Stories and hashtag feeds.

Does an Instagram feed slow down Webflow?

It can, because most feeds add an external script and images. Show fewer posts, lazy-load the feed below the fold, and measure with Lighthouse before and after. A light CMS collection adds the least weight.