Using an Instagram feed on your WordPress website is an excellent way to showcase your products, add fresh content and engage with your website visitors.
Many plugins can embed photos from your Instagram profile to your WordPress website. With that comes a caveat: you can’t really customize anything as the process is automated.
This means all of the photos from your Instagram account will show. Definitely not ideal.
We’ve got you covered though!
This article will show you how to add a custom Instagram feed to your WordPress website.
Let’s start!
Preparation
Install the SmashBalloon plugin
In this article, we’ll use the SmashBalloon’s Instagram Feed plugin to add photos from Instagram to our WordPress website. It’s a premium, well-written plugin that allows you to customize almost any aspect of your Instagram feed you want to add to your website.
SmashBallon also has a free version of this plugin here, but we need the premium version to use hashtags and other customization options.
Sign up for an account, purchase the plugin and download it in ZIP format to your computer.
Log in to your WordPress Dashboard, head to Plugins > Add New, and click the Upload Plugin button on top:
Click Browse, select the plugin’s ZIP file on your computer, and click the Install Now button to install the plugin on your website:
Once installed, click Activate to activate the plugin, then head to Instagram Feed > Settings > License tab, and enter your license key (you can find the license key in your SmashBalloon account). Make sure to click Save Changes to activate your license key.
Connect your Instagram account
Once the SmashBalloon plugin is installed on your WordPress website, you need to link it with your Instagram account.
Head to Instagram Feed > Settings > Configure tab, and click the Connect an Instagram Account button. You’ll see a pop-up that asks you if you want to link to a personal or a business Instagram account. A Personal account allows you to display a feed of your photos, while a Business account allows you to show pictures from hashtags.
If you don’t have a Business account, we recommend converting your Instagram account to it. It’s completely free and you can switch it back anytime you want.
In the pop-up, select Business and click Connect to go to the next step. The process is straightforward, so follow the prompts to connect your account.
Once completed, you will be able to see your Instagram account listed on the main Configure page of the plugin’s settings. If you have more than one Instagram account – you can go ahead and connect all of them to the plugin.
Add your Instagram feed
Basic feed
Let’s add a basic feed first! Click the Add to Primary Feed button next to your account in the Instagram Feed > Settings > Configure tab.
You can now add the photos to an existing post or a page, create a new post or a page or show it in a widget.
To add it to the new page, head to Pages > Add New, fill in the title, category, and tags, and then click the + symbol to add a new block via Gutenberg editor. Use the search bar or find the Widgets section and select the Instagram Feed block.
That’s it! The plugin will automatically add your Instagram feed to your page with a Follow button.
If you’re still using the Classic WordPress editor, you can add your feed by pasting the following shortcode into the body:
[instagram-feed]
You can also add the feed to your website widget area. Head to Appearance > Widgets, and drag the Instagram Feed widget to any sidebar you want.
Customize your Instagram feed
The plugin displays your photos in a four-column grid by default and your website visitors will see 20 photos from your account, but they can click the Load More button to see more photos.
To change your feed’s look, head to Instagram Feed > Settings > Customize. Here, you can choose the predefined layout and then adjust any options to customize your feed (width, height, number of photos, etc.).
It’s pretty straightforward – select the layout, insert the number of photos you want to display and select the number of columns you want to see.
Hashtag feed
Your Instagram Feed shows the most recent photos from the connected Instagram account by default. If you want to spice things up, you can show Instagram posts from any account that uses a specific hashtag. This is particularly useful if you want to showcase pictures from a conference or event.
Head to Instagram Feed > Settings > Configure tab, and select the Public Hashtag option under the Feed Type section. Fill in the hashtag you want to pull photos from and choose the order of posts (top or most recent).
That’s it! Your feed will now show all the photos used with a specific hashtag you’ve chosen previously.
Multiple feeds
The plugin also allows you to add multiple different Instagram feeds to your website. Head to Instagram Feed > Settings > Display Your Feed tab, and you’ll find various options you can use in the [instagram-feed] shortcode.
For example, if you have multiple Instagram accounts connected to the plugin, you can specify the account with the following shortcode:
[instagram-feed type="user" username="InfoceptorMedia"]
(replace InfoceptorMedia with your Instagram username)
If you want to create a feed with a specific hashtag, you can use the following shortcode:
[instagram-feed type="hashtag" hashtag="#InfoceptorMedia"]
(replace #InfoceptorMedia with the desired hashtag)
The plugin offers endless possibilities. You can showcase photos from a tagged user account, create mixed feeds (all pictures from a specific Instagram profile + all images with a particular hashtag), and so on.
If you’re using the Gutenberg editor on your site, you don’t have to create the entire shortcode – simply add the desired shortcode in the Instagram Feed block settings.
Display options
The plugin does a good job showing your photos by default, but we recommend tweaking some display options depending on how you display your Insta feeds.
For example, if your feed is in a narrow area of your website (like a widget, for example), you might want to turn the captions (photo description) off to offer a clean look.
To do this, add showcaption=”false” to your shortcode.
If you want to filter posts in a hashtagged feed (the feed you can’t control), you can use excludewords=”” in the shortcode. For example, if you don’t want to include photos that have specific words like rude or sex, you would do it like this:
excludewords="rude, sex"
Another handy option allows you to change the Load More text of your Instagram feed. Add the following option to your shortcode:
buttontext="See More Images"
(replace See More Images with the desired text)
You can see the list of all available options on the Instagram Feed > Settings > Display Your Feed tab.
