Javascript required
Skip to content Skip to sidebar Skip to footer

How to Integrate Instagram Feed Into Website

Have you worked very hard to create a beautiful Instagram feed, and now you want to show the world your masterpiece? We got you. Embed an Instagram feed on your website to attract customers and gain their trust, in just a few simple steps.

How to embed an Instagram feed on your website in 3 simple steps

  1. Create your free Walls.io instagram widget
  2. Choose your Instagram account as a "Source"
  3. Copy and paste your wall's code snippet into your page

Done! As easy as that you add your Instagram content to your website!

If you are looking for a more in-depth and graphic explanation on how to embed an Instagram feed on a website, keep on reading or watch our video.

Embed an Instagram feed on a website

But first, let's talk about all the benefits of adding Instagram content to your website.

Why should you embed an Instagram feed on your website?

There are multiple advantages to embedding your Instagram feed on your website, and we have a whole page dedicated to them. For now, we will focus on the most powerful ones.

Did you know that 50% of consumers say that seeing an Instagram feed on a brand's website helps them discover a new product during their visit? An embedded Instagram feed is not only a great way of showing people actively using and enjoying your products or your services but an opportunity to promote your product range.

Besides, you can increase your revenue with user-generated content. Collect and display Instagram posts from real customers and embed them on your website. An Instagram feed with user-generated posts will create trust in your products and help people decide to buy. Nothing is more inspiring and reassuring about the quality of a product than seeing other people use it.

Now that you are convinced, follow these steps to embed an Instagram feed on your website.

1. Create your free Walls.io account

First of all, set up your free Walls.io account. Then go to Settings and choose the basic features of your wall, such as title and URL.

Basics tab on the Settings section of a social wall. Title and URL are called My Instagram feed.

Then head over to Sources, and follow step 2.

Sources tab in the Settings setion of a social wall.

2. Choose your Instagram account as a "Source"

In Sources, add the URL or name of your Instagram account. Note that only business accounts can be linked to a wall. If you don't have a business account yet, read how to turn your personal account into a business account. Or, watch the video explanation on how to do it.

Image showing a video which shows how to switch to a Business Instagram account.

After turning your Instagram account into a Business acount, click on connect. This will redirect you to Facebook, where you will select the account and page connected to your Instagram account, and give permission to Walls.io to collect content.

Facebook pop-up asking for permission to access Instagram Business account.

After connecting Facebook, write your account's handle or link and choose if you want to pull content from your profile or a hashtag. Additionally, you can add  filters to further narrow down your content.

embed your Instagram feed on your website instructions: this image shows a text box to enter Instagram name and then click on add button.

Finally, click Add. That's it, you connected your Instagram to your wall!

Bonus step: Design the Instagram feed embed of your dreams

After choosing a source for your wall, you'll want to personalise the design. Go to the Design tab and begin adjusting your Instagram wall to your liking.

First, choose a layout. You have 5 options: Fluid, Grid, Kiosk, Bricks, Map or Billboard. For an Instagram feed, we recommend Fluid, Grid, Bricks and Kiosk, as they will keep the square format of Instagram posts intact.

How to embed an Instagram feed on a website example using the Walls.io Fluid theme. A social feed with dog photos.
This is what the default Fluid layout looks like.

Then, customise the colour scheme of your wall and tiles.

Color scheme options on the Design tab of a social wall. Color 1, Color 2, and Color 3 can be changed.

At the bottom of the design settings, you will find Advanced Customizations. Here you can choose how many columns to show, how to sort posts, language and animation. You can even enter custom CSS code to style your wall.

Advanced customization box. Here one can choose the Number of Columns, Language and Animation of social wall. Custom CSS can also be entered.
An example of how to customise an Instagram feed embed on a website using the Walls.io Fluid layout and CSS. A social feed with dog photos.
An example of how the Fluid layout can be modified using CSS.

3. Copy and paste your wall's code snippet into your page

Lastly, on the main menu, go to Embed and Display. There you will find your wall's code snippet, which you can copy and paste into your website.

Embed your Instagram feed on a website - step 3. Imge show code snippet to copy and past into a website to embed Instagram feed.

Your Instagram feed — a goldmine of content

If you have a beautifully curated Instagram feed or a branded hashtag with lots of user-generated content, you are pretty much sitting on a goldmine of content. Show off your grid on your website as many brands do.

For instance, Ferrari uses an Instagram feed on its website to present and promote the content they put so much work into. By embedding their Instagram feed, they create an interactive brand experience on their website.

IKEA also uses an Instagram feed to inspire online shoppers. They embed an Instagram feed to display user-generated content posted by customers using the store's official hashtags. They have different feeds for different website sections and tailor the Instagram content to fit each of them. This way, users only see posts about products they are interested in based on the page they are viewing.

Additionally, you can add a CTA button to products featured in your Instagram feed embed. Beyerdynamic uses these buttons in combination with user-generated Instagram posts to call attention to their products.

You decide what to display

With an Instagram feed embed, you always have control over what content to display. Walls.io allows you to personalise your content and hide posts that don't match or are not relevant for your website.

Embed an Instagram feed on your website now!

coburnprocculd.blogspot.com

Source: https://blog.walls.io/social-media-success-stories/embed-instagram-feed-on-your-website/