We are in an age where technology is developing so fast. In fact, people are spending more and more time on popular social media websites such as Facebook, Instagram, and so on. which also means that we as site and store owners can find our potential customers very easily.
Instagram has become one of the biggest social media platforms in terms of active users. Besides being active on your account it's very important that you add Instagram to Divi in form of a dynamic feed or at least as a social icon with a link.
In this free guide, we're going to learn how we can integrate Instagram on our Divi website in different ways. So, if you're excited like I am then let's stop wasting time and get started (:
Contents
Why Embed Instagram on the Divi website?
Using the Instagram platform as a part of your business marketing strategy is crucial and we're going to find out why in a minute.
Here are some reasons why you should have Instagram linked to your WordPress website:
Business-friendly: what I mean by friendly is that you can easily promote your products and services by publishing banner ads on your profile.
Various Audiences: Instagram is used by millions of people around the globe which means your ideal customers are definitely using it no matter what kind of business you're doing.
Scalable and Effective: as a small business you can start out for free by constantly publishing posts and engage with your potential customers or even hire a social media manager to save you time. And later on, you can level up by launching paid ad campaigns which give you the opportunity to reach even more clients.
Creative features: it contains a myriad of cool features that you can use for promotion such as hashtags, stories, IG videos, profile bios, and much more.
Completely Free: One of the powerful points of social media websites like Instagram is being completely free to use especially in your early stages where you don't want to take any risks or you don't have a big budget to invest in any sort of paid advertising.
How to Add Instagram to Divi (Options Explained)
Here we are in the actionable part of this guide where we're going to show you the different ways or integration methods to add Instagram to Divi and start enjoying the benefits. Some of the explained options already come with the Divi builder and theme and others will require you a third-party plugin.
1 – Add Instagram Feed to Divi
The first option we're going to be looking at is adding the Instagram feed to your website which I think would an excellent choice for product-based stores, fashion, beauty sites, and those types of websites because it will give the visitors the chance of following your Instagram account to hear the news so you can generate sales for free.
To add Instagram Feed to Divi follow these simple steps:
1 – We are going to use a WordPress plugin called Smash Balloon Social Photo Feed, it's available in the WordPress directory or you can simply log in to your dashboard, install and activate it by going to Plugins > Add New.
2 – Once it's installed it will appear in the left-hand side menu of the dashboard. Hover over it and click “Settings”. Now you'll need to connect your Instagram account.
there are two ways of doing the first one is manually grabbing the access token code and pasting it in there and the second one which is the easiest for most people which is to let the plugin do the connection automatically by just clicking the “Connect an Instagram Account” as shown below.
3 – Once you click the button, you'll be taken to the Instagram login page. log in to your account and you'll be given a confirmation message like the following. it displays the details that the plugin will gain access to and they're pretty obvious, then goes ahead and click the “Allow” button.
4 – After giving the required permissions to the plugin it's going to redirect you back to the WordPress dashboard and a message will pop up. Again, click “Connect This Account”.
5 – Congratulations the account is successfully connected and ready!
The next step is the add Instagram to the Divi process to actually customize the look of the feed and you can easily do that by clicking the “Customize” tab, then you'll have a variety of settings to play around with. You can customize a lot of things such as:
- The height, width, and background of the feed.
- The layout and the number of photos to show initially
- The order filter allows you to order the photos based on dates.
Those are just some of the important ones that I think you'll need to control. Anyway, you can go through all the settings and see what do you want to change. Some of the features are paid. However, the free is actually very generous and has the features to set up a simple feed.
When you finish the Instagram feed customizations don't forget to click the “Save Changes” button at the very bottom of the page.
Under the “Display Your Feed” tab, copy the feed shortcode which is this one: [instagram-feed]
To add the Instagram feed we have created to any page. Open the Divi builder, search for and add the code module.
Once you paste the shortcode you'll notice that the feed now is actually visible on the page and it has pulled out the latest posts you have published and as we said before you can control the order of the posts and other things from the settings of the plugin.
Use the Divi customization settings to add some space, change fonts and the background of your feed to match it with the design of your website.
2 – Add the default Instagram icons to Divi
Some of you might ask me: I don't want a dynamic feed because it takes a lot of space or it slows down my website. is there any way to just use a basic Instagram social icon and linked to my website?
The short answer is: YES, we can do that using the default social media icons that come with the Divi theme by navigating to Divi > Theme customizer. In my case, I have enabled the social icons in the footer as you can see. But the icons are not linked yet!
To add the links of the default Divi social media icons, navigate to Divi > Theme options, scroll down a little bit and you'll see a link field for each social media. paste the link of your profile in there.
When you finish adding the desired social media profiles, scroll up and click the “Save Changes” button at the top left corner. The footer icons we have added early on are now linked.
3 – Insert Social media follow icons in Divi builder
Another easy method to add Instagram to Divi is through a built-in module. You can edit any page using Divi builder and add the “Social Media Follow” module.
From the dropdown, you see a lot of popular social media. you can add the ones you want, for the purpose of this tutorial I am going to add some random ones and Instagram which is what we're talking about today.
Here's how the module looks like, of course, you can customize the size and some other stuff by looking at the “Design” tab as well as insert the link to your Instagram profile.
If you're looking to manage the social following and sharing icons from one place then you might consider the Monarch plugin which you can get when you purchase Divi. Log in to your account Elegant Themes then download the monarch plugin.
Head over to your WordPress admin dashboard, from the left-hand side menu navigate to Plugins > Add New then upload and activate the plugin.
Once it's activated it will appear under Tools > Monarch Settings.
Go ahead and add the social media networks you want to be available for your visitors by clicking on the “Networks” section as you can see below. Enter in the link of your profile then click the “Save Changes” button at the very bottom of the page.
I personally use the Monarch plugin for all social media stuff simply because it does offer pretty much everything you are going to need. it also provides the ability to add and customize social media share icons to your posts or anywhere on your site.
You can manage the social sharing icons by clicking the “Social Sharing” tab at the top then going through the settings and choose what works best for you. they're very easy by the way. from the settings, you can set it to display all across the website or in a particular set of pages such as Posts only which I think you're going to need to do.
I can't go in-depth on each setting since this tutorial is about Instagram social icons but you can discover the settings and play around with them.
For instance, I have added the Instagram profile.
To display it we have various options:
- Display it as a widget in the footer or sidebar by going to Appearance > widgets and adding the Monarch widget.
- Embed the monarch shortcode using the code module inside the Divi builder.
5 – Add Instagram link to Divi theme [Creative]
If you already have a lot of plugins installed on your WordPress site then you probably want to keep the plugins count to a minimum as it helps keep the site loading fast and provides a good user experience for your users.
If you're in this situation then I have something cool for you!
The idea is to use the Divi page builder to design a custom Instagram follow box then add the link to it as I have done in the example shown below.
By using this creative way you're resolving the issue of adding more plugins. Moreover, you'll have a ton of settings to customize and you can easily edit it anytime you want.
That's set for the add Instagram to Divi guide. Congratulations if you have made it till the end!
Further Reading:
- Divi Menu Customizations On WordPress (Explained)
- Add Facebook Pixel to Divi On WordPress
- Divi Custom Footer Guide On WordPress
- Google Maps in Divi Builder Guide (3 Easy Ways)
Roundup
To close up, Instagram and similar social media websites are a gold mine for you as a site owner no matter what kind of business you're doing whether you're running an e-commerce store or a local area shop. you should definitely take the advantage of it and spread the word.
In today's guide, we have gone through almost all the methods that you can use to add Instagram to Divi. So if you didn't link Instagram to your website by any means then go ahead and do so because you're maybe missing some of your customers.
I hope you found this article valuable by any means, If you have been using Instagram then let us know your experience and how you think it helped your business? If you still have any questions regarding the integration process then feel free to drop them in the comment section below.
Otherwise, stay safe and see you in the next post (:
Cheers!
