Divi lets you control and design every detail of your website, from header to footer. One 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 this as easy as possible.
So we'll show you how to enable additional social media icons in Divi's theme options, how to use Divi Builder to insert social media icons anywhere on a page or post, and how to leverage the power of Divi theme Builder to add social media icons to every nook and cranny of your site.
How to easily activate additional social media icons in the Divi footer
The easiest way to add more social media icons to your Divi site is to go to the panel Theme options , activating options for Facebook, Twitter, Instagram and RSS. Then all you have to do is enter your profile URLs in the fields. When you do this, you'll see them appear as icon links in your site's footer:
In your WordPress dashboard menu, go to Divi - Theme options and click on the tab General . Scroll down to see the network switch. Also, just under those toggles, make sure to enter the URLs for each Divi social icon that you activate. Otherwise the icon will appear, but by clicking on it the user will be nowhere. Using a # instead of a URL will keep the user on the page rather than potentially redirecting them to a 404 page .
Scroll to the end of your theme options and click Save Changes . Now you can go to your site's footer and click on the social icons to test them out!
If you don't see the icons in your footer, be 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 social footer icons, keep scrolling down to our section on the Divi Theme Builder where we discuss both custom templates and overall defaults.
How to use Divi Builder to add social media trackers to a page or publish 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 to add additional social icons to inform people visiteurs on how to connect with you. They will definitely stand out more than just linking to your social profiles using regular text. Also, people are looking for recognizable icons.
You can use Divi Builder to insert social media icons directly into your pages or posts using the social media tracking .
Each time you create or open an existing page or article in your WordPress dashboard, you will see a large purple button asking if you want to use Divi Builder or not.
And of course it does. Just click Use Divi Builder to start building your page or posting from scratch (or from one of our predefined layouts ). Additionally, you can include the Divi social media icons if you are using the default WordPress editor. All you need to do is insert a block of Divi layout and follow the same steps as we follow below.
You can use the tool to design your page or post as you like using the available page builder modules. If this is your first time using Divi Builder, you might 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 the black circle + in the section in which you want to place your social media icons and scroll until the box of social media tracking appears.
You'll be asked to choose the social networks you want before you can start customizing them. Click on Add a new social network .
Then select one from the drop-down list.
With that chosen, add the URL of your profile. Optionally, you can select a color, gradient, background, etc. specific for its icon.
Once you've added your first social network, you can continue to add other networks by following these same steps. They will all be listed under the tab Contents of social media tracking settings . You can edit, copy, or rearrange them by dragging and dropping them into place.
Once you've added your social networks, go to the tabs Contents et Design to play with other customization options. You can change everything from the shadow of the box, the radius of the border, the spacing, the filters and even the intro animation for the icon module. You also have the option to include a button Follow for all your icons to draw more attention to them. When you are finished, click the green tick .
You can then move the icons around your page, working on their spacing and layout as you see fit. (The Divi transformation options are amazing for that, by the way.) When you are satisfied with all of your decisions, press the green Save (or Publish) button in the lower right corner to register your new social media icon module. If you don't see a Publish / Save button, tap the purple ellipsis (three dots) at the bottom 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 just about every aspect of your site. So if you are looking to add social media icons anywhere, the theme generator has you covered.
To start with the theme generator, go to Divi - Theme generator In your WordPress dashboard.
This is very about adding social media icons to a builder layout Divi theme existing. Or to a new one! It doesn't matter if you're adding to your site's overall header, footer, or body — or even to certain categories or other specialized page types. You will follow the same process.
We will first find the section we want to add. Again, it can be global or personalized. If you've never used the theme builder before, it's easy. We will be adding social media icons to individual posts. You can therefore start by clicking on Add a new model and selecting All posts ou Messages in specific categories . Then check the categories you want to include. Then click on Create a template .
If you have already set up templates, just click on Edit pencil or double-click on the section you want to modify.
The process of adding social media icons here is the same as described above in the generator. However, since you are using the theme builder instead of just editing a single page, the icons will not appear just where you choose. Templates can be added to headers, footers, and global templates. And you can choose how and when they appear without having to configure them once. Not page by page, as you would above.
For example, if we want to include the social media icons below the post title, but above the post content on every blog post we publish, we'll just add a module to daily social networks. Click on the circle Black + and select it in the dialog Insert a module .
Then just drag the module to where you want the social media icons to appear. (We are using wireframe mode for this placement). Then you just need to add the social networks you want to display. Then you customize the sizing and coloring like you did above.
And just like that, you have added social media icons to the social media generator. Divi theme. They will appear on any blog post you create (in this example).
And if you don't like how they look, the theme generator is easy to customize. Just drag them to a different location, such as the top of the sidebar.
Make sure to click the green button Save in the corner. Now every blog post with this template on the site will upload with your social media icons at the top of the sidebar.
Adding social media icons to the header and footer with Divi Theme Builder
Maybe the default social media icons in Divi settings weren't working for you or didn't offer enough customization. In that case, you can always use the theme builder to customize it more completely.
In any template, you can add a custom footer. This will replace the default Divi. Any template without a custom template will display the default theme element. Social media icons may differ from post to page archive, depending on the needs of your users.
You can also add a global footer which will replace all other footers you created. (This also applies to global bodies and headers).
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.
Global templates are great for site-wide social media icons for, maybe, a newspaper or a brand. While personalized templates with social icons may be best for individual creators who are part of a network.
By using Divi Builder for headers, footers, and custom body templates, you can add social media icons to almost any part of Divi you want. You are not limited to the default designs or have to dig into the WordPress file system. Additionally, with the theme generator, you can use any of Divi's design options to spruce up social media icons and make them stand out in the right way for each particular audience.
Conclusion
When you have the default Divi footer options, the Divi Builder tool for posts and pages, the power of the Divi Theme Builder, there is no reason why you 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 are.
Whether you need promote a brand, a guest author, a stable of content creators or simply the places you yourself can be found online, Divi has a way to do it. We're biased, but we think this is the easiest, simplest, and most elegant way to add social media icons to your website.
