How to Add More Social Media Icons to Divi

Divi lets you control and design every detail of your website, from header to footer and everything in between. Some of the most-clicked elements of any website are social media icons. An engaged audience wants to find you elsewhere and get to know you. Obviously you’ll want to make that as easy and frictionless as possible. So we’re going to show you how to enable extra social media icons in Divi’s theme options, how to use the Divi Builder to insert social media icons anywhere on a page or post, and how to take advantage of the power of the Divi Theme Builder to add social media icons to every nook and cranny of your site.

How to Easily Enable Extra Social Media Icons in Divi’s Footer

The simplest way to add more social media icons to your Divi site involves accessing the Theme Options panel, enabling the options for Facebook, Twitter, Instagram, and RSS. You then just enter your profile URLs into the fields. When you do this, you’ll see them show up as icon links in the footer of your site:

In your WordPress dashboard menu, navigate to Divi – Theme Options and click on the General tab. Scroll down to see the network toggles. Also, just under those toggles, be sure to enter the URLs for each Divi social icon you enable. Otherwise, the icon will appear, but clicking it will take the user nowhere. Using a # in place of a URL will keep the user on the page rather than potentially redirecting them to a 404 page.

Scroll all the way down to the end of your theme options and click Save Changes. Now you can check out your site’s footer and click on the social icons to test them out!

If you don’t see the icons in your footer, make sure to check your Theme Customizer under Appearance – Customize and make sure that Show Social Icons is checked under the footer options.

If, however, you want even more options for footer social icons, continue scrolling down to our section on the Divi Theme Builder where we discuss both custom templates and global defaults.

How to Use the Divi Builder to Add Social Media Follow Modules in Page or Post Content

Sometimes, putting extra social media icons between blocks of text, images, or other content in the body of pages or posts can make a lot of sense. Your landing page or About page, for example, would be a good place for adding extra social icons to help inform visitors about how to connect with you. They’ll certainly stand out more than simply linking to your social profiles using regular text. Plus, people are tuned into looking for recognizable icons.

You can use the Divi Builder to insert social media icons directly into your pages or posts using the Social Media Follow module.

Any time you create or open up an existing page or post in your WordPress dashboard, you’ll see a large purple button asking whether or not you want to use the Divi Builder.

And of course you do. Simply click Use Divi Builder to start building your page or post from scratch (or from one of our premade layouts). Additionally, you can include the Divi social media icons if you’re using the default WordPress editor. All you need to do is insert a Divi Layout block and follow the same steps we’re going through below.

You can use the tool to design your page or post however you like using the available page builder modules. If this is your first time using the Divi Builder, you may want to check out this overview first to get a clear understanding of how it works.

When you’re ready to add social media icons to your page, click on the black + circle in the section you’d like to place your social media icons and scroll until you see the Social Media Follow box.

You’ll be asked to choose the social networks you want before you can start customizing them. Click Add New Social Network.

Next, select one from the drop-down list.

With that chosen, add your profile URL. Optionally, you can select a specific color, gradient, background, etc. for its icon.

Once you’ve added your first social network, you can continue to add further networks by following these same steps. They’ll all be listed under the Content tab of the Social Media Follow Settings. You can edit, copy, or rearrange by dragging them around and dropping them in place.

Once you’ve added your social networks, continue onto the Content and Design tabs to play around with some further customization options. You can change everything from box shadow, border radius, spacing, filters, and even the intro animation for the icon module. You also the option to include a Follow button for all of your icons to draw more attention to them. When you’re all done, click the green checkmark.

You can then move the icons around your page, work on their spacing and layout as you see fit. (The Divi transform options are amazing for this, by the way.) When you’re happy with all your decisions, hit the green Save (or Publish) button in the lower-right corner to save your new social media icon module. If you don’t see a Publish/Save button, press the purple ellipsis (three dots) in the lower-center of the screen to expand the menu.

After that, your social media icons will be live on your site.

Using the Divi Theme Builder to Add Social Media Icons

As we mentioned above, the Divi Theme Builder is a powerful tool that gives you complete control over pretty much every aspect of your site. So if you’re looking at adding social media icons anywhere, the theme builder has you covered.

To get started with the theme builder, navigate to Divi – Theme Builder in your WordPress dashboard.

It is very to add social media icons to an existing Divi theme builder layout. Or to a new one! It doesn’t matter if you’re adding to the global header, footer, or body of your site — or even to only certain categories or other specialized page types. You will follow the same process.

We are first going to find the section we want to add to. Again, it can be global or custom. If you haven’t used the theme builder before, it’s easy. We are going to add social media icons to individual posts. So you can start out by either clicking Add New Template and selecting All Posts or Posts in Specific Categories. Then check the categories you want to include. Then click Create Template.

If you already have templates set up, all you have to do is click the Edit Pencil or double-click the section you want to edit.

The process of adding social media icons here is the same as it was above in the builder. However, because you’re using the theme builder instead of just editing a single page, the icons won’t just appear in that single spot you choose. Templates can be added to headers, footers, and global templates. And you can choose how and when they appear with only having to set them up a single time. Not on a page-by-page basis, as you would above.

For instance, if we want to include the social media icons below the post title, but above the post content on each blog post we publish, we would just add a Social Media Follow module. Click the Black + circle and select it from the Insert Module dialog.

Then just drag the module to where you want the social media icons displayed. (We are using wireframe mode for this placement). You then just add the social networks you want displayed. Then you customize the sizing and coloring just as you did above.

And just like that, you’ve added social media icons to the Divi theme builder. They will show up on any blog post you make (in this example).

And if you happen to not like how they look there, the theme builder is easy to customize. Just drag them into a different location, such as the top of the sidebar.

Make sure to click the green Save button in the corner. Now each and every blog post with this template on the site will go live with your social media icons at the top of the sidebar.

Adding Social Media Icons to the Header and Footer with the Divi Theme Builder

Perhaps the default social media icons in the Divi settings didn’t work for you or offer enough customization. In that case, you can always use the theme builder to customize it more fully. In any template, you can add a custom footer. This will replace the default Divi one. Any templates without a custom template will show the default theme element. The social media icons can differ from post to page to archive, depending on what your users need.

You can also add a Global Footer which will overwrite any other footers you’ve created. (This also applies to global bodies and headers, too). If you have designed 4 custom footers for posts, pages, projects, and categories, but then create a Global Footer, only the Global Footer will show up. The global templates are excellent for site-wide social media icons for, perhaps, a newspaper or brand. While the custom templates with social icons might be best for individual creators who are part of a network.

By using the Divi Builder for custom headers, footers, and body templates, you can add social media icons to just about any part of Divi you want. You’re not limited to default designs or having to dig into the WordPress file system. Plus, with the theme builder, you can use any of Divi’s design options to spruce up the social media icons and make them stand out in just the right way for each particular audience.

Conclusion

When you have Divi’s default footer options, the Divi Builder tool for posts and pages, the power of the Divi Theme Builder, there’s no reason you’ll need to install a plugin to add social media icons to your website. Divi gives you full control over how your social icons look and where they show up. Whether you need to promote a brand, a guest author, a stable of content creators, or just the places where you yourself can be found online, Divi has a way to do it. We’re biased, but we think it’s the easiest, simplest, and most elegant way to add social media icons to your website.

What do you think are the best places to include social media icons on your website? Let’s share tips in the comments!

Article thumbnail image by Sammby / shutterstock.com