How to Create an Instagram Gallery in WordPress

How to Create an Instagram Gallery in WordPress (Step-by-Step)

Last updated on December 4th, 2020

Do you want to add a gallery of Instagram photos to your WordPress website?

Instagram is ideal for sharing photos and building an engaged audience. So, adding your photos to WordPress can draw that audience to your website and grow your followers all at once.

But Instagram doesn’t offer an easy way to embed galleries of your photos. That’s why in this article, we’ll show you how to create an Instagram gallery in WordPress the easy way with a plugin.

Here’s a table of contents to help you navigate this article:

  1. Install Instagram Feed Pro
  2. Connect your Instagram account
  3. Choose your gallery type
  4. Customize your gallery layout
  5. Choose which information to display
  6. Embed your Instagram Gallery in WordPress

Why Add Instagram Galleries to WordPress?

There are many reasons why you’d want to create an Instagram gallery in WordPress. The most obvious reason is to get more Instagram followers. When you embed Instagram content on your site, visitors can see you have a thriving profile worth following.

You could also display Instagram galleries to…

  • Engage site visitors with content relevant to their interests
  • Show social proof with reviews and testimonials
  • Show that your brand can respond to trends with a regularly updated feed
  • Display user-generated content on product pages to increase sales

By using Instagram for business and adding Instagram galleries to your website, you can boost brand exposure and keep engagement levels high. It also helps you build customer relationships that last long into the future.

Why Use Plugins for Instagram Galleries?

As mentioned earlier, Instagram doesn’t make it easy to embed entire galleries of photos in WordPress. The best you can do with their editing tools is to embed single posts.

That’s why we’re using a WordPress plugin to show you how to create an Instagram gallery. Plugins make it easier to create galleries because they do a lot of the work for you.

Instagram plugins connect to your profile and display your posts however you want, no coding required!

Yet it’s not always easy finding a WordPress plugin for Instagram that does everything you need. So why not start with the best plugin on the market?

Instagram Feed by Smash Balloon is the highest-rated Instagram feed plugin for WordPress. It lets you show customizable Instagram galleries in WordPress, without needing any tech work to get them looking great.

All galleries are completely customizable, so you can tweak them to look just right. And you can display as many galleries as you like, wherever you want them on your site.

Custom instagram hashtag feed

Multiple layout options let you showcase your galleries in carousels, grids, masonry grids, and more. Plus, you can use the highlight layout to draw attention to specific posts in your gallery.

Here are a few other things you can do with the Instagram Feed plugin:

  • Link posts in your gallery to product pages to create shoppable Instagram feeds
  • Display your Instagram stories in full-screen lightbox popups
  • Embed shoppable Instagram posts on your website
  • Manage more than 1 Instagram account on the same site
  • Filter your Instagram content based on hashtag, search terms, and more
  • Combine many feeds into a single Instagram gallery
  • Moderate posts with the powerful visual moderation system

As if that wasn’t enough, you get access to top-quality customer support and a 30-day 100% money-back guarantee.

Click here to get started with Instagram Feed Pro.

How to Create an Instagram Gallery in WordPress

Now that you know why creating an Instagram gallery in WordPress is beneficial, let’s look at the steps for building your first gallery feed.

Step 1: Install Instagram Feeds for WordPress

Smash Balloon Instagram Feed Pro

The first step is to install the Instagram Feeds Pro plugin on your WordPress website. Check out this step by step guide to Install a WordPress plugin if you’re not sure how to do that.

Then when you activate the plugin, you can move on to connecting to your Instagram account.

Step 2: Connect to Your Instagram Account

To connect your WordPress site to Instagram, navigate to Instagram Feed » Settings. From there, click the Connect an Instagram Account button.

Connect an instagram account

Now follow the on-screen prompts to connect either a personal or business account.

Connect a business or personal Instagram account

Personal accounts will only display Instagram galleries from your user feed. Yet business accounts will be able to display user feeds, hashtag feed galleries, and more.

The next step is to decide what type of Instagram gallery you want to create. The Instagram Feed plugin lets you create 4 different galleries in WordPress, including:

  • User Account: Show a gallery of Instagram posts from an account you own.
  • Public Hashtag: Create a gallery of all public posts from a hashtag instead of a user.
  • Tagged: Show a gallery of photos that your profile is tagged in.
  • Mixed: Combine all the above post types into a single gallery.

Click the radio button next to the Feed Type to choose the type of gallery you want to display on your website.

Instagram gallery feed type

Then click the Save Changes button to preserve your settings.

Step 4: Customize Your Instagram Gallery Layout

Now it’s time to choose a layout for your Instagram gallery, with 4 options to choose from. To do that, navigate to Instagram Feed » Customize and scroll down to the Layout section.

Instagram feed layout types

Here’s a closer look at each gallery type with an example of how it would look on your website.

Grid Instagram Gallery

Grid instagram gallery in wordpress

The Grid gallery type is a traditional photo gallery. It shows your Instagram posts in a uniform gird of square-cropped images.

You can customize the gallery by choosing the number of photos and columns for both desktop and mobile devices. It’s also possible to change the padding around photos.

Carousel Instagram Gallery

carousel instagram gallery in wordpress

The Carousel gallery type shows your photos in a horizontal slideshow carousel.

You can choose the number of rows and columns to customize the look and feel. There’s also the ability to show or hide navigation arrows, pagination, and set the gallery to autoplay.

Masonry Instagram Gallery

masonry instagram gallery wordpress

The Masonry Gallery lets you show Instagram posts in their original aspect ratio. That means portrait photos won’t get cropped to fit a specific size.

For this gallery type, you can set the number of columns and photos for desktop and mobile devices individually.

Highlight Instagram Gallery

Highlight instagram gallery in wordpress

The Highlight gallery type crops your Instagram photos to uniform squares and displays them in a masonry-style feed. Yet, highlighted posts are twice as large to draw attention to them.

You can set the highlighting type by…

  • Pattern: For example, highlight every 6th post in the gallery
  • Post ID: Enter the ID of posts you want to show twice as large in your gallery
  • Hashtag: Highlight posts containing specific hashtags

Like the other gallery types, you can set the number of columns and posts to show in your feed for different devices.

Go ahead and click any gallery option you like and click the Save Changes button.

The next task in defining your layout is to choose your header style, load more, and follow buttons.

Simply scroll further down the page and select the checkbox to show those elements. Then click the Show Customize Option button to customize how they look in your gallery.

Show Feed Header

Instagram gallery feed header options

You can choose 3 different header styles for your gallery, including standard, boxed, and centered. It’s also possible to change the header size and show or hide your total followers and bio information.

There’s also the option to activate the stories feature here. That means when anyone clicks your feed’s profile picture they’ll see a full-screen slideshow of your latest Instagram stories.

Show the Load More Button

Load more button options for instagram gallery

This option lets you add a button to the bottom of your gallery users can click to load more images. You can change the color and text of the button and choose to load more posts when users scroll down your page automatically.

Show the Follow Button

instagram follow button customization options

The Follow Button option adds a button below your gallery users can click to follow you on Instagram. You can customize the button by changing the background and text color and entering your own button label.

Remember to click the Save Changes button when you’re done customizing your gallery layout.

Step 5: Decide What Information to Display

The next step is to choose the information you want to show in your gallery posts. To do that, click the Posts tab at the top of the Customize page.

Click the posts tab

Here’s a rundown of what you can do with those settings:

  • Photos: Here, you can sort your photos by likes, random, or newest to oldest. You can also set the resolution size of images in your gallery and choose which media to display. If you’d like to make your gallery shoppable, you can link posts to a URL in the photo caption. It’s also possible to offset posts in your gallery if you’re showing particular posts elsewhere on your website.
  • Photo Hover Style: Here, you can change the hover background and text color. You can also choose which information to display when users hover over a photo.
  • Caption: The caption setting lets you show or hide captions and choose the caption length. You can also change the text size and color.
  • Likes & Comments Icons: In this section, you can show or hide icons for likes and comments. If you like, you can customize the color and size of icons too.
  • Lightbox Comments: This section lets you allow comments in photo lightboxes. You can also set the maximum amount of comments and clear your comment cache when needed.

Instagram gallery post settings

When you’ve picked the information you want to hide or show in your gallery, click the Save Changes button. Then move on to learn how to embed your Instagram gallery in WordPress.

Now that you’ve learned how to create an Instagram gallery in WordPress let’s show it off by embedding it on your site.

There are 3 ways to add your gallery to WordPress, which includes:

  • The Instagram Feed block for the new WordPress block editor
  • With a Shortcode for the classic WordPress editor
  • The Instagram Feed WordPress widget to display in your site’s sidebar

Don’t worry if this seems overwhelming. We’ll walk you through each method.

Adding an Instagram Gallery to Posts With the WordPress Block Editor

To add an Instagram gallery feed to a post using the WordPress block editor, start by creating a new post. You can do that by navigating to Posts » Add New. This will display a new blank post with the block editor.

Add a new wordPress post with the block editor

Next, you need to add a new block by clicking the Plus (+) icon. A small overlay appears where you can search for a new block.

Search for the Instagram feed content block

So in the search box, type “feed” to find the Instagram Feed block and click it to add it to your content. Upon adding the block, your gallery automatically displays it in the editor.

Click to add the Instagram feed to your post

Now when you click the Preview button in the top right corner, you’ll see how your Instagram gallery looks on your website.

Published Instagram gallery in WordPress

Embedding Your Instagram Gallery in Pages With the Classic WordPress Editor

To use the classic WordPress editor to embed your Instagram gallery on a new page, navigate to Pages » Add New from your WordPress dashboard.

Then in the content editor, paste the Instagram feed shortcode as shown below.

Create an Instagram Gallery in the WordPress classic editor

Now click the Publish button to make your page live.

Displaying an Instagram Gallery in a WordPress Sidebar Widget

Now let’s learn how to display your Instagram gallery in your WordPress sidebar using a widget. You can do that by navigating to Appearance » Widgets from your dashboard.

Then, find the Instagram Feed widget and drag it over to your chosen sidebar.

Instagram gallery feed widget

Click Save and Done to preserve your settings.

Now when you navigate to the front of your website, you’ll see your gallery live in your sidebar.

live instagram gallery in the wordpress sidebar

There you have it!

We hope this tutorial helped you learn how to create an Instagram gallery in WordPress.

Now all you need is to update your gallery with fantastic photos. Then you can continue to engage your audience, attract new followers, and ultimately grow your brand.

Get started with Instagram Feed Pro today.

And if you enjoyed this article, 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.

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 *