How to Add an Instagram Feed to Your Divi Website (Best Way)
Home Blog How to Add an Instagram Feed to Your Divi Website (Best Way)

How to Add an Instagram Feed to Your Divi Website (Best Way)

How to Add an Instagram Feed to Your Divi Website

Looking for a way to add an Instagram feed to your Divi website?

Divi by Elegant Themes is a popular theme with a user-friendly site builder that can help you easily create beautiful pages of your own — no coding needed.

And if you want to cross-promote your Instagram content on your Divi website, there’s an easy solution.

In this post, we’ll share with you how to embed an Instagram feed on your Divi site in just a few clicks.

Here’s a table of contents to help you navigate this article. You can skip ahead to the section you want by clicking on it below:

Why Add Instagram Feeds to Your Divi Website?

As a popular page builder plugin, Divi makes website design easy so you can create a beautiful WordPress site for your business.

Using all the web design functionalities of Divi, you can add buttons, call-to-action sections, images, animations, and more to build your site — no technical knowledge needed.

divi wordpress theme

Let’s say you’ve already built a great WordPress website for your brand with Divi. The next step is to promote your site so you can get more customers for your business.

And if you want to promote something on the internet, you can’t ignore social media.

There were an estimated 4.89 billion social media users worldwide in 2023, which represented approximately half of the world’s population.

Statista

Just on Instagram, there are over 1 billion active Instagram users that you can reach!

And if you want to use Instagram to promote your brand, an easy way is to add a feed of Instagram posts to your Divi site.

In fact, here are a few great ways an Instagram feed can help your site:

  • Boost Engagement – Embedding a hashtag feed of relevant Instagram content captures the attention of your site visitors and encourages them to interact with your site.
  • Build Brand Trust – If you embed reviews and testimonials from your customers, they can work as social proof. This means seeing real people enjoying your products can inspire your visitors to make a purchase.
  • Increase Sales – When you add a shoppable Instagram feed on your Divi website, you can directly promote your product pages to your site visitors so they’re more likely to buy from you.
  • Save Time – You can display beautiful Instagram images and videos on your website without uploading them manually since your Instagram feed is automatically updated.

In addition, showing an engaging Instagram feed can drive your site traffic toward your Instagram account and encourage social sharing. Plus, you can also increase your Instagram followers with embedded social feeds.

product review instagram feed

But while you can build a great website with Divi, it doesn’t really come with social media marketing features.

So, if you want to effectively promote your website using Instagram, you’ll need the right tool to help you out.

The good news is that we’re going to show you the best Instagram feeds plugin for WordPress so you can start adding Instagram feeds right away.

Even better, this plugin works 100% well with your Divi website as well.

Easiest Way to Add Divi Instagram Feeds to Your Website

If you don’t want to use a plugin, you can manually embed Instagram feeds on your Divi site, but you have to deal with a lot of code snippets and webpages, which can get confusing.

Not to mention, you can only display your Instagram feed to WordPress without a plugin if you’ve been approved as an app developer with Instagram first.

Plus, the customization options are limited if you’re not tech-savvy, so your Instagram feed might not match the design of your Divi website.

Luckily for you, there’s a better, easier, and simpler way.

The easiest way to add Instagram feeds to your Divi website is by using Instagram Feed Pro, the best Instagram feed plugin in the market.

best instagram feed plugin for wordpress

As the #1 Instagram feed aggregator, Instagram Feed Pro helps you create, customize, and embed your Instagram feed on your Divi site in just a few clicks — no coding needed.

On top of that, it’s also packed with amazing features so you can start adding your Instagram feeds right away, such as:

  • Super Easy and Fast Setup: All it takes is a few minutes, and you can start adding your Instagram feeds to your Divi site — no need for complex coding languages like custom CSS or JavaScript.
  • Tons of Available Feed Types: You have lots of feed types to choose from. The plugin supports hashtag feeds, Instagram reels, and Instagram feed carousels for your Divi website.
  • Visual Feed Customizer: Since all the Instagram feeds are highly customizable, you can personalize them in just a few clicks using a visual customizer.
  • Lightweight and Fast: Instagram Feed Pro has been optimized to be lightweight, so your Instagram feeds and your site will load super fast, which is great for SEO.
  • Instagram Shopping: For online stores and WooCommerce sites, you can create shoppable feeds and allow visitors to buy from you and boost conversions.
  • Top-Notch Customer Support: With Instagram Feed Pro, you also get a team of WordPress experts to help you out if you run into any issues with your feeds.

Because it’s easy to use and customize, Instagram Feed Pro has become the best Instagram feed plugin for WordPress that’s also compatible with Divi. Now, it has 1,000,000+ active users with a rating of 4.9/5 stars.

reviews instagram feed pro plugin

And that user base includes some of the biggest brands worldwide. As you can see, even household names like Coca-Cola are using Smash Balloon Instagram feeds and Smash Balloon social media plugins to add social media feeds to their sites.

brands using smash balloon

And if you’re thinking Smash Balloon doesn’t work with Divi, then don’t worry. All of the Smash Balloon plugins are perfectly compatible with Divi.

This way, you can use Instagram Feed Pro to showcase Instagram feeds so you can boost your engagement and convert site visitors to your Divi website.

Ready to set up Instagram feeds on your Divi website? Get started with Instagram Feed Pro today!

How to Add an Instagram Feed to Your Divi Website (5 Easy Steps)

To embed Instagram feeds on your Divi website, all you have to do is follow the step-by-step instructions below.

Let’s get started.

Step 1: Install and Activate Instagram Feed Pro

To get started, you can get the Instagram Feed Pro plugin from here. Then, all you have to do is install and activate it on your Divi site.

If you’re not sure how that’s done, check out our helpful tutorial on how to install plugins in WordPress.

Step 2: Create Your Instagram Feed

You can now go ahead and create your Instagram feed right away.

Now, go to Instagram Feed » All Feeds from your WordPress dashboard. And then, click on the Add New button to create a new Instagram feed.

create new instagram feed

After that, you can choose which type of Instagram feed you want to display on your Divi website.

There are 3 options here that you can pick from:

  • User Timeline: Show all the photos and videos from your Instagram profile
  • Public Hashtag: Choose to show Instagram posts that have specific hashtags
  • Tagged Posts: Use your Instagram feed to show posts that have tagged your account

After you pick the Instagram feed type you want from the list, click on Next.

For our tutorial, we’ll go with a user timeline feed.

choose Instagram feed type

Step 3: Connect Your Instagram Account

In this step, you can connect your Instagram account to this new feed so that it can show Instagram content on your site.

On the next page, click on the Add Source button.

add source instagram feed

Next, you can pick between a personal and a business Instagram profile.

With a personal profile, you can basically use all the basic features that you’ve been using on Instagram. A personal profile only allows you to post content from your own Instagram account.

A business profile gives you analytics features and a contact button on Instagram. With it, you can show all kinds of feeds, including hashtag feeds, shoppable feeds, Instagram reels (formerly IGTV), and more.

Pick the Instagram profile you want to embed and then click on Login with Facebook.

Then, select the box next to the Instagram account that you want to use as a source for your Instagram feed on Divi. Next, click on Next.

Since Instagram is now part of Facebook, the next step is to check the box next to the Facebook page that’s connected to the Instagram account that you’re using as the source for your feed.

Finally, you can click Done to give the plugin read-only access to your Facebook account.

This means Instagram Feed Pro can view your Instagram content but can not make any changes, so it’s 100% perfectly safe to use.

To finalize setting up your account, click on the Instagram account that you just connected to your website, then click on Add.

Now, you’ll be taken back to the plugin’s dashboard. You can finally click on Next and integrate your Instagram account with your Divi site.

Step 4: Customize Your Instagram Feed

To help you quickly design beautiful feeds, Instagram Feed Pro comes with feed templates that you can import.

You have lots of different templates with unique designs to choose from:

  • Default
  • Simple Grid
  • Simple Grid XL
  • Simple Row
  • Simple Carousel
  • Masonry Card
  • Highlight
  • Single Post
  • Single Post Carousel

Once you’ve chosen the template you want on your Divi Instagram feed, click on Next.

On the next page, you’ll see the visual feed customizer. Here, you can go ahead and use the live feed editor to customize the design and content of your Instagram feed.

Towards the left, you can see a customization panel that has all the options to change the design of your Instagram feed.

That means you can set your feed layout, color scheme, header style, feed size, load more buttons, post design, and much more in a few clicks.

instagram live feed editor

And on the right side, you can see all of your changes in real time with a live preview of your Instagram feed.

Click on the Feed Layout option to start customizing your Instagram feed for your Divi site.

select the feed layout option instagram

Here, you can choose between 4 different layout options for your Divi social media feed:

  • Grid
  • Carousel
  • Masonry
  • Highlight

With the grid layout, you can show an image gallery with a number of photos and videos in neat rows and columns.

If you want a dynamic look for your Divi social media feed, there’s the carousel option.

This way, you can add a beautiful Instagram slider for your Divi site.

carousel layout for your instagram feeds

Want to keep the original proportions of your Instagram posts?

Then, you can pick the masonry option like in this example that I created.

masonry feed layout for instagram

Finally, you have the highlight option that can make your Instagram posts more visible.

This layout will increase the size of your posts by 4 times.

highlights layout

Now, just select the Instagram feed layout that you like and click on Save.

Want to continue customizing your Divi Instagram feed? Simply click on the small Customize button.

customize button instagram

From here, you can click on the Color Scheme option to continue.

select the color scheme option instagram

To help you easily set the colors for your Instagram feed, you have 4 color schemes that you can choose from:

  • Inherit from Theme: Use colors of your website’s WordPress theme
  • Light: Light background and a darker font for your Divi Instagram feed
  • Dark: Use a dark background with a light font color
  • Custom: Manually select all the colors yourself
color options instagram

Once you pick your color scheme, click on the Save button to confirm your changes.

After that, you can customize your Instagram feed to your liking using the remaining options. You can choose the size, post style, font, follow button design, and much more.

Step 5: Add Your Instagram Feed to Divi

Finally, it’s time to show you how to add your Instagram feed to your Divi WordPress site. You can add them directly to your posts and pages, or you can post them on your sidebar.

Add Your Instagram Feed to WordPress Page With Divi

To add your Instagram feed to your WordPress page, you can get started from the live feed editor.

First, click on the Embed button at the top.

embed button instagram feed pro

You’ll then see a popup that has your Instagram feed’s shortcode. By pasting this code on your site, you can embed your Instagram feed.

To continue, click on the Copy button.

copy embed code instagram feed pro

After you do that, go to Pages » Add New from your dashboard and open the WordPress editor.

Here, just click on the Use Divi Builder button.

add new page in divi

You can do the same for a WordPress post as well. From your WordPress dashboard, just go to Posts » Add New and click on Use Divi Builder.

add new post in divi

This will open up the Divi page builder for you. Here, you have 3 ways to proceed:

  • Start Building: You can start from a blank template and build a page.
  • Browse Layouts: Check out the pre-built layouts and start editing one of them.
  • Choose Page: Or you can just copy the design of an existing page and edit it.

You can select whichever option you prefer here.

options to build a page in divi

If you choose the Start Building option, you can start editing from a blank template right away.

start building from blank template

But if you pick the Browse Layouts, it will bring up the Load From Library popup. You can browse through all the available layouts here.

To select a layout for your page, just click on it.

load layout from library

This will open the Layout Details page. Now just click on Use This Layout and you can get started with editing your page.

use a divi layout

And if you picked Choose Page instead, you’ll see the existing page layouts that you’ve designed.

Here, just click on any of the options to start editing your age.

load your existing pages

Before you add your Instagram feed to Divi, you’ll need to create space for it. This means creating a new row.

To do that, click on the small green plus icon (+) on your Divi builder page.

You’ll now see the Insert Row popup. Just select from the collection of rows available here by clicking on the one you like.

insert row in divi builder

After that, you’ll see the Insert Module popup. Here, use the search bar to look for the “code” module and select it.

With this module, you can add Divi social media feeds to your page in just a few clicks.

code module for divi

Finally, you can click on the plus icon (+) to add a new module to your Divi page.

Next, use the search bar to look for the code module, and then click on it in the search results below.

code-module-for-divi-theme.png

Once you’ve done that, you’ll see the Code Settings on the left. Here, go to the code field and paste the shortcode from earlier.

Then, just click on the check icon in the bottom right corner.

add instagram feed to divi website

And you’re done! You’ve now added your Instagram feed to your Divi site.

As you can see, this WordPress social media feed plugin makes it super easy to embed Instagram posts, even if you’re not tech-savvy.

Now, when you visit your website, you can see the Divi Instagram feed embedded on your page.

instagram feed on divi example

Add Your Divi Instagram Feed to Sidebar

What if you want to display your Instagram feed on your sidebar or footer area?

Now, let’s talk about how to embed Instagram feeds on the Divi sidebar or footer as an Instagram widget.

First, go to Appearance » Widgets from your WordPress dashboard.

open widgets page of your website

On this page, click on the Sidebar panel to add Instagram feeds to the Divi theme sidebar area.

select sidebar for widget

Or if you want to showcase Instagram feeds on your Divi footer area, you can click on the Footer panel if you prefer.

select footer for facebook widget

We’ll use a sidebar for this tutorial.

After you’ve chosen sidebar, click on the plus icon (+) and then select the Shortcode widget from the options.

shortcode widget instagram

Finally, paste your shortcode from earlier in the Shortcode field.

Once you’re done pasting the shortcode, just click on Update to save your changes.

paste instagram feed shortcode

You’ve now added an Instagram feed to your Divi sidebar. See how quick and easy that was because you used a plugin like Instagram Feed Pro?

Simply check your site, and you can see your Instagram feed embedded in the sidebar area.

Below, you can see the Instagram divi feed example that I’ve created for this tutorial.

sidebar instagram divi website builder example

Add Instagram Feeds to Your Divi Site Today

And that’s it! Hopefully, this post showed you how to embed an Instagram feed on your Divi website in minutes.

Ready to get more followers and engagement with Instagram feeds? Get started with Instagram Feed Pro now so you can create, customize, and add Instagram feeds to the Divi theme to grow your website.

Looking to embed other social media feeds to Divi? You may want to check these next posts:

If you found this article to be helpful, give us a follow on Twitter and Facebook, and stay tuned for more social media marketing tips and tricks.

author avatar
Sajjan Sharma Senior Writer
Sajjan has been writing about WordPress, social media marketing, and online businesses for over 10 years. His professional interests extend to include influencer marketing, content curation and digital marketing strategies.

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.