Divi enables you to manage and design each element of your web site, from header to footer and every part in between. Some of the most-clicked parts of any web site are social media icons. An engaged viewer desires to seek out you elsewhere and get to know you. Obviously you’ll wish to make that as straightforward and frictionless as doable. So we’re going to indicate you the right way to allow additional social media icons in Divi’s theme choices, the right way to use the Divi Builder to insert social media icons anyplace on a web page or submit, and the right way to make the most of the ability of the Divi Theme Builder so as to add social media icons to each nook and cranny of your website.
How to Easily Enable Extra Social Media Icons in Divi’s Footer
The easiest method so as to add extra social media icons to your Divi website includes accessing the Theme Options panel, enabling the choices for Facebook, Twitter, Instagram, and RSS. You then simply enter your profile URLs into the fields. When you do that, you’ll see them present up as icon hyperlinks within the footer of your website:
In your WordPress dashboard menu, navigate to Divi – Theme Options and click on on the General tab. Scroll right down to see the community toggles. Also, just below these toggles, remember to enter the URLs for every Divi social icon you allow. Otherwise, the icon will seem, however clicking it’ll take the person nowhere. Using a # rather than a URL will preserve the person on the web page moderately than probably redirecting them to a 404 web page.
Scroll all the best way right down to the top of your theme choices and click on Save Changes. Now you possibly can take a look at your website’s footer and click on on the social icons to check them out!
If you don’t see the icons in your footer, be sure that to examine your Theme Customizer beneath Appearance – Customize and be sure that Show Social Icons is checked beneath the footer choices.
If, nevertheless, you need much more choices for footer social icons, proceed scrolling right down to our part on the Divi Theme Builder the place we focus on each customized templates and world defaults.
How to Use the Divi Builder to Add Social Media Follow Modules in Page or Post Content
Sometimes, placing additional social media icons between blocks of textual content, pictures, or different content material within the physique of pages or posts could make plenty of sense. Your touchdown web page or About web page, for instance, can be a superb place for including additional social icons to assist inform guests about the right way to join with you. They’ll actually stand out greater than merely linking to your social profiles utilizing common textual content. Plus, individuals are tuned into on the lookout for recognizable icons.
You can use the Divi Builder to insert social media icons instantly into your pages or posts utilizing the Social Media Follow module.
Any time you create or open up a present web page or submit in your WordPress dashboard, you’ll see a big purple button asking whether or not or not you wish to use the Divi Builder.
And after all, you do. Simply click on Use Divi Builder to start out constructing your web page or submit from scratch (or from one in every of our premade layouts). Additionally, you possibly can embody the Divi social media icons in case you’re utilizing the default WordPress editor. All it’s good to do is insert a Divi Layout block and observe the identical steps we’re going via beneath.
You can use the instrument to design your web page or submit nevertheless you want to utilize the accessible web page builder modules. If that is your first time utilizing the Divi Builder, you might wish to take a look at this overview first to get a transparent understanding of the way it works.
When you’re prepared so as to add social media icons to your web page, click on on the black + circle within the part you’d like to put your social media icons and scroll till you see the Social Media Follow field.
You’ll be requested to decide on the social networks you need earlier than you can begin customizing them. Click Add New Social Network.
Next, choose one from the drop-down record.
With that chosen, add your profile URL. Optionally, you possibly can choose a particular shade, gradient, background, and so on. for its icon.
Once you’ve added your first social community, you possibly can proceed so as to add additional networks by following these identical steps. They’ll all be listed beneath 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, proceed onto the Content and Design tabs to mess around with some additional customization choices. You can change every part from field shadow, border-radius, spacing, filters, and even the intro animation for the icon module. You additionally the choice to incorporate a Follow button for your entire icons to attract extra consideration to them. When you’re all performed, click on the inexperienced checkmark.
You can then transfer the icons round your web page, work on their spacing and structure as you see match. (The Divi rework choices are wonderful for this, by the best way.) When you’re pleased with all of your choices, hit the inexperienced Save (or Publish) button within the lower-right nook to avoid wasting your new social media icon module. If you don’t see a Publish/Save button, press the purple ellipsis (three dots) within the lower-center of the display screen to develop the menu.
After that, your social media icons will probably be staying on your website.
Using the Divi Theme Builder to Add Social Media Icons
As we talked about above, the Divi Theme Builder is a robust instrument that offers you full management over just about every facet of your website. So in case you’re including social media icons anyplace, the theme builder has you coated.
To get began with the theme builder, navigate to Divi – Theme Builder in your WordPress dashboard.
It could be very so as to add social media icons to a present Divi theme builder structure. Or to a brand new one! It doesn’t matter in case you’re including to the worldwide header, footer, or physique of your website — and even to solely sure classes or different specialized web page sorts. You will observe an identical course.
We are first going to seek out the part we wish to add to. Again, it may be a world or customized. If you haven’t used the theme builder earlier, it’s straightforward. We are going so as to add social media icons to particular person posts. So you can begin out by both clicking Add New Template and choosing All Posts or Posts in Specific Categories. Then examine the classes you wish to embody. Then click on Create Template.
If you have already got templates to arrange, all it’s a must to do is click on the Edit Pencil or double-click the part you wish to edit.
The technique of including social media icons right here is similar because it was above within the builder. However, since you’re utilizing the theme builder as an alternative of simply modifying a single web page, the icons gained simply seem in that single spot you select. Templates may be added to headers, footers, and word templates. And you possibly can select how and after they seem with solely having to set them up a single time. Not on a page-by-page foundation, as you’ll above.
For occasion, if we wish to embody the social media icons beneath the submit title, however above the submit content material on every weblog submit we publish, we might simply add a Social Media Follow module. Click the Black + circle and choose it from the Insert Module dialog.
Then simply drag the module to the place you need the social media icons displayed. (We are utilizing wireframe mode for this placement). You then simply add the social networks you need displaying. Then you customize the sizing and coloring simply as you probably did above.
And similar to that, you’ve added social media icons to the Divi theme builder. They will present up on any weblog submit you make (on this instance).
And in case you occur to not like how they give the impression of being there, the theme builder is straightforward to customize. Just drag them into a unique location, akin to the highest of the sidebar.
Make certain to click on the inexperienced Save button within the nook. Now each weblog submits with this template on the positioning will go stay along with your social media icons on the prime of the sidebar.
Adding Social Media Icons to the Header and Footer with the Divi Theme Builder
Perhaps the default social media icons within the Divi settings didn’t be just right for you or provide sufficient customization. In that case, you possibly can all the time use the theme builder to customize it extra absolutely. In any template, you possibly can add a customized footer. This will change the default Divi one. Any templates without a customized template will present the default theme component. The social media icons can differ from submitting to web pages to archive, relying on what your customers want.
You may also add a Global Footer which is able to overwrite any different footers you’ve created. (This additionally applies to the world our bodies and headers, too). If you have got designed four customized footers for posts, pages, initiatives, and classes, however then create a Global Footer, solely the Global Footer will present up. The world templates are wonderful for site-wide social media icons for, maybe, a newspaper or model. While the customized templates with social icons are perhaps finest for particular person creators who’re a part of a community.
By utilizing the Divi Builder for customized headers, footers, and physique templates, you possibly can add social media icons to only about any a part of Divi you need. You’re not restricted to default designs or having to dig into the WordPress file system. Plus, with the theme builder, you need to use any of Divi’s design choices to spruce up the social media icons and make them stand out in simply the suitable means for every explicit viewer.
When you have got Divi’s default footer choices, the Divi Builder instrument for posts and pages, the ability of the Divi Theme Builder, there’s no purpose you’ll want to put in a plugin so as to add social media icons to your web site. Divi provides you full management over how your social icons look and the place they present up. Whether it’s good to promote a model, a visitor creator, a secure of content material creators, or simply the locations the place your self may be discovered on-line, Divi has a method to do it. We’re biased, however, we predict it’s the best, easiest, and most elegant means so as to add social media icons to your web site.
What do you assume are the very best locations to incorporate social media icons on your web site? Let’s share ideas within the feedback!
Article thumbnail picture by shutterstock.com