How to Embed Instagram Feed on Website

Instagram has more than 1 billion monthly active users, and it is one of the most popular social networks worldwide. Instagram stories, filters, and geo-tagging have become an essential part of everyone’s life. In fact, user engagement is the highest on Instagram than on any social media platform. Brands embed Instagram feed on website to fruitfully utilize Instagram’s marketing potential.

website to fruitfully utilize Instagram’s marketing potential.

embed instagram feed

By Integrating an Instagram wall on the website, you can show the user-generated content to the website visitors. You can merge product reviews, hashtag campaign’s performance on your website.

You already know how engaging Instagram videos are. You could also embed Instagram videos on website and allow your website visitors to engage with them. Users find Instagram videos relevant and interesting. This trick attracts your visitors’ attention and makes them stay longer on your website. This helps to reduce the bounce rate and increase the dwell-time of your website visitors.

Embed Instagram Feed On Website For Free

Firstly Instagram provides a free Integrating option through its platform where you can go to the post that you want to embed and generate the Instagram embed code which you can copy in the backend of the webpage where you want to display it on your website.

But the issue is that you can only attach one post at a time and it does not have any other functionalities like customizations, content moderation, performance analytics, live content updates, multiple posts, interactive design, etc. that makes it quite limited and dull.

In Taggbox, we have a solution to all these limitations and much more.

Why Use Taggbox for Embedding Instagram feed?

Taggbox delivers what most other alternatives cannot to your Instagram feed. Taggbox helps in curating quality content with enhanced relevancy using Hashtags, keywords, handles, or mentions.

You can then customize the aggregated feed with different themes, background, colors & fonts, posts styles, content highlights, autoplay, banners, CTA’s, custom posts, and more.

Moderation panel gives you the freedom to choose the content that you want to display and content that you want to restrict like profane content or irrelevant content.

Finally, you have can Integrate it on multiple website building platforms and it provides real-time content updates and performance analytics along with active customer support.

In this post, we will show you how you can embed your live Instagram feed to website using Taggbox!

Note: Earlier in January 2018, Instagram updated it’s graph API according to which it won’t be any more possible to fetch posts on the basis on hashtags and locations from a Standard Instagram Account. To do so, you will have to convert your Instagram Personal account into an Instagram Business account. Read more

Step By Step Video Guide To Embed Instagram Post On Website

Add Instagram feed with Taggbox

You can easily embed feeds from Instagram to website with Taggbox. First, create an account, after creating an account our smart wizard will guide you to create your first Instagram feeds wall or you can follow the below steps to add the Instagram feed to the website:

1. Login to Your Taggbox Widget Account and click on Create Widget.

embed instagram feed on website html

2. Here, give a name to your wall and click on Create Widget.

embed instagram post on website

3. When you click on Create Wall, a popup appears, Select Instagram as a source.

instagram embed

4. Select the Instagram connection type (hashtag(#), profile post(@), mentions and tagged). Give the other required details asked for and click on Create Feed.

  • Hashtag (#)Fetches live hashtag feed from Instagram.
  • Handles (@) – Collects Instagram feeds from business profile handle. Enter your Instagram user handle(username).
  • Mentions- Collects Instagram feeds where you have been mentioned.
  • Tagged- Collect Instagram feeds where you have been tagged.
instagram feed on website

5. Provide the required credentials of your Instagram Account.

instagram feed embed

The connection has been created and within a few moments posts will appear in the Wall Editor.

You can also use the Personalize and Moderation Panel to set up your Instagram wall. You can finally integrate Instagram post on website.

Try Taggbox

Embed Live Instagram Feeds On Your Website Now

Also read: Complete step by step guide to add Instagram feed

Embed Instagram feed on Website

To embed Instagram photos on the website, first you need to get an embed code from Taggbox wall editor.

Follow the below-given steps to get the Instagram feed HTML code for embedding Instagram on website:

Step 1. Click on the Embed Widget button, present at the bottom of the screen.

Instagram to website

Step 2. Choose your Website Building Platform as per your requirement.

instagram feed on website html

Step 3. Choose one from Auto and Fixed to set the Width and Height according to your choice and click on Get Code.

embed instagram post

Step 4. Copy the code from the field or you can also see a preview of your wall by clicking on Preview.

show instagram feed on website

Step 5. Paste the code into the body section of your website.

With these steps, you can easily integrate Instagram feed on HTML website. You can also use the Instagram widget to display your embedded Instagram feed on website.

Flaunt Your Earned Instagram Media With Taggbox

Embed Live Instagram Feeds On Your Website And Display Social Proof

Also Read – How to create Instagram slider widget

Embed Instagram Feed on website building platforms

A lot of individuals are using various website building platforms to create their website because it’s less time-consuming. If you have your website on a different platform such as WordPress, Weebly, Jimdo, Squarespace etc. then you can easily add an Instagram post on those platforms by following some simple steps.

embed Instagram post on website html

Use the generated HTML code to embed Instagram post and follow the below steps:

1. Instagram Feed on HTML Website

If you want to embed Instagram post on website HTML, the process is quite simple. Hypertext Markup Language (HTML) is a great way to develop amazingly beautiful and user-friendly websites and web-based applications. You can easily attach programs encoded in languages like JavaScript and CSS and get the supreme rights to decide the look and feel of your website.

Below is the guide to direct you how to embed Instagram hashtag feeds on your HTML website.

1. Select HTML as your website building platform.

2. Get the Embed Code from Taggbox and copy it on your clipboard.

3. Open the backend of your webpage where you want to display the Instagram Business feeds.

4. Over there, paste the generated Instagram feed embed code in the body section of your website. If you’re not a technical expert, take help of some expert with coding and web development knowledge.

And you’re done! You will see a functional social media feed wall displaying feeds from Instagram on website. 

2. Embed on WordPress Website

embed instagram post

WordPress is a popular open-source content management system, and a lot of websites are built on it. You can easily integrate any custom code on WordPress websites.

Let’s attach your Instagram post with WordPress Website. Login your website WordPress; select and edit the web page where you want to integrate Instagram feed. There will be a Visual and Text Option, on the right-hand side. Select the Text Mode and paste the generated code where you want to showcase your curated feeds from Instagram to website.

embed instagram feed on website html

After attaching the code, click on Update to publish the changes.

3. Instagram Feed on Wix Website

instagram feed on website

After login on Wix, you will see a plus button (+) on the left-hand side of the screen in the menu bar, through this button you can add elements on your web pages.

Wix, a cloud-based web development platform allows the users to create a website with HTML5 capabilities.

After clicking on the plus button you will see a complete list of elements, now click More option on the menu and select HTML iframe from the Embeds.

how to embed instagram post

Now enter the generated Instagram HTML code of Taggbox in the code field, and then click apply.

4. Embed on Weebly Website

Weebly, allows an individual to make a high-quality website, and maintain an online reputation. To create web pages, you can drag and drop the content on Weebly. To embed Instagram post on Weebly, find the Embed Code element (in the menu on the left-hand side of your screen). Now drag and drop the Embed Code element on the page where you want to attach feeds from Instagram to website.

instagram feed website

Now click on the HTML box and choose Edit Custom HTML option.

instagram feed html

Paste the Taggbox code to integrate Instagram feed on Weebly Website.

5. Embed on Squarespace Website

instagram embed

Squarespace provides software as a service for website building. On Squarespace, you can add any external code on the web page by using the Embed Blocks. You need to add a block on the page to embed Instagram post.

Open a page or post editor and click “Add Block”. Now select Embed from the menu and click the </> icon in the URL field. Now paste your Taggbox embed code on that box and click Set.

instagram feed for website

Now, click Apply to publish your changes.

6. Embed on Jimdo Website

instagram feed html code

Jimdo is an e-commerce oriented website builder. You can easily integrate the Instagram feed on Jimbo, select the area on web page where you wish to display your Instagram post and click on the Add Element button. Now click on More elements and choose Widget/HTML.

Instagram to website

Paste the code generated from Taggbox into the code field and click on save button.

7. Embed on Shopify Website

Shopify is the best platform for an E-commerce business. If you want to embed the Instagram feed on Shopify, log in your Shopify account and click on Online Store under Sales Channels section. You will see a drop-down list in the sidebar; select Themes option.

instagram feed on website html free

On the right-hand side of the screen, you will find an Action button on your current theme. Click on that Action Button and choose Edit code from the drop-down list.

instagram feed on website html code

Select Layout/Templates/Section (Eg: For Homepage – Index.liquid) where you want to display your Instagram post and paste the Copied code of Taggbox and Click on Save.

We have given you 6 effective yet simple ways through which you can embed the Instagram feed on website. So, what are you waiting for? Integrate your live Instagram feed on the website using website builders and keep your website up-to-date and increase your brand’s trust.

Embed Live Instagram Feed on Websites With Taggbox

Build User Trust By Displaying Embedded Instagram Feeds On Your Website

Leave a Reply