How to Display Multiple Instagram Feeds on Your Website

How to Display Multiple Instagram Feeds on Your Website

Last updated on April 4th, 2021

Are you looking for an easy way to embed more than 1 Instagram feed on your website?

Showcasing multiple feeds helps you highlight your best content so you can engage site visitors, boost your following, and secure new customers to grow your business.

But how do you display multiple Instagram feeds on your website?

In this article, we share all the ways to showcase your feeds in WordPress.

By using our tutorial, you can display multiple Instagram feeds on your website — easily, quickly and hassle-free. Yes, even if you’re a complete WordPress newbie!

Here’s a table of contents to help you quickly find the sections you’re interested in:

Before we dive in, let’s looking at some of the reasons why you’d want to show multiple Instagram feeds on your site.

Or you can click here to skip ahead to the tutorial.

Why Display Multiple Instagram Feeds?

There are many reasons why you’d like to add multiple Instagram feeds to your website.

The most obvious reason is so you can share feeds for all your Instagram accounts in one place. That way, your visitors know the accounts you own, and the types of content you share on each.

But that’s not all.

Showing multiple Instagram feeds on your website also helps you:

There’s a ton of ways to use several Instagram feeds across your website. So how do you embed them?

Let’s take a look below.

How to Display Multiple Instagram Feeds

Adding multiple Instagram feeds to your site might sound tricky. But it’s easier than you think.

With Instagram Feed Pro from Smash Balloon, you can show as many feeds as you like on your WordPress site.

Smash Balloon Instagram Feed Pro

As the best Instagram feed plugin for WordPress, it helps you create, customize and display multiple Instagram feeds on your website — no coding required.

The amazing part about Instagram Feed Pro?

It helps you customize your Instagram feeds, even if you don’t have any background in design. You just need to check or uncheck options and you can fine-tune your Instagram feeds to look the way you’d like.

It’s one of the reasons why the plugin’s so well-recommended, even by the largest brands all over the globe:

smash balloon plugin to display multiple instagram feeds

Plus, the plugin looks great right out of the box.

This means that it automatically copies your website design, so your Instagram feeds look consistent with your brand’s style, with no extra effort on your part.

Instagram Feed Pro is also 100% responsive. Meaning, your multiple Instagram feeds look great on both desktop and mobile, automatically.

Finally, the plugin comes with a customer support team of WordPress experts.

It has a solid rating of 4.9/5 stars, after all. So if you need help with displaying multiple Instagram feeds on your website, you can just send them a message and they’d do their best to assist you.

display multiple instagram feeds using smash balloon plugin

With this in mind, let’s look at how to get started with embedding multiple Instagram feeds on WordPress.

Step 1: Install Instagram Feed Pro on Your WordPress Site

To begin, get your copy of Instagram Feed Pro here.

Then download the plugin to your computer and upload it to your WordPress website.

Next, install and activate the plugin in WordPress. If you need help with that, you can learn how to install a WordPress plugin here.

Excellent! Now you can move on to fine-tuning the plugin settings.

Step 2: Configure Your Feed Settings

After you’ve installed the Instagram feed plugin, navigate to Instagram Feed » Settings from the WordPress admin area.

This is where you connect your Instagram account to your website. To do that, click the big blue Connect an Instagram Account button.

Connect an Instagram account

Then an overlay appears asking you if you’d like to connect a personal or business account.

Connect a business or personal Instagram account

Personal accounts let you display user feeds from a personal account, so choose this option if you’d like to show feeds from only your account.

The Business Account option lets you show customized feeds using hashtags, tags, comments, and more. So if you’re looking to mix up and use Instagram for business, choose this option.

When you’ve picked an account option, click Connect.

Confirm Instagram account connection

After that step, confirm the account that’s connected, and click Connect Accounts.

You can also manually connect to an Instagram account by entering the Access Token linked to the account. Simply paste in the Access Token and User ID and click Connect This Account.

Connect with an Access Token and User ID

On the same Settings page, you can choose your default feed options next to the Show Photos From heading which includes:

  • User Account: A feed of your latest Instagram posts.
  • Hashtag: An Instagram feed of hashtags you define.
  • Tagged: A feed displaying photos your account is tagged in.
  • Mixed: Feeds showing multiple feed types in a single feed.

Once you’ve chosen a default feed, click Save and move on to customizing your feeds.

Step 3: Customize Your Multiple Instagram Feeds

Wondering how to customize your Instagram feed? First, find the customization settings by going to the Customize tab at the top of the settings page.

On this page, you can customize the general look and feel of your Instagram feeds and your post options. You can also moderate your Instagram feed on this page.

In the General section, you can change the width and height of your Instagram feed, and set a custom background color.

General feed settings

Then moving down the page, you can choose from the following feed layouts:

  • Grid: A uniform grid of square-cropped images.
  • Carousel: Posts displayed in a slideshow carousel.
  • Masonry: Instagram pictures in their original aspect ratios with no space between them.
  • Highlight: Masonry style square-cropped images with no captions or likes beneath them.

Beneath the layout settings, you can set the number of photos and columns in your feed. And this is where you can change the padding around images too.

Instagram feed layout settings

The final section on this page lets you decide whether to show your feed header, the load more button, and the follow button. Click each section to expand customization options for each feature.

Instagram feed header and button settings

Don’t forget to save your changes before moving on.

Post Customization Settings

Now navigate to Customize » Posts. This is where you can choose which posts to display in your feed and how they’ll look.

Instagram post settings

Here, you can configure the following settings:

  • Sort photos by newest to oldest or random
  • Select an image resolution or let the plugin detect it automatically
  • Choose to display pictures, videos, or all media types
  • Disable lightbox popups when users click a photo
  • Link posts to the URL in the captions to create shoppable Instagram feeds

The next section lets you chose colors for the background and text when users hover their cursor over your feeds. You can also select which information to display, including:

  • Username
  • Date
  • Instagram Link/Icon
  • Caption
  • Like/Comment Icons

Photo hover styles

Throughout the rest of the page, are options to customize the text for comments and captions and the ability to show or hide comments in image lightboxes.

Moderation Customization Settings

Instagram Feed Pro has a nifty feature that lets you moderate the content that appears in your feeds. To access the options, navigate to Customize » Moderation, as shown below.

Instagram post filtering

On this page, you can filter Instagram posts by removing or showing photos containing specific hashtags.

Simply enter the hashtags you’d like to filter, separated by commas, and click Save Changes.

If you’d prefer to moderate your Instagram feeds in a visual format, scroll down the page and click Visual next to the Moderation Type heading and click Save Changes.

Visual Instagram post moderation

With this option enabled, you’ll see a moderation button next to all your published Instagram Feeds, as shown below. This button is only visible to logged-in users with Admin privileges.

moderate instagram feed button

Clicking the button lets you visually select posts you’d like to remove from your feed. This is a great way to control the quality of feeds displaying public content.

visual moderation on Instagram feeds

Step 4: Display Your Multiple Instagram Feeds on Your Website

Display Multiple Feeds Using WordPress Blocks

With the recent announcement of social blocks for all Smash Balloon plugins, displaying multiple feeds in WordPress is super easy.

Social media blocks act as a visual page builder. They give a preview of your content before you publish.

This makes sure your feeds look amazing before you release them to your site visitors. It also makes it easier to move elements around on the page.

To add an Instagram feed to a new page, navigate to Pages » Add New from the WordPress dashboard to create a new page.

Then after giving your page a name, look for the plus (+) icon so you can add a WordPress block.

Add a new social media block

Now type “Instagram” into the search box to reveal the Instagram social block and click it.

Search for Instagram Feed block

A preview of your primary Instagram feed will show up in the page editor, as you can see below.

Preview your Instagram Feed

But that’s only a single feed, showing your most recent posts. You want to display multiple feeds, right?

Well, this where the social media block settings come into play.

When you click the block in your WordPress page editor, you’ll see a section in the right-hand sidebar labeled Shortcode Settings. This is where you can specify what you want to display to your visitors.

Instagram feed block shortcode settings

To give you an example, let’s say you only want to display images containing the hashtag #fall.

To do this, you’d add a shortcode defining the user feed you wish to display, containing only the word fall.

Here’s what the shortcode would look like for our example:

['instagram-feed user=landscapeswelove includewords=#fall]

This means only images with the word “fall” in the caption are displayed.

Now if you want to add another feed to the page, repeat the process above, and define different shortcode parameters like the one below:

['instagram-feed user=landscapeswelove includewords=#cloudy]

multiple instagram feeds filtererd

Now you have 2 feeds on your website displaying different types of Instagram content. Here’s how it would look for site visitors.

Display multiple instagram feeds

Pretty neat, right? This would be a great way to display Instagram feeds of specific product categories on different product pages.

But what if you want to add multiple Instagram feeds in widget ready areas like your blog sidebar too? Let’s look at how to do that next.

Display Multiple Feeds in Widget Areas

As you may already know, many modern WordPress themes come fully equipped with widget areas for you to display extra information to your visitors. It’s also a popular place for highlighting Instagram feeds filled with stunning images.

The Instagram Feed Pro plugin comes fully equipped with a WordPress widget to make adding your feeds to sidebars, footers, and other widget areas easy.

To add a feed to a widget area, first head to Appearance » Widgets from your WordPress dashboard.

For this feed example, let’s say you want to display a feed in the footer containing your latest Instagram posts, and one in the sidebar of popular hashtags from the public.

First, find the Instagram Feed widget and drag it over to your footer widget area. Then add the shortcode defining your user feed.

Instagram Feed widget

In our case, it would be:

['instagram-feed user="landscapeswelove" num=”4”]

We added the number parameter, so the images display in a single row. You can see all the different shortcodes available under Instagram Feed » Settings » Display Your Feed.

Here’s how the feed looks live on the website:

Instagram Feed in Footer using widget

Now to add a specific public hashtag feed to your primary sidebar, drag the Instagram Feed widget to the sidebar and add the following shortcode, changing the hashtag, post, and column settings to whatever you like.

['instagram-feed hashtag="#landscapes" type=hashtag num="8" cols="2" showcaption=false]

And here’s how it looks live on the website:

Instagram Feed in blog sidebar using widget

This is a great way to display posts from customers using your branded hashtags, while still having a feed dedicated to all your content.

How to Display Multiple Instagram User Feeds

By now, you know how to display multiple feeds from a single Instagram user account, and those containing hashtags from the public.

But what if you have more than 1 Instagram account that you want to showcase on your website?

In the next section, we show you have to connect multiple Instagram accounts to your site using Instagram Feed Pro.

Connect Multiple Instagram Accounts

Smash Balloon recently added the option to add multiple Instagram accounts to WordPress, and it’s a game-changer for people with several profiles.

Why? That’s because now you can connect and display all of them in a single place so site visitors can find them.

Connecting multiple Instagram profiles is really straightforward. Just click the blue Connect an Instagram Account button and follow the steps we highlighted earlier.

Connect multiple Instagram accounts

Repeat the process for all your profiles to add as many as you like.

So how do you display different Instagram feeds for different user accounts? Let’s find out.

Display Separate Instagram User Feeds

Adding more than one Instagram user feed to your website follows the same process as displaying multiple feeds. All you do is change up the shortcodes you use for each feed.

Let’s say you want to add 1 user feed below a specific blog post, and a different user feed in another blog post.

First, head to Posts » All and click Edit on the blog post you want to add the feed to.

Then add the Instagram Feed social media block using the instructions we shared earlier. You can also customize the block shortcode with user account you like.

Add Instagram user feed to blog post

Click Update, and the feed will be live in the blog post.

Now repeat the process for the next blog post, but change the shortcode of the social media block to include a different user, like this:

Display a different Instagram user feed

This is a great way to highlight Instagram posts from different authors on your website. You can also do this to showcase different product-specific Instagram accounts.

There’s 1 more trick we want to show you for displaying multiple users: combining users into a single Instagram feed.

Combine Multiple Users in a Single Feed

Imagine this:

You’re a tattoo studio with some super-talented tattoo artists, and you want to showcase their excellent work to potential customers.

You’ve already got a feed for each artist page on your website, but you want to organize their work into a unified feed to show off on your home page.

How would you do it?

You can use a customized shortcode that includes all your artists’ Instagram accounts but filtered to only include posts related to your business. That way, you can avoid filling the feed with personal posts unrelated to your brand.

Your shortcode might look something like this:

['instagram-feed user= "Sally, Sam, Bob" includewords=" #sbtattooshop"]

Here’s an example of the shortcode we use on our test site to display multiple users in a combined hashtag feed:

['instagram-feed user="landscapeswelove, scorrindemo" includewords="#mountains"]

And here’s how the feed looks live on the site:

Combined Multiple User Instagram Feed

That’s it!

You now know how to display multiple Instagram feeds and feeds with various user accounts on your website.

Now you can engage website visitors with targeted content to boost your followers and, ultimately, grow your business.

If you enjoyed this article, you might like this guide on the best types of Instagram posts to increase sales.

Want to level up your Instagram marketing to grow your business even more?

Get started with Instagram Feed Pro today!

Pro-tip: take advantage of this amazing deal just for you.

Want unlimited access to the premium versions of Smash Balloon plugins so you can use them on unlimited websites? Go ahead and grab the All-Access Bundle here.

Smash Balloon offers a no-risk money-back guarantee so you can decide if the plugins are the right fit to help you boost your brand’s growth.

And with over 1.6 million users trusting Smash Balloon, you know you’d be in great hands with this safe plugin!

Want to know how to display multiple feeds from different social networks? Check out this post on how to add social media feeds to your website.

Finally, feel free to follow us on Twitter and Facebook for more helpful tutorials.

Want to Try our Instagram plugin for Free?

Enter the URL of Your WordPress website to install Instagram Feed Lite.

Comments

  1. Daan van der Linde

    For how many websites can I use Instagram Feed when I buy the Pro version?

    Reply
    1. Lianne Laroya

      Hi Daan,

      Thanks for your question. It depends on the license you get. You can refer to this table for more details: https://smashballoon.com/instagram-feed/pricing/

      if you want unlimited access to all of Smash Balloon plugins so you can use them on unlimited websites, go ahead and get the All-Access Bundle here: https://smashballoon.com/instagram-feed/pricing/

      The great part about Smash Balloon’s pricing method? It comes with a 100% no-risk money-back guarantee so you can try out the plugins first and see if it’s a good fit for you.

      If you have any concerns you’d like to be addressed, please contact our support team.

      If you have a Smash Balloon license, you have access to our priority email support, so please submit a support ticket here: https://smashballoon.com/instagram-feed/support/

      Otherwise, we provide complimentary support in the Smash Balloon Social Photo Feed forum:
      https://wordpress.org/support/plugin/instagram-feed/

      Thank you!

      Reply

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

Leave a Reply

Your email address will not be published. Required fields are marked *