Blog

You know that awesome Instagram feed you've got going on? Well, imagine if you could sprinkle that Insta-magic all over your website too! We're talking about embedding your Instagram feed on your website like a boss. Why settle for just showcasing your gram-worthy moments on Instagram itself when you can flaunt them on your website too? It's like giving your online presence a turbo boost.

You can invite website visitors to learn more about your brand while keeping your website fresh and interesting.

Get ready to level up your web presence.

If you want to add your Instagram feed in a sidebar, your home page, your footer, or a blog post (like this), then keep on reading!

What's in this guide:

• How to embed your Instagram feed for free
• What types of Instagram feeds can you embed?
• Embedded feed examples
• Main methods for embedding Instagram content in your site
• Top 5 FREE tools for embeddings your Instagram feed
• X ways to update the style of your Instagram feed
• Tutorial for a WordPress website
• Tutorial for a SquareSpace website
• Tutorial for a Wix website
• Tutorial for a Shopify website
• Tutorial for a Webflow website
• Tutorial for a Drupal website
• Tutorial for a Hubspot website
• How to add posts from an Instagram hashtag to your website
• Benefits of embedding your Instagram feed

How to embed your Instagram feed for free

Embedding your Instagram feed is different than embedding an individual post. You need to connect your Instagram account to an aggregator, choose your feed layout, and then copy and paste the HTML code where you want the feed to appear in your website.

A social media aggregator is an easy-to-use app that pulls in your social media content and gives you the tools you need to organize and stylize that content. Then, you simply paste the HTML code in the footer of your website, your home page, or wherever you want your Instagram feed to appear.

Here's how to embed your Instagram feed for free:

1. Sign up for a social media aggregator with a free plan
2. Create a new feed and choose whether or not posts should be automatically approved
3. Connect your Instagram account and choose the type of posts
4. Curate your feed (approve and remove posts)
5. Design your feed
6. Copy the HTML code into your site
7. Check out how the feed looks in your website and make any adjustments
8. Continue to moderate the Instagram content on your website

Let's review these steps in more detail.

Step 1: Sign up for a social media aggregator with a free plan

The first step is to sign up for a social media aggregator that offers a free plan.

This is important because...

• If your website budget is low, you can stay on the free plan and keep the "Powered By" link beneath your Instagram feed.
• If you can afford $25 or more, you can remove the "Powered By" link beneath your Instagram feed, but still have a chance to try the platform's features before you sign up for a paid plan.

Step 2. Create a new feed and choose whether or not posts should be automatically approved

Now it's time to create a feed and give it a name.

You can give it a simple name like "Instagram Feed" or "My Instagram Posts" or "Instagram Posts from Branded Hashtag."

You also need to choose the default post status.

Do you want everything to be automatically approved to show up on your site? Or do you want to have to greenlight each image?

In the settings of your feed, you have two options:

1. Approved - All Instagram posts from the source you chose in Step 2 will be added to your site unless you delete them.
2. Needs approval - No Instagram posts from the source you chose in Step 2 will show up unless you approve them.

Step 3: Connect your Instagram account and choose the type of posts

When you add an Instagram feed to your website, you have a lot of options for the type of content you want to aggregate.

This is because Instagram has the highest amount of post types of any social media platform.

With Curator, you can aggregate all of these different types of content:

• Hashtag Posts
• Hashtag Reels
• Personal Account Posts
• Business Account Posts
• Business Account Reels
• Business Account Stories
• Mentioned Business
• Tagged Business / Collab Posts

(You can even add social media content from other platforms, but we'll save that for another post!)

You can choose to curate an Instagram feed made up of your Instagram business account, or a few different hashtags.

For this tutorial, we'll go with an Instagram business account. You just sync in via Facebook and select the associated Instagram business account you want to use.

Step 4: Curate your feed (approve and remove posts)

Next up, it's time to curate your feed. You can remove the images that you don't want showing up in the feed you'll embed on your website. You can also update the settings for automatic curation if you want to change them.

If you choose automatic approval, then you need to delete the posts that you don't want to show up. If you choose that approval is required, then you need to approve the posts you do want to show up. If you're set to "Needs approval" and you don't give some posts a green checkmark, then no posts will be able to be added to your website.

Step 5: Design your feed

The next step is to update the design of your feed.

You can choose from our pre-set designs that include different ways of portraying the captions. Some designs let you hover over the image to see the captions, while others put the caption below or next to the image.

If you want, you can even upload your own custom posts to your feed. Yup, these are images that you didn't upload on Instagram. You might want to do this if you're promoting a product or a freebie offer.

Step 6: Copy the HTML code into your site

Finally, it's time to embed the HTML code into your website. Just hit "Get code" and then "Copy to clipboard."

Then you can paste it wherever you want: a section of your home page, a blog post, a landing page, or even the sidebar of your blog post.

Let's go ahead and add it to the sidebar.

To do embed the Instagram feed HTML code into Wordpress (for free!), we just need to drag and drop a Custom HTML widget over.

Next we paste the HTML code from Curator.io over to the Custom HTML content box. There's no need to add a title, unless you want to. You could write something like, "The latest Instagram posts" or anything creative you can think of.

Step 7. Check out how the feed looks in your website and make any adjustments

And it's done! Here's what the feed looks like in the sidebar of a blog.

This style puts the caption right below the image and it moves through the posts in an automated slider. It's a very engaging and eye-catching addition to your blog!

But of course, if you prefer a simpler look, you can create a grid style where the captions don't show unless you hover over them, like this example feed:

Step 8. Continue to moderate the Instagram content on your website

You'll want to continue checking your website to make sure that only the best content is showing up.

Moderate your website based on the approval setting you choose

Curator.io is an easy-to-customize aggregator that lets you pull from over a dozen sources. If you'd like to give Curator.io's free forever plan a spin sign up today.

What types of Instagram feeds can you embed?

Instagram offers a lot of different types of posts. It's important to take a step back and think about what you want to aggregate. Do you just want to embed your Instagram feed? Or do you want to embed photos and videos that other users post about your business?

You can embed all of these types of content:

• Hashtag Posts - Embed feed posts from a specific hashtag, such as your wedding's hashtag or the hashtag you use for user-generated content.
• Hashtag Reels - Embed Reels that are tagged with a specific hashtag. This is great for brand challenges, especially dance ones.
• Personal Account Posts - Embed all of your Instagram feed posts from a personal account.
• Business Account Posts - Embed all of your Instagram feed posts from a business account.
• Business Account Reels - Embed all of your Instagram Reels from a business account.
• Business Account Stories - Embed all of your Instagram Stories from a business account.
• Mentioned Business - Embed feed posts from whenever your business account is mentioned in a caption.
• Tagged Business / Collab Posts - Embed feed posts from whenever your business account is tagged. This is a popular option for featuring content from your paid influencer campaigns on your website.

Embedded feed examples

Here's an example of an embedded feed using Curator's free plan. You'll see the "Powered by Curator" link at the bottom. Compared to our competitors, we have the least noticeable branding on the free plan, and that link can be removed on any paid plan.

And here's another example—this time using a paid plan to remove the "Powered By" link. This is a great example of embedding an Instagram feed in order to display user generated content and encourage more customers to post their photos.

Main methods for embedding Instagram content in your site

While the above is the simplest and easiest way to embed Instagram feeds on your website, there are other ways to do this too.

Maybe you want to embed individual posts, or try other methods for feed embeds, or write your own custom code to create a feed.

Method 1: Adding individual posts

You may want to embed individual posts to your website. While this is easy to do, it can be cumbersome in the long run, because you have to keep on embedding to particular posts. In other words, if you would like this embed to display the most recent post, then you’d need to move back and edit your embed whenever you create a new Instagram post. For most people, who post on a daily basis, this would be a lot of trouble for not much value.

Embedding an individual post is easy. Simply navigate underneath the post, and you will notice a […] button. Proceed to click this button, and you will see several options, including embed. Tap embed.

Copy the code that will appear. Next, paste it in your WordPress blog post, and it will automatically convert into an embed. You are done! The process is that simple. You may also add extra parameters such as specifying the width of the post, hiding the captions of the post and display just the image with Instagram’s frame trappings.

Method 2: Social media aggregators (easiest and most affordable)

Instagram does not offer a single box plugin to help you display content from your account. Therefore, to embed your Instagram feeds or entire Instagram profile, you will need to use third-party plugins.

Instagram feed plugins work by allowing you to enter your Instagram account ID and then displaying a gallery of your recent posts. This includes your latest photos, a page, and the sidebar area of your website.

Curator is a free-to-use social media aggregator that lets you add your feed in minutes. It will then automatically update new Instagram content on your website.

Method 3: Custom code

If you are tech savvy and you can code, you may also consider writing a plugin code yourself. You will need to apply for a token for authentication allowing you to access the Insta API (and this where things get tricky for most programmers). You can always add your embed code to your website even if it was built with a website builder. For non-tech savvy users, it should still be easy to know how to build your own website using the platform.

To begin with, following several privacy breaches, Instagram is in the process of changing their API. There is an accelerated plan to drop their API in favor of Facebook Graph API. The potential outcome you should expect from this move is getting rid of ID which enabled you to aggregate photos from other users.

One issue with creating your own plugin is you'll also be required to update it yourself as Instagram makes changes. With every change, your Instagram feed will become unavailable until you're able to update the code. Doing this and applying again could take days or weeks, which leaves site visitors thinking your site is incomplete.

If you don't want to do it yourself, you can hire someone to create an Instagram embed plugin for you. This works well for custom websites or when you need a highly customized look and feel for your embedded Instagram feed. If you choose custom software development, it will help meet your concerns and key needs.

Top 5 FREE tools for embedding your Instagram feed

Looking for a free way to add your Instagram widget? Check out these great tools:

1. Curator

Curator.io is an easy-to-customize aggregator that lets you pull from over a dozen sources. If you'd like to give Curator.io's free forever plan a spin sign up today.

Curator.io offers free versions as well as paid versions. Using the free version, you can still access content from various social media platforms all at once and even filter by hashtag. However, the advantage of the paid version is that get more customization options, refined filtering and many other features you will find useful.

You can start with the free version and once you see the benefits, you'll likely want to upgrade to increase your engagement rate with your Instagram feed and other social feeds.

Pricing: On Curator's free plan, you get three sources/feeds. The free plan adds a small "powered by Curator" link at the bottom of your feed. To remove this branding and get the edit and pin posts feature, sign up for the Professional plan, which costs $25 per month.

2. SnapWidget

SnapWidget makes it easy to add an Instagram widget to your website. It isn't just a single widget, but a variety of widgets you may consider to embed posts in several ways. Some of its unique features include:

1. A simple grid widget that helps display image thumbnails, which as users hover over them, you will see likes as well as replies to the particular post in question. This is fun and interactive.
2. The second feature that may interest you is the scrolling widget. This feature helps showcase a few selected posts in a line. The posts scroll at your specified rate and only stop if a user hovers over a post, so that they can tap to visit the source. Think of it as a slider on your site's homepage, but with social media posts.
3. The map widget displays geotagged Instagram posts on a Google map. And this can come in handy if you travel a lot, and you would want to showcase several posts from the bucket list trips you have been to all at once. Just like Curator.io, it offers a free version, but you can go for a premium version to access custom CSS, more marketing options and built-in analytics.

Pricing: With SnapWidget's free plan, your Instagram photos will link from your website to SnapWidget's website. To get them to link to the Instagram post directly, you'll need a paid plan, which starts at $6 per month. Keep in mind that SnapWidget doesn't offer content moderation or pinned posts.

3. EmbedSocial

EmbedSocial is also a series of plugins. Perhaps you may have come across some of them, such as EmbedStories, EmbedFeed, EmbedAlbum and EmbedReviews. With the free version, you can access, aggregate and create up to ten Instagram albums or Facebook albums. However, if you are looking to increase the number of data sources or turn your gallery into a shop, then you may consider a premium version.

Pricing: The free plan allows you up to one widget with one source. To remove the EmbedSocial branding from your feed, you'll need the Pro plan, which costs $29 per month and offers three feeds and three sources.

4. Tagembed

With Tagembed, you can add content from Instagram, Twitter, Facebook, Slack, and other channels. You can also embed not only content from profiles but also from hashtags. This is great if you have a branded hashtag for user generated content or if you have a wedding hashtag. With Curator, you can also embed content from hashtags, not just profiles.

Pricing: Tagembed's free plan covers one feed and up to 2000 monthly site views, but it does include noticeable ads for Tagembed on your site. To remove their branding from your feed, opt for a paid plan (the Basic plan is $9 per month for 10,000 site views and the Pro plan is $19 per month for 100,000 site views).

5. Juicer

Juicer is another social media aggregator that lets you add your new Instagram posts to your website without having to copy and paste the code for each post. Juicer's social walls also work for Facebook, Twitter, and TikTok, allowing you to aggregate content from multiple sources. You can use their social media moderation features to filter out large amounts of UGC and ensure that only approved content appears on your website.

Pricing: Juicer offers a free plan for up to one feed and two sources, but it does have noticeable branding (Juicer ads). To remove Juicer's branding, opt for the Medium plan for $19 per month, which covers one feed and five sources.

5 ways to update the style of your Instagram feed on your website

If you want your Instagram feed to really match the branding of your website, you might want to do some quick customizations.

Here are 5 smart ways to update the look and feel of your feed so that it looks great on your site.

1. Change the theme or template

One of the easiest ways to customize your website's Instagram feed is to change the theme or template. Most social media aggregators offer themes that change the look of your feed in a single click.

For example, here's what a feed looks like using Curator's Grid theme.

And here's the same Instagram feed using Waterfall (where Reels are not cropped into squares).

The pre-set theme styles make it easy to change your feed. Click around and try different ones. You'll be able to see a preview that will show you exactly what the feed would look like on your website.

Curator offers several themes:

• Waterfall
• Grid
• Grid Carousel
• Carousel
• Mosaic
• Tetris
• Select
• Stack
• Cover Flow
• Panel
• List
• Stagger
• Layers

2. Choose the number of rows

Another easy way to update your Instagram feed is to choose the number of rows. Do you want just one row of Instagram content on the footer of your website to show your most recent posts? Or do you want 3, 4, or even 5 rows of posts to show happy customers enjoying your products or your portfolio pieces?

The choice is yours. Head over to the Rows setting of your social media aggregator and choose the correct number. You can always change the setting later if you change your mind and want to add more or fewer rows.

3. Set the post width

You can also try setting the width of your posts. The default is 250. If you want to make it wider, try setting the width to 300 and see how it looks. If you want to make it narrower, go with 200. Again, you can always play around with the width and check the appearance in the social media aggregator's preview. After you add it to your website, you can always change it later.

In general, keep this as a rule of thumb: wider posts will be easier to read and create more of a bold, impactful look on your website. A narrower width will allow for more Instagram posts on your website. This can be a good choice if your are curating UGC and want to show a lot of customer photos on your site as a form of social proof.

4. Update the text and icon color

You can also try updating the text and icon colors of your content. This allows you to add your brand colors and make sure the Instagram feed really matches your website. Use the HEX code of your website colors.

In this example, we've made the Instagram icon yellow:

5. Add borders or backgrounds

And lastly, try adding borders and/or backgrounds to your Instagram feed posts. Opt for thick borders for a bold look, or try adding a soft tone background that matches your website's design.

In this example, the posts are spaced out slightly, but you can always customize the spacing between posts as well.

How to embed your Instagram feed on a WordPress website

Curator is an excellent WordPress Instagram widget.

When embedding your Instagram content in your WordPress site, the steps are mostly the same as outlined above. The only main difference is that when it comes to actually installing the feed you have two options: 1) copy the HTML code or 2) use Curator's WordPress plugin so that you can copy and paste short code instead.

Below, we'll review these steps in more detail.

Step 1. Choose a social media aggregator tool

The first step is to choose a social media aggregator. Depending on your needs, the platform should be free or affordable. You need a social media aggregator so that you can embed your entire feed instead of copying and pasting code for every post.

Step 2. Create a new feed and set the approval style

Next, create your first feed, give it a name and choose your approval style. We recommend choosing "Approved" if it's your content and "Needs approval" if you're aggregating content from event attendees, customers, or influencers. This way, you can approve everything and there won't be any surprises showing up on your website.

Step 3. Select the type of Instagram content you want to aggregate

Next, choose Instagram as your feed source and choose the type of Instagram posts. For most WordPress websites, people choose their Instagram Business Account and aggregate all of the content from their profile.

Step 4. Approve or remove posts

The next step will be to approve or deny posts, based on your approval setting. If you're manually approving, make sure to approve what you want showing up. If you're allowing your content to be automatically approved, then simply delete anything you want to remove from your WordPress website.

Step 5. Customize the look of your Instagram feed

Now it's time to stylize your Instagram WordPress feed.

Choose the theme you'd like.

There are several different themes that work great with WordPress websites:

• Waterfall
• Grid
• Grid Carousel
• Carousel
• Panel
• List
• Mosaic
• Tetric
• Select
• Stack
• Cover Flow
• Stagger
• Layers

Most people like to keep their Instagram feeds clean and simple and let the posts shine all on their own. However, you can add borders and backgrounds, and change the font color of the text and icons.

For professional WordPress developers, a custom CSS section is available so you can add your own code.

Step 6. Embed the feed in your WordPress website

Now, you need to add the feed to your WordPress website.

No plugin option:

Just click "Publish Feed" and copy the HTML code into the clipboard. Paste it where you want the feed to go, such as in your footer or sidebar. With WordPress, all you have to do is add a custom HTML widget to your website and then copy the code into the box.

With plugin option:

Download the Curator plugin and upload it to your website. Or go to the plugins section of your WordPress website, search Curator, and hit Install. Make sure to activate the plugin.

Then, you can copy short code and paste it where you want it to go instead of having to copy the long HTML code.

Step 7. Review how the feed looks in your WordPress website

After you embed the feed in your WordPress website, go ahead and check how it looks. If needed, go back to the Style section of Curator and make changes to your feed. If you're not using the WordPress plugin, you'll need to copy and paste the HTML code again. If you are using the plugin, you won't need to do that step again.

Step 8. Occassionally approve or remove new Instagram posts

Make sure to login to Curator occasionally to either delete or approve new posts. Depending on how often you post on Instagram, you might want to do this weekly or monthly

How to embed your Instagram feed on a SquareSpace website

To embed an Instagram feed on a SquareSpace website, the only step that is different than what described above is Step 6.

You'll need to add a block to your SquareSpace website for custom HTML code. Then simply paste the feed embed code into that block.

How to embed your Instagram feed on a Wix website

Follow the steps above to use a social media aggregator and generate HTML code.

Then paste the feed's HTML code into your Wix website using these steps:

• Go to the Settings area of your Wix website.
• Go to the Advanced section.
• Click +Custom Code in the top right.
• Paste your Instagram feed code from Curator into the text box.
• Give this code a name, for example, "My Instagram Feed."
• Now select, Add Code to Pages. Click All Pages or choose specific pages.
• Choose where you want the feed to appear: Head; Body - start; Body - end.
• Click Apply.

How to embed your Instagram feed on a Shopify website

To embed your Instagram feed on your Shopify website, follow these instructions:

Shopify is an ecommerce platform, and ecommerce companies typically like to add their Instagram feeds to the footer of their websites.

To add your feed to the footer, use these steps:

• Navigate to Online store > Themes > Actions > Edit Code > Sections > Footer.liquid.
• Add the HTML code into the footer

If you want to create a different feed for each of your products, then simply add each feed's HTML code to the correct product page. This way, customers can see UGC images of that exact product when deciding to purchase it.

How to embed your Instagram feed on a Webflow website

To embed your Instagram feed on your Webflow website, you'll need to follow these steps:

• Go to the Elements panel in the backend of your Webflow website
• Navigate to the Components section
• Select the Embed element

• Drag and drop the Embed element into the right section or container on your website. You only need a container if you want to restrict the width, but most website owners choose to add Instagram posts for the full width of their website.

• Hit Publish to set it live.

Then, going forward you won't need to update the code unless you make changes to the style of your feed. Otherwise, you can simply login to Curator to approve disapprove posts, and they will be sent to your website accordingly.

How to embed your Instagram feed on a Drupal website

• Go to your Drupal admin panel
• Navigate to the page you want to embed the feed on and click Edit

• Select Text Format and then Full HTML to view the page as HTML

• Place your cursor where you want the Instagram feed to appear on the page and paste the code. If you want the Instagram feed at the bottom of the page, simply paste the HTML code at the end of the source code.
• Hit Save to save the changes and set the feed live.

How to embed your Instagram feed on a HubSpot website

Do you want to embed your feed on a HubSpot website? HubSpot is a CRM that also includes a drag and drop website builder so you get seamless sales and digital marketing tools in one place.

Here's how to embed the HTML feed code with HubSpot.

To add the feed to a specific page:

• Login to HubSpot and select Marketing from the dashboard menu. Then select Website and Website Pages.

• Make sure the correct domain is showing in the left hand corner. If you have multiple domains, select the right one.
• Navigate to the name of the page where you want the feed to appear and select Edit.
• In the content editor, select the Settings tab.

• In the Settings section, scroll down to Advanced options. Then scroll to Additional code snippets.
• Paste the code where you want it to go, such as the page footer.

• Click Publish to update the page.

To add the feed to your entire HubSpot website's footer, follow these steps:

• Navigate to Marketing > Website > Pages.
• In the upper left, select the correct domain.
• Click Override default settings in the Site Footer HTML section.
• Enter your code snippets in the Site Footer HTML section.
• In the bottom left, click Save to apply your changes. 

How to add Instagram posts from a hashtag to your website

Most website owners and developers want to add their own Instagram feed to their website. But what if you want to add posts from other Instagram users?

Maybe you want to add posts from your customers to your website.

To do this, simply choose Instagram Hashtags when selecting the type of content. This will pull in all posts tagged with that hashtag.

Make sure to use manual approval and approve everything individually so you don't get the wrong types of images showing up on your website!

Benefits of embedding your Instagram feed

The options for embedding Instagram feeds above do vary in difficulty. However, choosing the right one or even the right combination is beneficial for your brand and can strengthen your brand identity. Becoming an authority in your niche is crucial for gaining more organic traffic.

Embedded Instagram feeds showcase your expertise on your website. For people who may not be on Instagram, this offers additional exposure to your expertise. Think of it as additional site content. Giving your visitors more is always a great idea.

Plus, you're increasing the visibility of your Instagram posts. While Instagram's daily active user base is substantial, it's still not as huge as its parent company, Facebook, which has over a billion daily active users.

Some of the biggest benefits of embedded Instagram feeds include:

• Creating a seamless experience between Instagram and your website.
• Bring user-generated content from Instagram straight to your site.
• Providing social-proof.
• Displaying your social media presence.
• Encourage more conversation.
• Get involved in trends.
• Give your website a beautiful update.

Embedded Instagram feeds are only effective, though, if you stay active on the platform. Don't forget, you can also embed more than just your own personal feed. Use hashtags to also embed feeds mentioning your brand. Just make sure you monitor posts to avoid irrelevant posts. Display social proof is a proven way to increase sales and leads driven by your website. This can come in the form of reviews, user-generated content such as Instagram Feeds or product/ service awards.

Ready to start bringing your Instagram and website followers together?