Adding an Instagram Feed

In this article, you’ll learn how to showcase your latest Instagram posts on your website.

We’ve tested for you lots of plugins that offer Instagram integration with WordPress websites. We strongly recommend the Smash Balloon Social Photo Feed plugin because it has multiple options for displaying an Instagram feed and is periodically updated to keep up with new changes. 

  1. Install the plugin on your website by going to Plugins → Add new and search for “Smash Balloon Social Photo Feed.” Once it installs, click on Activate.
  2. On your Dashboard, on the left menu, go to Instagram Feed and click on Settings. Under the Configure tab, select the Connect an Instagram Account and follow the instructions. Find more details in this screenshot.
  3. Once the account connects, you will see it in the Instagram Accounts area. Here’s a screenshot with more details.
  4. Save your settings by clicking the Save Changes button from the bottom of the page.

Add the Instagram feed to your website

If you want to add it to your website’s footer, follow the steps below:

  1. Go to Appearance → Block Areas → Footer;
  2. Click on the ⊕ sign in the area where you want to add the feed and search for “Instagram Feed.” Click on the block that shows up, and you’re done.
Adding the Instagram Feed block to the footer

You can also add it anywhere on your website’s pages or posts by following these steps:

  1. Open the page or post where you want to add the Instagram feed;
  2. Click on the ⊕ sign and search for “Instagram Feed.” Click on the editor block that shows up, and the feed will load.
Adding the Instagram Feed on a page

Customize your Instagram feed

To customize your feed, you need to go to Instagram Feed and click on the Customize tab. You can change things like the number of photos and columns, image resolution, image sorting, button color, and much more.

Plus, you can find additional shortcode settings and examples in the Display your feed tab.

You can also customize the Instagram feed for just one location while keeping the general settings untouched. For example, if you want to customize the Instagram feed added to a page or post, click on the Instagram Feed block, add the following code num=8 cols=2 in the Shortcode Settings area, and click on Apply Changes. View the screenshot for details.

Another great idea is to display your feed horizontally. To make a single row of posts, make sure that the number of columns equals the number of posts. You can do that in two ways:

  • Change the general settings and apply them in all the feed locations by going to Instagram Feed → Settings → Customize and matching the Number of photos to the Number of Columns. View the screenshot for details.
  • Apply the changes just to one location by adding the following code num=4 cols=4 (replace the 4 value with the number of photos you want to display) inside the default shortcode (e.g., [instagram-feed num=4 cols=4]).
Updated on May 6, 2021

Can't find what you’re looking for? Ask a human.

We're a small team of real people providing real help. Send us an email at hello@pixelgrade.com and we will give you a helping hand.