FeaturesPricingBlogResourcesContact
Sign inGet Started Free

How to Add an Instagram Widget to Squarespace: The Complete Guide

Squarespace is the website builder of choice for designers, photographers, restaurants, and creative professionals — people who care deeply about how things look. So it's worth asking: does Squarespace's native Instagram integration actually live up to the platform's design reputation? And if not, what's the better option? This guide answers both questions.

Whether you're on Squarespace 7.0, 7.1, or the newer Squarespace versions, we cover exactly how to embed a live, professionally designed Instagram feed — and how to make it work harder for your site than a basic social block ever could.


Squarespace and Instagram: What's Built In

Squarespace does have a native Instagram integration. In the Page Editor, you can add an Instagram block that connects to your account and displays recent posts. For some use cases, this is entirely adequate — it's fast to set up, it lives within the Squarespace design system, and it looks reasonably clean out of the box.

But the limitations are real, and they matter for exactly the types of sites Squarespace attracts. There's no content curation — you can't pick which posts appear. Layout options are limited. There's no support for combining Instagram with other platforms. And for Squarespace users who have spent time crafting a precise visual identity, the native block's styling constraints can be frustrating.

If you need more control — over which posts show, how the layout looks, and whether you can blend Instagram with other content types — you need a third-party approach.


Prerequisites: What You Need Before Starting

Both the native Squarespace integration and any third-party tool require the same baseline: an Instagram Business or Creator account linked to a Facebook Page. Personal Instagram accounts don't support API access, which is what any feed widget relies on.

If you're still on a personal account, switch it to Professional in the Instagram app: Settings → Account → Switch to Professional Account. Choose Business or Creator based on your situation — both work for feed embedding purposes. Then link it to your Facebook Page through Instagram's Linked Accounts setting.

You'll also need Squarespace plan access that supports Code Blocks (the Custom Code injection method). This is available on Business plans and above. Personal plans in Squarespace do not support custom code injection, which limits your options to the native Instagram block only.


Method 1: Squarespace's Native Instagram Block

To use the native block, open your Squarespace page in edit mode. Click the "+" button to add a block, search for Instagram in the block library, and add it to your page. You'll be prompted to connect your Instagram account — follow the OAuth flow to authenticate. Once connected, the block will display your recent posts in a basic grid.

You can adjust the number of columns and the spacing, and you can control whether the block links out to Instagram or opens a lightbox on click. That's roughly the extent of customization available.

For sites where Instagram is more decorative than strategic — a simple "find us on Instagram" section at the footer — this is a reasonable choice. For sites where the Instagram feed is a meaningful part of the conversion or trust-building journey, it falls short.


Method 2: Custom Embed with a Social Aggregator

Squarespace supports custom HTML injection via Code Blocks on Business plans and above. This means you can paste any embed code — including a script tag from a social aggregator like CollectSocials — directly into your Squarespace page.

This unlocks a completely different level of control: professional layout options, full content curation, multi-platform support, and a design studio that lets you match the widget's aesthetic to your Squarespace template. For a platform that attracts design-conscious users, this is typically the right approach.


How to Embed an Instagram Feed on Squarespace with CollectSocials

Step 1: Sign Up for CollectSocials

Create a free account at CollectSocials. The 7-day trial includes all features — no credit card required. After signing up, you'll be in your dashboard, ready to create your first feed.

Step 2: Create a Feed

Click "Create Feed." Name it something descriptive — "Squarespace Portfolio Feed" or "Homepage Instagram Widget." Feeds are the containers that hold your content sources, and each feed maps to one embeddable widget. If your Squarespace site needs different Instagram content on different pages, create separate feeds for each.

Step 3: Connect Instagram as a Source

Inside your feed, add Instagram as a source. CollectSocials uses Meta's official OAuth to authenticate — you'll log in with your Facebook account, grant the necessary permissions, and select your Instagram Business account. Your posts, reels, and carousels will import immediately.

CollectSocials source connection interface for Instagram
Source setup: Connect your Instagram Business account in one click. Posts sync automatically to your feed.

If you want to create a richer feed by combining Instagram with other platforms — Google Reviews for credibility, YouTube videos for content depth — add those as additional sources. Everything flows into one unified feed that renders as one clean widget on your Squarespace page.

Step 4: Curate Your Posts

The Collect page shows every imported post. Select which ones you want displayed on your Squarespace site — and leave everything else deselected. For Squarespace users who have spent time building a visual brand, this curation step is especially important. Your widget should only show the posts that reflect the quality and aesthetic of your site.

You can also edit post captions inline. If a post's original Instagram caption includes hashtags and emoji that feel out of place on a professional Squarespace site, clean it up here before it goes live on your page.

Step 5: Design Your Widget in the Design Studio

Squarespace users typically care a lot about design, so this step deserves real attention. Start with layout:

Design Studio
My Instagram Feed
Save Changes
Get Code
Layout
Grid
Masonry
Carousel
List
Mosaic
Marquee
Theme
Minimal
Bold
Glass
Elegant
Neon
Display
Rating
Date
Avatar
Badge
Preview — Grid · MinimalB2B · Corporate
Instagram Feed
S
Sarah Kim
M
Mark Chen
A
Amy Liu
J
Jake Rao
R
Rita Patel
D
Dan Brooks

Creating Instagram widgets that match Squarespace's design-forward aesthetic

CollectSocials design studio showing layout and theme options for Squarespace
Design studio: Choose from Masonry, Grid, Mosaic layouts and Minimal, Elegant, Bold themes to match your Squarespace aesthetic

Masonry is the most popular choice for creative professionals on Squarespace. The varied-height layout feels editorial and sophisticated — it mirrors the visual language of design-forward publications and fits naturally alongside Squarespace templates that prioritize beautiful imagery.

Grid creates a clean, structured aesthetic. For architecture firms, interior designers, product brands, and other businesses where visual order is part of the brand identity, grid layout signals professionalism and care.

Mosaic works well when you want the feed to feel like an art installation — varied tile sizes creating an asymmetric, gallery-like layout. High impact, best used with high-quality photography.

Carousel is the right choice when the feed needs to occupy a compact horizontal space without dominating the page — inside a two-column section, for example, or just below a hero image.

For themes: Squarespace templates tend toward the minimal and elegant, so the Minimal, Elegant, and Mono themes in CollectSocials integrate most naturally. If your template is bolder or more expressive, Bold or Vivid can complement that energy. Toggle display options — dates, avatars, platform badges — based on how much metadata feels right for your design context. For portfolios and lifestyle brands, hiding dates and platform badges often creates a cleaner look.

CollectSocials note: Squarespace attracts design-conscious users who have spent real time on their site's visual identity. We built the Design Studio specifically for this audience — 14 layouts, 15 themes, and granular control over every display element. Squarespace's native Instagram block gives you a basic grid and minimal customization. For sites where design matters, that's a meaningful limitation. Learn more in our complete widget guide.

Step 6: Get Your Embed Code

Set your feed to Public and copy the generated <script> tag. One line of code is all you need.

CollectSocials embed code modal showing generated script tag
Embed code: Copy the script tag and paste it into Squarespace's Code Block. That's it.

Step 7: Add the Widget to Your Squarespace Page

In the Squarespace Editor, open the page where you want the feed. Click the "+" button to add a block, search for "Code", and add a Code Block to your layout. Paste your CollectSocials script tag into the code block — make sure the code block is set to HTML (not Markdown). Save and exit the editor.

Instagram🔒
🚀
🏆
💡
🤝
auto
sync
yoursite.com
Instagram Feed
0/4
Posts locked in LinkedIn...

How your curated Instagram content becomes a permanent part of your Squarespace site

Preview the live page to confirm the widget is rendering. The CollectSocials widget renders in a Shadow DOM, which isolates its CSS from Squarespace's stylesheets — so you shouldn't see any visual conflicts with your template, regardless of which Squarespace theme you're using.

How it works: Shadow DOM is a browser feature that creates an isolated CSS scope for the widget. When the CollectSocials script loads, it creates this isolated environment inside your Squarespace page, renders the widget within it, and loads all widget styles in that isolated context. This means Squarespace's CSS cannot affect the widget, and the widget's CSS cannot affect your Squarespace template — complete separation. It's why the widget always looks exactly as designed, regardless of theme conflicts.

On mobile, check the live preview in a phone browser or using browser developer tools to confirm the widget is displaying responsively. The widget adapts to its container width, so as long as the Code Block is set to full width, it should render cleanly across screen sizes.


Where to Place the Feed on Your Squarespace Site

Squarespace's section-based layout system gives you clear placement options. Here's where feeds tend to perform best on the types of sites Squarespace attracts:

Photography and portfolio sites. Add the Instagram feed as its own full- width section near the bottom of your homepage, after your featured work but before the footer. Frame it as "Behind the Work" or "Follow Along" — a window into your process and ongoing projects. This adds a layer of personality that a static portfolio alone can't provide.

Restaurants and hospitality. Embed the feed on your homepage in a dedicated "From Our Kitchen" or "Recent Moments" section. High-quality food photography displayed in a masonry layout is one of the most effective trust-building tools a restaurant website can use. See our dedicated guide on Instagram feeds for restaurants for a deeper look at this.

Service businesses and consultants. Place the feed on your About page or a dedicated "Our Culture" or "Our Team" page. Instagram content that shows the human side of your business — the team, the office, work in progress — builds the kind of rapport that formal business copy rarely achieves.

Squarespace Commerce stores. Embed the feed on product pages to show products in real-world use. This is especially effective for fashion, accessories, home goods, and any product where lifestyle context matters to the buying decision.


Squarespace-Specific Tips

Section padding and spacing. Squarespace's section padding settings control how much white space surrounds your content blocks. Give the Instagram feed section generous padding — it tends to breathe better with more space around it and looks more intentional than a feed crammed against adjacent content.

Background color matching. The Code Block will inherit whatever background color you assign to its section in Squarespace. Choosing a background that complements your CollectSocials theme creates a more cohesive look. A white background with the Minimal theme, or a dark background with the Midnight or Mono theme, tends to look most polished.

Code Block version. Make sure you're adding a proper Code Block, not a Markdown block. Markdown blocks in Squarespace strip script tags for security reasons. Code Blocks render HTML as written.

CollectSocials is launching soonBe first to know — no spam, one email when we go live.

Maintaining Your Squarespace Instagram Feed

Once set up, the feed maintains itself automatically. New Instagram posts are pulled in at your sync interval and appear in your Collect page for curation. Spend a few minutes each week reviewing new content and selecting the best posts to display.

If your Meta OAuth connection expires, you'll receive a notification in CollectSocials. Reconnecting is a quick process — back in your CollectSocials Sources settings, click to reconnect your Instagram account and sync resumes. This typically needs to happen every few months with Meta's standard token expiry cycles.


Final Thoughts

Squarespace sets a high visual bar, and the social proof section of your site should meet that same bar. The native Instagram block is a compromise — it works, but it doesn't feel intentional. A properly designed widget from a dedicated tool feels like it belongs on your Squarespace site because you control every aspect of its look and content.

For design-forward Squarespace users especially, investing the extra setup time in a custom embed approach is consistently worth it. Your Instagram content is good — give it a presentation worthy of the platform you've built your site on.

For more on how to think about Instagram feed strategy and placement beyond the platform-specific setup, see our guide on making your Instagram feed work on your website. For other platform-specific guides, check WordPress and Wix. And for curation strategies that ensure only your best content shows on your site, our curation guide covers the editorial discipline that makes the difference.

CollectSocials is coming soon

The social media aggregator built for performance and simplicity — pull from 12+ platforms without sacrificing page speed.