Blog

Creating Social Network Icons

As part of revamp of our site, we wanted to add some social icons to the page so worked out a little code that may be of use to others.

<div class=" col-lg-2 col-md-2 col-sm-4 col-xs-6"><div class="t3-module module " id="Mod108"><div class="module-inner"><div class="module-ct"><div class="custom"><link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"><div class="container"><h4>Social Networks</h4> <a href="/https://www.facebook.com/inlettechnologies" target="_blank"><i id="social" class="fa fa-facebook-square fa-3x social-fb"></i></a> <a href="/https://twitter.com/inlettechnologies" target="_blank"><i id="social" class="fa fa-twitter-square fa-3x social-tw"></i></a> <a href="/https://plus.google.com/+InletCoNz1" target="_blank"><i id="social" class="fa fa-google-plus-square fa-3x social-gp"></i></a> <a href="/mailto:This email address is being protected from spambots. You need JavaScript enabled to view it." target="><i id=" social"="" class="fa fa-envelope-square fa-3x social-em"></a> </div></div></div></div></div></div>

Basically entering the above into your html will result in the following below. N.B. Remember to change the links as needed.