A detailed & valuable blog outlining on how to embed Instagram feed on websites for any brand, business, website platform, objective, etc.
But why should you embed Instagram feeds?
Well! Instagram as a social media platform is the most popular choice for marketers, brands, and especially users (that’s where the real game is).
Instagram has the highest user engagement rate, engaging user-generated content, best marketing reach & exposure potential, brand following, and many benefits.
All these benefits arise out of Instagram’s content, so why should you restrict this supercharged content to just instagram; instead, bring it to your website and channelize these benefits for your business to the next level.
This blog explains how you can embed Instagram feed on a website in 4 steps (and 4 minutes).
- Step1. Create/Add Instagram Feed With Taggbox
- Step2. Connect Instagram With Your Taggbox Account
- Step3. Generate Embed Code For Instagram Feed
- Step4. Embed Instagram Feed On Website
- Showing Instagram Feed On Other Website Platforms
- Why Use Taggbox for Embedding Instagram Feeds?
Video Guide to Embed Instagram Feed On Website
4 Step Guide To Embed Instagram Feed
The guide contains steps for all popular website CMS platforms, so you need not worry about missing out.
Step 1. Create/Add Instagram feed with Taggbox
You can easily embed feeds from Instagram to websites with Taggbox. First, create an account with Taggbox widget or Log in to your existing account:
1. Login to Your Taggbox Widget Account and click on the “+Create Widget” button in the dashboard
2. Here, Give a name to your widget and click on Create Widget.
3. When you click on Create widget, a pop-up appears, Select Instagram as a source.
Select the source type from the following options to fetch content from Instagram & click on “Create Feed.”
- Hashtag (#) – Fetches live hashtag feed from Instagram.
- Handles (@) – Collects Instagram feed from the 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.
Step 2. Connect Instagram With Your Taggbox Account
1. Once you click on “Create Feed,” you will be redirected to secure authentication process by Instagram
Provide the required credentials of your Instagram Account
Once the connection has been created and posts(content) will appear within a few moments, the widget Editor will appear.
Step 3. Generate Embed Code For Instagram Feed
Once you get all your posts and are done with all the moderation and customization. Then follow the below-given steps to get the Instagram feed embed code that you can use in your website code to embed Instagram feed.
1. Go to your Widget editor after you have completed Step 2
2. Click on the “Embed Widget” button on the bottom left of your widget editor screen.
3. A pop-up will appear, Choose your Website Building Platform as per your requirement (HTML, WordPress, Wix, Shopify, Weebly, Squarespace, etc.)
4. Choose the “Get Code” option from the new pop-up. You can also fix the height & width.
5. An HTML code will appear, Copy the given embed code.
Now you have successfully generated & copied the Instagram feed “Embed Code.” Follow the below-given steps to embed Instagram post on your chosen website building platform.
Step 4. Embed Instagram Feed On Website
Log in to your website and go to the editing section of the page where you want to show Instagram feed on the website.
Paste the copied code from Taggbox to the body of your page and publish/apply the changes.
You will have successfully displayed Instagram posts on the website now. Find the detailed guide here.
Showing Instagram Feed On Other Website Platforms
Many 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.
4(a) Embed Instagram on WordPress
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.
In the WordPress 5.0 editor, select the Pages>Add New Page Section from the dashboard.
Now choose the + button and select the custom HTML option and paste your copied code and apply changes to display Instagram gallery/feed on the website.
Check the full tutorial for all versions of WordPress on embedding Instagram Feed On WordPress.
4(b) Show Instagram Feed on Wix 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.
Now enter the copied Embed code of Taggbox in the code field, and then click apply.
Complete guide on embedding Instagram feed on WIX
4(c) 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 show Instagram posts 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 the website.
Now click on the HTML box and choose Edit Custom HTML option.
Paste the Taggbox code to integrate Instagram feed on Weebly Website.
4(d) Embed on Squarespace Website
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 gallery.
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.
Now, click Apply to publish your changes.
Complete guide on embedding Instagram Feed on Squarespace website
4(e) Embed on Shopify Website
Shopify is the best platform for an Ecommerce business. If you want to embed the Instagram feed on Shopify, log in your Shopify account and click on Online Store under the Sales Channels section. You will see a drop-down list in the sidebar; select Themes option.
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.
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.
Find out more about How To Create & Embed Shoppable Instagram Feed On Shopify.
Check the complete guide to add Instagram feed on Shopify
Why Use Taggbox for Embedding Instagram Feeds?
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.
With Taggbox, you have all of these Instagram content embedding options:
- Show/Display Instagram Feed On Website
- Embed Instagram hashtag feed On Website
- Add Shoppable Instagram Feed On Website
- Add Instagram Gallery On Website
You can then customize the aggregated Instagram feed with different themes, background, colors & fonts, posts styles, content highlights, autoplay, banners, CTA’s, custom posts, and more.
The 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 can Integrate it on multiple website building platforms, and it provides real-time content updates and performance analytics along with active customer support.
This post will show you how you can embed your live Instagram feed to a website using Taggbox!
Note: Instagram updated its graph API according to which you can only fetch posts based on hashtags & locations using your Instagram Business Account. It won’t be any more possible to fetch posts based on hashtags and locations from a Personal Instagram Account. Read more
Embed Instagram Feed On Website For Free
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 feed 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. It does not have any other functionalities like customizations, content moderation, performance analytics, live content updates, multiple posts, interactive design, etc. that make it quite limited and dull.
In Taggbox Widget, we have a solution to all these limitations and much more.
We have given you 4 effective yet simple ways to 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.