How to embed instagram feed on wordpress

How to Embed Your Instagram Feed on WordPress (in 5 Minutes!)

Last updated on July 13th, 2021

Embedding your Instagram feed to your WordPress site offers an easy way for people to interact with you on both platforms.

This way, you can easily boost your brand awareness, sales and conversions. After all, cross-promoting your social networks on your website improves your audience reach and engagement.

But figuring out how to add your Instagram feed to your WordPress website isn’t as easy.

So today we’ll show you how to embed your Instagram feed on WordPress. By following this tutorial, you can grow your audience and increase sales for your business using your Instagram content.

Since we’ll cover different methods, here’s a table of contents to help you find what you need:

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

Ready? Let’s get started!

Why Embed Instagram Feeds in WordPress?

Displaying an Instagram feed to your WordPress website has lots of benefits. It gives your website visitors a chance to see your latest Instagram posts. Plus, it adds dynamic content to your site.

Here are a few ways you can use Instagram feeds on your website to engage your audience:

  • Show an Instagram feed of product reviews from customers to increase product sales.
  • Add an Instagram hashtag feed of relevant content to your site to keep visitors engaged and let them stay for longer.
  • Display an Instagram feed of user-generated content to serve as positive social proof for your brand so you can drive more sales to your business.
  • Have video testimonials for your business? Embedding Instagram TV video testimonials on your WordPress can encourage your site visitors to buy from you.
  • You can also improve your SEO when you embed Instagram feed on your website. Since the feeds are crawled and indexed by Google, they provide relevant content to boost your website’s rankings.

As you can see, embedding an Instagram feed in WordPress can achieve much more than merely showing your Instagram images.

Once you learn how to do this, it’s the best way to boost visitor engagement and grow your business.

But how do you add different Instagram feeds to WordPress? Let’s find out!

How to Embed Instagram Feeds With a Plugin

The easiest way to embed an Instagram feed to WordPress is to use a WordPress plugin.

This way, the plugin can just connect with Instagram’s API to help you easily display Instagram feeds on your website — even if you’re not tech-savvy.

By using a trusted WordPress plugin, you can showcase your feeds in all their glory, without having to worry about dealing with an embed code, HTML, CSS, JavaScript or other coding languages.

For this method, we’ll show you how to add an Instagram feed to your site using the Instagram Feed Pro plugin from Smash Balloon.

As the highest-rated Instagram feed plugin for WordPress, it lets you display completely customizable Instagram feeds on your site in under 10 minutes!

And with zero technical knowledge needed to get up and running, your feeds look great right out of the box. This way, your feeds look consistent with your brand’s design, with minimal effort on your part.

The best part? Since the plugin’s built with users in mind, it’s designed to be ultra fast. That’s why the pro version of Instagram Feed is trusted and happily recommended by over 1 million users worldwide!

how to embed instagram feed on wordpress using plugin reviews

In fact, Smash Balloon plugins are used by the most popular brands all over the world, so it’s completely safe:

how to embed instagram feed on wordpress

Let’s talk about the step-by-step instructions on how to display an Instagram feed to your website — the easiest and best way, with a plugin:

Step 1: Install and Activate Instagram Feed Pro

embed instagram feed on wordpress with instagram feed pro

To start using this plugin, get your copy of Instagram Feed Pro here and download it to your computer.

Then upload it to your WordPress website. If you’re not familiar with how to do that, you can follow the instructions for how to install a WordPress plugin here. Once that’s done, you can move on to the next step.

Step 2: Connect Your Instagram Account

The next step is to connect your Instagram account. To do that, head to Instagram Feed » Settings from the WordPress admin area.

Then click the big blue Connect an Instagram Account button to connect your account.

connect instagram account to embed instagram feed on wordpress

A popup will appear and ask you to connect a personal or Instagram business account.

Personal accounts let you display feeds from your own Instagram account only. So choose that option if you only want to show photos from your account.

Connect a personal or business Instagram profile

On the other hand, the Business Account option lets you show filtered feeds using hashtags, comments, photo tags, and much more. Want to customize your Instagram feed and display a broad range of content? Choose this option.

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

Next, confirm the account you’d like to connect and click Connect Accounts.

connect instagram account to embed feed on wordpress

If you’d like, there’s a way to manually connect your Instagram account by entering the Access Token linked to your account. Just paste the Access Token and User ID and click Connect This Account.

manually connect account to embed instagram feed on wordpress

When you scroll down the same page, you’ll see default feed options next to the Show Photos From heading.

types of instagram feed to embed on wordpress

That section includes the following options:

  • User Account: Display a live Instagram feed of your latest posts.
  • Hashtag: Display an Instagram hashtag feed using your chosen hashtags.
  • Tagged: Show a feed of photos you’re tagged in by other Instagram users.
  • Mixed: Display a single feed containing multiple feed types.

To display a simple Instagram feed of your account photos, choose the User Account option, and click Save Changes.

Step 3: Customize Your Instagram Feed Settings

For this step, we look at customizing your Instagram feeds. You can easily configure the plugin’s design settings with just a few clicks.

To start, from the main Settings page, click the Customize tab to reveal the options.

Customize instagram feed embedded on wordpress

First, you’ll see the general customization settings where you can change your feed’s width, height, and set a custom background color.

Below are the layout options for your feed. If you’d like to control how your feeds will look like on your website, feel free to change this.

choose instagram feed layout on wordpress

Let’s look at each layout option in more detail.

Grid Layout Option

Instagram feed grid layout on website

The grid layout lets you display your Instagram feed as a grid of square-cropped images. This offers a clean, uniform look with all your photos cropped to the same size.

Carousel Layout Option

Instagram feed carousel layout on website

The carousel layout displays a horizontal Instagram feed in WordPress that users can scroll through at their leisure.

This is an ideal option for footer widget areas or to illustrate blog posts by embedding feeds at the top or bottom of your WordPress post.

Want to add a carousel Instagram feed to your site? Check out this post on how to embed an Instagram carousel feed on your WordPress website for more details.

Masonry Layout Option

Instagram feed masonry layout on wordpress

The masonry layout shows images in their original aspect ratios with no vertical space between Instagram posts.

This is useful for people wishing to display an Instagram gallery in WordPress to showcase their work without cropping important features from their images.

Highlight Layout Option

Instagram feed highlight layout embedded on wordpress

The highlight layout displays square-cropped images in a beautiful gallery.

With this setting, no captions, likes, or comments are shown below each image, giving users a full visual experience. Plus, highlighted posts are displayed twice as large as other images in the gallery to make them stand out.

You can set which posts to highlight from the drop-down menu under the Highlighting Type heading. That lets you highlight based on pattern, post ID, and hashtag.

instagram feed pro settings

Under the layout settings, you can set the number of photos and columns in your feed. And you can also change the padding around your images.

Then, on the last section of the page, you can choose whether to show your feed header, the load more button, and the follow button. Clicking each of the sections expands the customization options for each feature.

customize instagram feed on wordpress

Along the top of the customization page, you’ll see other options for controlling your post settings, moderation settings, and more advanced options.

Click each tab to set up those settings and remember to click Save Changes before you move on to displaying your feed in the next step.

Step 4: Display Your Instagram Feed

Embedding your Instagram feed in WordPress is pretty straight-forward.

Smash Balloon works seamlessly with the new WordPress block editor, so you can add your feeds to any post or page with a few clicks. Plus, you’ll get a preview of your feed to make sure it looks great before you publish.

Adding Your Instagram Feed to a WordPress Page

First, let’s look at how to display your Instagram feed in a new WordPress page.

To begin, navigate to Pages » Add New to create a new page.

Then once you’ve given your page a title and added your content, click the Plus (+) icon to add a new WordPress content block.

display instagram feed on wordpress

Within the block search box, type “Instagram” to bring up the Instagram Feed block and click it to add your feed to the page.

Your feed will then appear in your page editor like this:

embedded instagram feed on wordpress example

When you’re happy with your page, click the Publish button to make it live on your WordPress website.

Then when you navigate to that page, you’ll see your interactive Instagram feed ready for your visitors to browse.

Want to know another way on how to embed Instagram feed on WordPress? Instagram Feed Pro also comes with a built-in Instagram widget you can use to add an Instagram photo feed widget to your site.

Let’s look at how to do that next.

Displaying Your Feed With an Instagram Widget in WordPress

To add your Instagram feed to a widget ready area of WordPress, such as your footer sidebar, navigate to Appearance » Widgets from the WordPress admin area.

Then drag the Instagram Feed widget from the left-hand panel to your chosen sidebar. For this example, we’re adding the widget to the footer widget area.

how to embed instagram feed on wordpress sidebar

The plugin automatically adds the shortcode for you. So, just click Save to finalize. And when you navigate to the front of your website, you’ll see your feed in your sidebar.

Here’s an example of what our Instagram feed widget looks like in our site’s footer using the Carousel layout.

embedded instagram feed on wordpress footer

Want the full tutorial on how to display your Instagram feed on your site’s sidebar?

Check out this helpful tutorial on how to add an Instagram widget to your WordPress website today.

How to Embed an Instagram Hashtag Feed

So far, we’ve discussed adding a standard feed to WordPress to highlight your Instagram posts.

But as we touched upon earlier, Instagram Feed Pro can do a whole lot more, including allowing you to embed Instagram hashtag feeds on your website.

Let’s learn how to do that next.

Step 1: Choose Hashtag Feed Type

To embed an Instagram hashtag feed on your website, instead of selecting the User Account option for displaying photos, you’ll need to click the Hashtag option.

Then enter the hashtags you’d like to display in your feed. You can showcase multiple hashtags by separating each one with a comma.

It’s also easy to set the order of posts in your feed by choosing between Top (most popular posts first), and Recent (within 24 hours).

Then go ahead and click the Save Changes button.

Step 2: Set Feed Moderation Options

Since hashtag feeds tend to include posts from the public, there may be times where you want to hide individual posts from your feed.

This could be due to the content being inappropriate, offensive, or irrelevant to your site audience.

Instagram Feed Pro includes powerful moderation options that help you to exclude specific posts from your feed easily.

To set up the moderation settings, head to the Customize tab, and click the Moderation sub-tab.

Here, you can filter, remove, or show photos containing specific hashtags. To do that, enter the hashtags you’d like to filter and click Save Changes.

filter instagram posts on wordpress

Or, you can use the visual moderation system to filter posts on your live website. You can access those settings by scrolling down the page and clicking Visual next to the Moderation Type heading.

filter embedded instagram feed on website

Then click Save Changes when you’re done.

Now when you navigate to your live Instagram hashtag feed, you’ll see an orange moderation button. This button is only visible to logged-in users with Admin privileges.

moderate feed button on instagram feed on website

Clicking that button lets you choose the posts you’d like to remove from your feed. Images you’ve moderated will have a red cross icon in the top right corner, but won’t show up on your live website.

Instagram visual moderation options

Now all that’s left is to display your hashtag feed. Want more details on how to do this? Check out this post on how to embed an Instagram hashtag feed to your WordPress for your guidance.

And if you want to display multiple Instagram feeds on your website, take a look at this tutorial.

How to Embed Instagram Post Without a Plugin

In the past, you can easily embed your Instagram posts on WordPress without a plugin because of the oEmbeds feature.

You just needed to paste the link to your Instagram post and WordPress would automatically embed it.

Sadly, WordPress discontinued oEmbeds for Instagram and Facebook on October 24, 2020.

This means that if you’re not using a plugin, you can’t embed Instagram posts in WordPress by just pasting the link.

Want to add Instagram posts to WordPress the old way? Then you need to register with Facebook as an app developer. This is time-consuming and complicated, especially when you just want to embed your Instagram posts on your website.

The good news is, there’s a better way to do it.

Instagram Feed Pro brings back oEmbeds for Instagram and Facebook once again. Using this plugin, you just need to paste the link to your Instagram posts and WordPress will continue to automatically embed it.

Simply follow steps #1 and #2 above so you can install Instagram Feed Pro and connect your Instagram account to it.

Once you’ve successfully connected your Instagram account to the plugin, it’s time to enable oEmbeds for Instagram.

Enable oEmbeds for Instagram

First, navigate to Instagram Feed » oEmbeds from your WordPress dashboard.

On the oEmbeds page, click on the Enable Instagram oEmbeds button.

enable oembeds for instagram feed pro plugin

Since Instagram is a part of Facebook, you need to connect your website to Facebook as well. So, click on Connect to Facebook.

connect to facebook for oembed

Then, click on Next to continue connecting to Facebook so you can start automatically embedding your Instagram posts.

allow access instagram feed pro

Finally, click on Done so you can finalize your Facebook account connection.

permissions for instagram feed pro

Congratulations. You’ve now enabled oEmbeds for your WordPress website! Now, you can continue embedding your Instagram photos and videos to WordPress just by pasting the post links.

Embed Your Instagram Posts on WordPress

First, head to your Instagram profile and find the post you’d like to embed in WordPress.

embed instagram post on wordpress

In the top right corner of the post, you’ll see 3 dots that look like this , which indicates more options for you to choose from. Click the dots and select copy link from the menu that appears.

copy instagram link

Next, create a new post or page in WordPress and paste the link directly into the block editor.

Since you’re using Instagram Feed Pro plugin, WordPress will continue to automatically embed the Instagram post into the editor, so you can preview how it looks before publishing.

embed instagram feed on website

Then go ahead and publish your content to see the post live on your WordPress website.

Further Reading: How to Add Social Media Feeds to WordPress

There you have it!

In this article, you’ve learned how to embed your Instagram feed on WordPress.

So now, you can engage your visitors with highly relevant content, increase your Instagram followers, and, ultimately, improve your business.

Get started with Smash Balloon’s Instagram Feed Pro now!

Want unlimited access to Smash Balloon plugins so you can use them on unlimited websites? Go ahead and get the Social Wall Pro bundle here.

It’s the best social media aggregator that lets you easily embed your social feed from different social media platforms like Instagram, Facebook, Twitter and YouTube on your website.

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.

You may want to check out this next article on the best Instagram feed examples you can embed on your website.

And if you enjoyed this article, feel free to follow us on Twitter and Facebook for more social media marketing tutorials.

Want to Try our Instagram plugin for Free?

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

Comments

  1. Shama

    The endpoint for Instagram embed links has been closed since Oct 2020. A part of this article is incorrect and seems to have been published long after the support for embedding links in WP blocks ended.

    Reply
    1. Lianne Laroya

      Hello Shama, thanks so much for your feedback.

      Thanks for sharing your concerns and we understand them.

      You’ll be happy to know that this article has been updated to reflect the recent WordPress changes when it comes to Facebook and Instagram oEmbeds.

      By using the latest versions of Custom Facebook Feed plugins and Instagram Feed Pro plugins, users can continue embedding Facebook or Instagram content on their WordPress website by pasting the post URL into their editor.

      Hope this helps. Have a great day!

      Reply
  2. hayley

    The article is excellent, but it would be better if it included setting up 2 feeds from 2 different Instagram accounts. I’ve added both, but I can’t get them to display separately in the widget. The code doesn’t seem to work for me when I paste in the widget, and when I add both as primary and add two Instagram feeds, it displays both the same feeds, not separate. any help would be appreciated 🙂

    Reply
    1. Lianne Laroya

      Hi Hayley, glad to hear you liked the article!

      Thanks so much for your question. I believe this article about displaying multiple Instagram feeds on your website can help you: https://smashballoon.com/how-to-display-multiple-instagram-feeds-on-your-website/

      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/

      Hope this helps!

      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 *