Site icon EmbedSocial

How to Embed Instagram Feed on Your Website for Free in 2024?

Social media feeds have recently become a core component of any website, especially those from popular networks like Instagram. After all, when you embed Instagram feed on website, you enhance the reach of both your website and your social media.

Plus, embedding an Instagram feed on your websites couldn’t be easier!

All you need is a versatile and easy-to-use Instagram feed widget that doesn’t even require any coding knowledge to pull all your posts and display them on your sites.

So if you are looking to quickly and effectively boost your brand’s social proof with employee and user-generated content, keep on reading below. We have all the solutions you need to display an Instagram feed on your website right away!

TL;DR: How to embed Instagram feed?

Here’s how you can embed an Instagram feed on your website via a social aggregator:

  1. Sign up for the Instagram widget.
  2. Under ‘Sources’ > ‘Add new source’, choose Instagram;
  3. Connect your Facebook account or manually enter your Instagram account;
  4. Choose an Instagram widget layout template, such as the Instagram slider;
  5. Design your widget and copy its embeddable code;
  6. Open your website builder, place an HTML element, and paste the code.

FYI: You can automatically embed an Instagram widget with a social media aggregator, bringing your website to life with fresh content.

Display your Instagram feed on your website automatically!

Generate and embed Instagram widget with your feed, mentions, or hashtags directly to your website.

Start 7-day free trial

To get started, browse the Instagram widgets library and see all the possibilities for embedding your Instagram feed on your website:

How to embed an Instagram feed with a social media aggregator?

Integrating your Instagram feed with a handy social media aggregator is very simple:

  1. Create an EmbedSocial account
  2. Add Instagram as a ‘Source’
  3. Connect a Facebook account or enter your Instagram account
  4. Select the Instagram source type
  5. Choose your Instagram widget layout
  6. Copy your Instagram widget code
  7. Paste the provided code into your website

Step 1: Create an EmbedSocial account

Before proceeding with the steps below, you have to create your EmbedSocial account.

Step 2: Add Instagram as a ‘Source’

Once you are logged in, you will be navigated to the ‘Sources‘ page, where you can click ‘Add new source’ to see all available social media integrations. Click on ‘Instagram’:

Step 3: Connect a Facebook account or enter your Instagram account

You can either ‘Connect Facebook Account’ to pull all the professional Instagram posts associated with it, or you can manually enter your public Instagram account @username:

Note: If you manage several Instagram profiles with your Facebook account, the system will display them all once you connect your Facebook account.

Step 4: Select the Instagram source type

Choose what kind of Instagram feed you want to create: from a @Personal or @Business account, using #Hashtags or @Mentions posts, or even an Instagram @Stories feed:

Note: Once you are done, you will be redirected to the next step—choosing the widget layout. However, you can always add additional Instagram post types in the future.

Step 5: Choose your Instagram widget layout

Now you get to choose one of almost 40 different Instagram feed widget layouts, which you can later customize. Find the one you like and tap ‘Use this template’:

Step 6: Copy your Instagram widget code

Once you are done customizing the look of your widget as you see fit, look for the widget code under the ‘Embed’ section (top-left corner), and click ‘Copy code’:

Note: Just below the code you’ll also find specific tutorials to embed it onto different platforms. Simply tap the icon of your website builder to open the corresponding tutorial.

Step 7: Paste the provided code into your website

Last but not least, you have to embed that code into your website builder, and most of them follow similar steps: you open the page for the widget, add a customizable HTML block, and paste the code into the empty field. Here’s how that looks like on WordPress:

Note: Below, we cover the exact steps needed to embed your code across the most popular website builders, such as Squarespace, Wix, and WordPress.

Embedded Instagram widget in action: Live demo

Once you complete the above steps, you’ll get an Instagram widget like the one below:

How to add Instagram feed to website: Video tutorial

If you are a visual learner, here’s a handy YouTube video covering the above process:

FYI: You can automatically embed an Instagram widget with a social media aggregator, bringing your website to life with fresh content.

Display your Instagram feed on your website automatically!

Generate and embed Instagram widget with your feed, mentions, or hashtags directly to your website.

Start 7-day free trial

How to integrate your Instagram feed into your website for free

EmbedSocial also provides a free Instagram feed widget that can generate, utilize, and sync your Instagram’s marketing potential on your website in minutes.

This free Instagram feed widget works with all popular website builders and can be implemented in a few straightforward steps:

  1. Create your free account for the Instagram widget;
  2. Pick Instagram as a ‘Source‘ and connect your Instagram account;
  3. Generate your Instagram feed in an Instagram widget;
  4. Copy the widget code and paste it onto your website.

That’s it! Now, you have an automatically updateable Instagram widget. Easy right?

Free Instagram widget on website: Live demo

Here’s what this free Instagram feed looks like when embedded on a website:

Like what you see? Create and embed your first Instagram feed for free!

By now, you should know how to design your widget and copy and paste its code into your website. However, you might have further questions how that works for specific website builders, e-commerce platforms, and CMS platforms. Here are the answers:

How to embed Instagram feed in WordPress

Steps to embed Instagram feed in WordPress

Before you start, please note that you can embed the Instagram feed using the EmbedSocial platform with or without a WordPress plugin. 

It is directly integrated with the Instagram API, so you won’t need to configure your user ID or update access tokens. You will only need to click a button and give your permission to our platform to sync your posts on your WordPress website.  

EmbedSocial provides two options to embed an Instagram feed: a JavaScript code for a direct embed inside WordPress posts and a plugin for embedding Instagram feeds with a shortcode. Here are the instructions for both methods:

Option 1: Instagram Feed Plugin

EmbedSocial provides a free Instagram feed WordPress plugin as part of the social media aggregator, and it works for any WordPress theme.

With the Instagram Feed for WordPress, you can create a full posts feed or a simple photo feed with your Instagram images.  

Before you start, you will need first to connect your Instagram user account. Then, follow these steps to activate the Instagram plugin on your WordPress website:

  1. Open your WordPress admin and navigate to Plugins;
  2. In Search, type EmbedSocial, and in the search results, click to Install it;
  3. Once it’s installed, in the Plugins list, click Activate;
  4. Now, open your WordPress Page where you want to show the feed;
  5. Click on the + button to add a block, choose a custom HTML block (or use a shortcode block);
  6. Paste the provided HTML code;
  7. Click ‘Save’/’Publish ‘on that page.

That’s it. Once you open the front end of your WordPress site, you will see the latest Instagram posts on your website. 

EmbedSocial will help you to choose the layout, and several columns and a follow button, and even include a Facebook feed or TikTok feed in one social media widget.

Option 2: Instagram Feed JavaScript

This option is usually recommended use for one-time embeds like showing an Instagram widget in the website’s sidebar. 

To do this, you will need to get the code from your EmbedSocial account and paste the code in the Widgets area where you have your sidebar.

How to show Instagram feed on Shopify website

Steps to display Instagram feed in Shopify

There are a few options when embedding an Instagram widget in Shopify, and the tutorial below will show you how to embed the JavaScript code in a selected page:

1. Log into Shopify, go to Store > Options > Pages, and open the page in question;

2. In the Shopify page editor, click the top-right code icon:

3. Click on the HTML/code icon (top-right corner) and paste the provided code;

4. Finally, click ‘Save,’ and the Instagram feed will appear on the selected page:

How to show an Instagram feed on a Wix website

Steps to dispaly an Instagram feed on a Wix website

Follow the steps below to embed an Instagram feed in Wix:

1. First, log into your Wix account and open your website editor;

2. Click the top-left ‘+’ button to add a new block, and in the popup, choose the iFrame block:

3. Once the iFrame block appears, click the top-left ‘Enter Code’ button:

4. Paste the widget code you copied from the widget editor and click ‘Update‘:

5. Resize the iFrame block to fit the widget and click ‘Publish’:

How to embed Instagram feed in HubSpot

Steps to embed Instagram feed in HubSpot

HubSpot’s website builder is a very popular platform for building landing pages amongst users without specific technical skills.

To embed your Instagram feed into HubSpot’s CMS Hub, follow these steps:

  1. Log in to your HubSpot account;
  2. Click on Marketing in the top menu and click Landing Pages;
  3. Click edit on the page you want to have the Instagram feed;
  4. In the landing page editor, click the top menu File and select Page Settings;
  5. Here, choose Advanced and navigate to the Footer text area;
  6. Paste the widget code;
  7. Click Save or Publish.

That’s it. You can just set the Instagram feed widget and forget about it, as it will automatically update on its own every time you post on Instagram.

Here is a demo of the Instagram feed in HubSpot.

How to embed Instagram feed in Notion

Steps to embed Instagram feed in Notion

Do you use Notion for building landing pages? If yes, the following steps can help you sync your Instagram activity with your Notion pages.

To start, you’ll need the widget URL, which you can get once you open the widget editor and click the ‘iFrame code’ button under the ‘Embed’ tab. When you see the popup, simply click on ‘URL’ (third on the list), and tap ‘Copy URL’:

To embed the Instagram feed into your Notion page, follow these steps:

  1. Log into your Notion account and open the page where you want to embed the feed;
  2. Select where to place the widget, type /embed, and choose the Embed option;
  3. Click the Embed link tab, and in the URL tab, paste the widget URL:

Full guide on how to embed reviews widget in Notion.

How to show your Instagram feed in Squarespace

Steps to display your Instagram feed in Squarespace

The code provided by the free Instagram widget also works within Squarespace.

First, go to your Squarespace account, and from the home page, navigate to the website where you want to show the widget:

Now follow these steps to paste the embeddable code of your Instagram widget:

1. Navigate to the section of the page where you want to add the widget and add a new content block by clicking on the plus button:

2. Select the ‘Embed’ block and click on the “Embed Data” code icon:

3. Paste the code into the insert point and click ‘Set’:

Embed Instagram Feed on other web platforms

Here are a couple more tutorials to help you display Instagram posts on other web platforms:

5 ways to customize your embedded Instagram feed like a PRO

Now that you know how to embed an Instagram feed on any website, let’s check out a few useful customization options available in the widget’s PRO version:

1. Change the layout of the Instagram widget

You can switch the layout by navigating to the Settings panel > Layout tab > and choosing a layout you like. Here is how the switch from Feed to Slider looks like:

And here is how the layout looks when switched to collage:

2. Swap the card style of the Instagram posts

The card style is the look of the Instagram posts in the feed. You can showcase the posts as photos or in their full version, which includes all relevant details, including the photo or video, the Instagram account that posted it, and the time when it was published:

Note: You can also create a widget with photos only via the photo grid card layout. Their captions will still be available on hover and when clicking the lightbox.

3. Customize the way Instagram posts show in the lightbox/popup mode

For showcasing Instagram posts in a more detailed view, the platform offers separate settings for the lightbox mode.

This lightbox appears when users click on the posts, and the post opens in a popup view containing a larger format. Furthermore, users can swipe left or right to see more details and view all posts in a more zoomed format.

To personalize the look, you can choose from the settings such as:

4. Change the color theme from light to dark or rainbow

This is a very simple setting but many users love it since they can completely change the Instagram feed theme with one click and choose how they want to display the Instagram feed on their website in an effort to make it fit the overall theme.

Here is an example of how the widget looks like when switched to the rainbow theme:

5. Curate an Instagram feed with an AI CSS generator and Custom CSS feature

In case you need more sophisticated customizations, the platform offers an AI tool that will generate CSS based on your needs. You can write a prompt like ‘Change the button colors to light blue’, and it will apply the change to all buttons. Or if you are familiar with CSS you can use the Custom CSS feature to write your own design specifications:

Further customizations for your Instagram feed

This social media aggregator let’s you apply your brand voice by customizing your feed with different colors and fonts, layout options, backgrounds, CTAs, and much more.

To unleash your creativity and make your Instagram feed truly impressive, navigate to the Settings, Layout, and Design tabs, and play around with the following options:

You can also use various moderation tools to choose the content you want displayed on your website, which is very important when organizing hashtag giveaways or contests that you display on your website. Usually, these posts are from numerous Instagram users and need additional curation before appearing on your website.

Live demos of Instagram widget templates

Visit this Instagram widget templates library to check every layout you can use. However, note that customization is limited in the free version:

If you want to see every feature in action, follow the links below to the live demos:

With these exclusive Instagram widget options, you will definitely stand out from the crowd, provide fresh content, and create a very interactive website!

What types of Instagram feeds can you embed?

EmbedSocial provides direct integration with Instagram, allowing users to embed different types of Feeds, such as:

FYI: You can automatically embed an Instagram widget with a social media aggregator, bringing your website to life with fresh content.

Display your Instagram feed on your website automatically!

Generate and embed Instagram widget with your feed, mentions, or hashtags directly to your website.

Start 7-day free trial

Benefits of adding an Instagram Feed to your website

So, why should you display the Instagram feed on your website?

From showing and keeping your Instagram users up to date with new products to directly selling your inventory, Instagram comes with various advantages for your business.

Displaying an Instagram feed of authentic photos created from your account will increase user engagement and time on site, turning visitors into followers.

That said, when you embed an Instagram feed you:

  1. Expand your social presence,
  2. Provide real-time, fresh, and beautiful content via your website,
  3. Display social proof of the quality of your business,
  4. Store and analyze user-generated content,
  5. Extend the reach of your brand content beyond Instagram,
  6. Save time and resources to produce content for your website,
  7. Increase engagement and the possibility of gaining more Instagram followers,
  8. Build brand trust on your website and boost conversions.

Probably the most valuable benefit for e-commerce brands is the ability to showcase user-generated content in social proof forms.

This means that having the opportunity to auto-sync content produced by real people about their actual usage of a particular product is priceless proof that helps build trust in e-commerce websites and drive prospective customers’ purchasing decisions.

Examples of Instagram feeds embedded on websites

Nowadays, there’s rarely a website that doesn’t display social media feeds. Most of them showcase interactive Instagram galleries of all their posts or a feed of user-generated content collected using Instagram hashtags.

1. Babies R Us displays Instagram posts from their own events and customers

See how Babies R Us uses an Instagram slider widget to display some of the posts that customers share on Instagram when visiting their Mama Club events.

By doing so, they enhance the engagement and interest of potential moms who can see the behind-the-scenes and get an urge to book a ticket for the next event.

2. Stranger Things shows off its fans’ Instagram posts

Here is an example of an Instagram feed on a website showcasing the Stranger Things experience, which creates feeds with other peoples’ posts mentioning the brand:

3. Aeroblend

Aeroblend is a cosmetics brand that has created a very effective and aesthetically pleasing Instagram widget that showcases their products’ effects on the faces of real customers:

See more Instagram feed examples to learn how others embed their Instagram photos and videos and get inspired to do better!

Best free tools for embedding your Instagram feed

These are the best tools you can use to embed your Instagram feed on your website:

1. EmbedSocial

As mentioned above, EmbedSocial is one of the best Instagram apps or plugins for websites that offer more advanced solutions to display your Instagram photos on WordPress, Wix, Squarespace, HTML websites, or other web platforms.

Its PRO version comes with various advanced features, including using other social networks, embedding Instagram feeds from hashtags, and moderating Instagram feeds.

Plus, it provides the option to curate Instagram hashtag walls and collect posts that other users publish in which they mention your Instagram account.

So if you need all that and real-time auto-updates, analytics, and a fantastic customer support team are available, EmbedSocial is the choice for you.

The best feature is the option to integrate with all major social media platforms and create social feeds with all your user-generated content.

Note: All active users get constant updates like Custom CSS functionalities and great templates that fit any webpage.

This social media content aggregator helps people sync their own and their customers’ content with their website quickly and without any coding skills required. 

We achieved this by having a direct and approved API integration with the Instagram platform. Here are the main features you will get with EmbedSocial:

Feedlink is one of the best influencer marketing tools you could get nowadays and your go-to tool for showcasing Instagram feeds right in your link in bio page.

Think of it as a bridge that connects your Instagram posts to your link in bio website, helping you keep your audience engaged with fresh, social content. Whether you’re using Instagram or Threads, Feedlink has got you covered.

Here’s the cool part: Feedlink is about displaying your Instagram posts in your own way!

Feedlink lets you customize the appearance of your Instagram feed to match your brand’s vibe. And for those of you who are selling products, tagging them in your posts is a breeze. This means your visitors can shop your products directly through your posts, making their shopping experience seamless and fun.

Additionally, Feedlink allows embedding a post from Threads, which you can integrate into your link in bio page in a few clicks, ensuring that your content stays fresh and engaging.

Besides these two fantastic options, here are additional free methods for adding your Instagram feed to your website:

3. Instagram’s official embedding option

Instagram offers an easy embed feature that lets you add an Instagram post on WordPress:

  1. Open your Instagram business app in the browser;
  2. Open the image you want to embed and choose the 3 dots menu in the upper right corner;
  3. Choose the option ‘Embed’ and copy the code;
  4. Open your WordPress editor and go to the page where you want that post to appear;
  5. Select the area of the editor where you want to add the code and click on the + icon;
  6. Select the ‘Embed’ block and paste the image URL in the input field;
  7. Click ‘Update‘ (or ‘Preview‘) to see your embedded Instagram feed.

Check Instagram’s official embedding guide.

While simple, this method comes with certain limitations:

4. 3rd-party Instagram feed plugins for WordPress and other builders

EmbedSocial is among the best WordPress Instagram plugins, as it provides a free version for embedding Instagram feeds.

That said, there are plenty of other tools that can help you achieve the same results.

So you should check out the WordPress plugin directory or the shop of your chosen website builder to see if you can find a plugin you like better.

Remember: Instagram is continuously changing its API, and you need a professional tool with Instagram API access. EmbedSocial can provide this functionality as it’s already compliant with the latest API changes.

Learn more about these new significant Instagram API changes.

Key takeaways: Use a social media aggregator!

Congratulations on learning how to extend your Instagram activity’s reach via your website and beyond Instagram’s mobile app!

Remember: using a user-generated content platform is a very efficient strategy to attracting potential customers with your social media content.

As a full social media aggregator, EmbedSocial generates social media content from all major social media networks, has moderation options for full control over your Instagram posts, and gives you options to embed multiple Instagram feed widgets across various websites.

Hopefully, these Instagram widgets will help you offer a unique experience for your website visitors, and if you need further help, contact us at any time!

Happy embedding!

FYI: You can automatically embed an Instagram widget with a social media aggregator, bringing your website to life with fresh content.

Display your Instagram feed on your website automatically!

Generate and embed Instagram widget with your feed, mentions, or hashtags directly to your website.

Start 7-day free trial

EmbedSocial currently integrates with all major social media platforms, and the integrations are done through an official API access. Plus, they allow you to do more than just embed Facebook feeds. You can:

For any additional inquiries, you can always contact our support team with a click on the bottom right chat icon.

FAQs about embedding Instagram feeds

What does embed Instagram mean? 

To embed means to display something on a website. In a more technical definition, embed Instagram refers to ‘PASTE a code’ that will show an interface of Instagram posts, usually in an iFrame as a widget, on a web page’s position where the code was placed. To that, embedding Instagram means displaying an Instagram feed on a website. 

How do I get the embed code from my Instagram post?

To embed a single Instagram post, open the post on a PC, click the top-right 3 dots icon, and click Embed. A pop-up will display the embed code.

How do I embed Instagram feed code? 

​To embed a code, usually, you will need to send the code to the website developer, or if you use WordPress, you can copy and paste the code into an HTML block in your WordPress page and embed an Instagram gallery just like that.

Can I add an Instagram feed plugin for the website?

Yes, you can add an Instagram feed plugin to your website. Various plugins, both free and premium, can help you showcase your Instagram feed on your site. Check the social media feeds WordPress plugin to embed paid or free widgets from the EmbedSocial platform.

Where can I show my Instagram feed on websites?

Common places to showcase the feed include the homepage, sidebar, footer, or on a dedicated “Instagram Gallery” page. The choice depends on your website layout, your goals for featuring the Instagram content, and the level of prominence you want to give your feed.

How do I make my Instagram feed interactive with links?

The Instagram feeds created with EmbedSocial’s editor can be transformed into interactive widgets by adding custom CTA links or even tagging product information on the feed photos. To do this, open the feed in the editor, click on the Links tab, and choose to add one link to all photos or add a particular link or product tag to each image separately.

How do I embed an Instagram feed in an iFrame?

The widgets have their own iFrame code, which you can get after you open the Instagram feed widget in the editor, and in the left-hand Settings panel click the option iFrame code. In the popup, you can choose different code versions with fixed height or fixed width. 

What is a social media aggregator?

Social media aggregator is a tool that generates posts published on social media networks and help analyze, moderate, and display on your website.

Do you need permission to embed Instagram posts on your website?

When considering embedding an Instagram feed on your website, you typically do not require explicit permission from the individual post creators. This is because the functionality to embed is provided directly by Instagram, implying a level of consent for sharing.

Can you make your Instagram feed shoppable?

Yes, you can make your Instagram feed shoppable and seamlessly integrate this functionality when you display the Instagram feed on your website.

Exit mobile version