Instagram feed on your website: a 15-point launch checklist

The checklist at a glance

A plain-text version you can copy into a project ticket or print is at the end of this article.

Before you start

1. The Instagram account is a professional account, and public

Website feeds read posts through Meta’s Instagram API, which works with professional accounts: Business or Creator. Personal accounts cannot be connected. Switching is free and done in the Instagram app under Settings and activity, Account type and tools. Instagram’s help center notes that a private personal account becomes public when it is switched to a professional account, which is also a requirement for showing posts publicly on a website.

Check: open the account in the Instagram app and confirm it shows a professional dashboard or account type. Details in why you need an Instagram professional account and can you show a private Instagram account? If you are still using an old tool built on the retired Basic Display API, read the Basic Display API is gone.

2. The right person signs in, and you know who owns what

The Instagram account owner signs in on Instagram’s own page during the connection; nobody needs to share a password, and Social Feed never sees it. Before you start, agree on two things: who will sign in to Instagram (they need to be available for a few minutes), and whose Social Feed account the connection will live in. That account controls the widget settings and the plan.

If you are building the site for someone else, read adding Instagram feeds to client websites and can you show someone else’s Instagram feed? Both explain why an account can only be shown when its owner connects it.

3. Your plan fits widgets, posts and views

Count three things: how many separate feeds you need (each with its own settings is a widget), how many posts each should show, and roughly how many times pages with a feed are viewed per month. A feed in a site-wide footer is displayed on every page view.

If monthly views go over the limit two months in a row, the widgets pause for the following month. See what happens at the monthly view limit, what the free plan includes and the pricing section.

Set up the widget

4. The correct account is connected

In the dashboard, click + Connect Instagram account and sign in on Instagram’s page. Social Feed asks Instagram to show the sign-in step every time, so you can choose the account deliberately. Afterwards, check the username shown in the dashboard. Businesses with an old account, a personal account and a brand account connect the wrong one more often than you would think.

Connecting creates the first widget. Give it a clear name in the Widget name field, such as “Homepage grid”, especially if you will have several.

5. Filters show only the posts you want

Scroll through the last few months of the account and ask: is there anything here you would not want on the website? Hiring posts, giveaways, holiday closures, memes and very old work are common. Then use the filters in Settings & preview:

1. Reels: all, exclude Reels, or Reels only. See showing only Reels.
2. Include video posts and Include carousel posts. See videos and Reels on your website and carousel posts.
3. Date range: any time, last 30 days, last 90 days or last year. See showing only recent posts.
4. Caption keywords: show only posts whose caption contains one of your words, or hide them. See filtering by keyword.

Check the preview after each change. If too few posts are left, widen the date range or add keywords. If posts appear in an unexpected order, see old posts showing in your feed.

6. Layout, columns and post count fill complete rows

Choose grid or slider. Grids suit main content areas; sliders suit footers and narrow bands. In a grid, choose a post count that fills complete rows, such as 8 at 4 columns or 9 at 3 columns; a half-empty last row looks like a mistake. The number of columns you set is a maximum: in narrow spaces, the widget reduces it automatically so tiles stay a usable size. Tiles are square, so check how vertical photos crop.

More in grid or slider and Instagram image sizes on your website.

7. Click action and lightbox content are chosen on purpose

When a visitor clicks a post, the widget can open a lightbox on your page, open the post on Instagram, or do nothing. A lightbox keeps visitors on your site and can show the caption and the like count; for carousel posts you can let visitors step through all images. Opening Instagram helps if growing followers is the goal. “Do nothing” suits a purely decorative strip.

If you show likes, decide whether that helps your page; low numbers on a sales page may not. See lightbox or link to Instagram.

8. Header, Follow button, text color and width match the page

1. Account header: show or hide the profile picture, username and post count.
2. Follow button: change the label (for example “Follow us on Instagram”) and the color. The default is an Instagram pink; your brand color usually looks better. See Instagram follow button.
3. Text color: Dark for light backgrounds, Light for dark backgrounds. It applies to the username, post count and credit.
4. Widget width: 0 fills the container; a fixed maximum width keeps the feed in line with your content, and the widget centers itself when narrower than its container.
5. Image spacing and font size: match the gaps and text size used elsewhere on the site.

See making the widget match your website.

Place it

9. The embed code is in the right place

The embed code is one script tag, and the feed appears exactly where the tag is placed. Paste it into your platform’s custom HTML or embed element at the spot where the feed belongs, not into a site-wide header field (unless you want it at the top of every page). Settings changes later do not require changing the code.

Platform guides: WordPress, Shopify, Wix, Squarespace, Webflow and HTML. Not sure where on the page? See where to put an Instagram feed and where to place a widget script. For a footer, see adding a feed to your footer.

10. The feed shows once, and the code survives saving

Open the published page (not just the editor) and confirm the feed appears once, in the right spot. Then save the page again, reload, and check that it is still there. Some editors strip script tags when content is saved by users without the right permissions, and some optimization plugins move or delay scripts.

1. Feed missing in the editor but fine on the live page? That is normal for many builders. See feed not showing in your editor.
2. Feed appears twice? The code was pasted in two places, often a template and a page. See feed showing twice.
3. Code disappeared after saving? See WordPress removed your embed code.
4. Nothing shows at all? Work through feed not showing on your website. If your site uses a Content Security Policy, see CSP and Instagram feed widgets.

Test

11. Checked on a real phone

Desktop previews and browser resizing are useful, but check on an actual phone too. Look for tiles that are too small, a feed that pushes your main call to action far down the page, and sliders that are awkward to swipe. If the widget sits in a narrow column, the column decides its size, not the screen.

Fixes are in feed too small or squashed on mobile.

12. Page speed and layout shift checked

Run the page through PageSpeed Insights before and after adding the feed, ideally a couple of times each, since results vary. The widget loads its images directly from Instagram; in a grid, only the first row loads right away and the rest load as visitors scroll, while a slider loads all its images at once. Two quick wins: keep feeds below the main content on important pages, and reserve space for the feed so text below it does not jump when it loads. Google’s web.dev guidance treats a Cumulative Layout Shift of 0.1 or less as good.

See will an Instagram feed slow down your website?, avoiding layout shift from widgets, lazy loading an Instagram feed and Core Web Vitals and third-party embeds. For what a feed does and does not do for search, see does an Instagram feed help SEO?

13. Keyboard works and images are described

Put the mouse aside and press Tab through the page. Each tile should receive focus, Enter or Space should open the lightbox, Escape should close it, and focus should return to the tile you came from. In a slider, the previous and next arrows have labels for screen readers.

For image descriptions, the widget uses the alt text written on Instagram when there is one, otherwise the first part of the caption, otherwise “Instagram post by @username”. You get the best results by adding alt text in Instagram, under Accessibility when posting or editing a post, and by starting captions with a plain description rather than hashtags.

See how to add alt text to Instagram posts and making social media embeds more accessible.

14. Privacy policy reviewed

When a visitor’s browser shows the feed, it loads images and videos directly from Instagram’s servers and the widget script from Social Feed. The widget itself does not set cookies or use browser storage, and the view counts shown in your dashboard do not identify visitors. Many site owners still mention embedded third-party content in their privacy policy. What you need depends on where you and your visitors are, so treat this as a prompt to review your policy, not legal advice.

See Instagram feeds and GDPR. If the feed shows photos of customers or other people’s work, also read Instagram photos and copyright on your website.

Launch and after

15. Published, and someone owns the monthly check

Every widget has a Published switch. While a widget is Unpublished, its embed code shows nothing, on every page where it is placed. You can use this to put the code in place before launch and switch the feed on at the right moment, or to hide a feed temporarily later without editing the site. On launch day, switch it to Published and reload the live page.

Then decide who will look at it once a month. The widget cards in the dashboard show views for the last 30 days with a chart, which tells you quickly whether the feed is still being displayed. See hiding a feed temporarily.

After launch: what can break, and the fix

Launching several feeds at once

Sites with feeds on several pages, for example a homepage grid, a footer slider and a filtered feed on a service page, need a few extra checks on top of the fifteen points.

1. Finish one widget completely first. Get the first widget right, then use Duplicate on its card in the dashboard. The copy keeps every setting, so you only change what differs, such as the layout or a keyword. Each copy has its own embed code.
2. Name widgets after their placement. “Home – grid”, “Footer – slider”, “Services – Reels”. When something looks wrong on a page, you will know which widget to open.
3. Keep a list of where each code is pasted. A short note with page names and widget names saves a lot of searching when you redesign the site or change a template.
4. Recount your views. Every widget displayed counts, so two feeds on the homepage count twice per visit. A footer feed counts on every page view.
5. Check widget limits before you promise placements. Free allows one widget, Light three, Standard any number. Widgets are counted across every Instagram account connected to your Social Feed account.

More in showing different Instagram feeds on different pages.

Common launch-day mistakes

1. Testing only in the editor. Many builders do not run scripts in edit mode. Always check the published page.
2. Judging the feed on a desktop monitor only. A 4-column grid that looks great at 1,440 pixels may become a long scroll on a phone.
3. Forgetting the filters after a rebrand or season change. A keyword or date range chosen months ago can hide everything new. If the preview says there are no posts to show, the filters are the first place to look.
4. Leaving the widget Unpublished. If you placed the code before launch with the widget switched off, remember to switch it on. An unpublished widget shows nothing and gives no error.
5. Assuming the Free plan updates instantly. On Free, the feed on your site updates once a day, so a post published just before launch may not appear until the next day.
6. Disconnecting and reconnecting “to refresh”. Disconnecting deletes the account’s widgets and embed codes. Changes to settings appear without any reconnection.

Printable checklist

Copy this into your project management tool, or print it and tick it off during the launch.

Instagram feed launch checklist

BEFORE YOU START
[ ]  1. Instagram account is a professional account (Business or Creator) and public
[ ]  2. The right person can sign in to Instagram, and knows who owns the feed tool account
[ ]  3. Plan fits: number of widgets, posts per widget, monthly views

SET UP THE WIDGET
[ ]  4. Correct account connected (check the username in the dashboard)
[ ]  5. Filters show only the posts you want (Reels, carousels, videos, date range, keywords)
[ ]  6. Layout, columns and number of posts fill complete rows
[ ]  7. Click action and lightbox content chosen on purpose
[ ]  8. Header, Follow button, text color and width match the page

PLACE IT
[ ]  9. Embed code pasted in an HTML/embed element where the feed should appear
[ ] 10. Feed appears once, on every intended page, and the code survives saving

TEST
[ ] 11. Checked on a real phone: size, columns, nothing important pushed down
[ ] 12. Page speed and layout shift checked before and after
[ ] 13. Keyboard works and images have meaningful descriptions
[ ] 14. Privacy policy reviewed for third-party content

LAUNCH AND AFTER
[ ] 15. Widget switched to Published; someone owns monthly checks

Frequently asked questions

How long does the whole checklist take?
For a single feed on one page, usually under an hour including testing. Most of that time is checking filters and testing on a phone.

Can I skip the plan check if I start on Free?
You can start on Free and upgrade later without changing the embed code. Just keep an eye on monthly views, and remember that on Free the feed updates once a day and shows the credit.

Can I show a hashtag feed or several accounts in one feed?
No. A widget shows one connected account’s own posts. You can place several widgets on one page. See different feeds on different pages.

Do I need to redo the checklist when I change settings?
Not all of it. After changing layout or filters, repeat points 5 to 8 in the preview, then points 11 and 12 on the live page. The embed code stays the same, so placement checks are not needed.

What if the person who connected Instagram leaves the business?
The connection keeps working. If it ever needs to be renewed, someone who can sign in to that Instagram account clicks “Reconnect Instagram account” in the dashboard. Make sure the login for the Social Feed account belongs to the business, not to one person.

Is a feed better than embedding single posts?
It depends on whether you want the page to update by itself. See embedding a single Instagram post.

Ready to start? Create a free account, or read what Social Feed by grip space is first.

Sources

1. Meta for Developers, “Overview of the Instagram API”: https://developers.facebook.com/docs/instagram-platform/overview/
2. Instagram Help Center, “Set up a professional account on Instagram”: https://www.facebook.com/help/instagram/502981923235522
3. Instagram Help Center, “Edit the alternative text for a post on Instagram”: https://www.facebook.com/help/instagram/503708446705527
4. web.dev, “Cumulative Layout Shift (CLS)”: https://web.dev/articles/cls
5. Google, PageSpeed Insights: https://pagespeed.web.dev/