In the German speaking area we have a social network called XING which is quite relevant. It is like LinkedIn but located in Hamburg, Germany and quite established while it exists since 2003. Until 2006 it was named openBC or Open Business Club which pretty much tells what it is all about.
If you have anything to do with freelancing or job placement in the german-speaking area you probably want to link to your profile there. Therefore I will provide you with a XING icon font to seamlessly integrate into your Divi Child Theme Social Bar.
The XING icon font
The first thing we want is a XING icon font to match the Divi social icon font called ETmodules. This icon font comes with 360 awesome icons but XING isn’t among them, sadly. The XING icon can luckily be found at IcoMoon and even downloaded as a webfont in the IcoMoon-App. Awesome!
We then save the xing font files to a subfolder of our child theme named “fonts”.
Loading the font
The next thing we need to do is to load the XING webfont into our theme. This is done in our child theme style.css like so
Customizing the template
Divi displays the social icons from a template located at /includes/social_icons.php. We add the same folder and file to our child theme to make WordPress use this one instead.
We now want to add another list element containing our xing icon and link to our profile.
Styling the icons
The last thing we need to do is to style the icon according to our theme. This goes into your child themes style.css and could look like this
And there we have it: a perfectly matching XING icon with our Divi child theme. This can easily be adapted to any theme using icon fonts to display social icons. Could you get that to work? How do you like it?