How Can I Add Social Media Icons Without a Plugin or Images?

Social media icons are one of those “above the fold” checkboxes for websites in most every industry. If you’re using WordPress, or virtually any other major CMS, there is likely a plugin available that will insert social media icons onto your pages. If there’s not, you might use image files of the appropriate logos to approximate the effect.

There are some limitations to both of these methods that manual logo insertion can solve. Some plugins are not as flexible as we might like– limiting themselves to a particular widget box on your pages. How do you get the icons in your header or footer? Or anywhere else, for that matter? Hard image files are handy, but there’s a major drawback unless you’re good with image editing software (e.g., Photoshop): you can’t recolor them. This breaks the cohesive color scheme you’ve likely created for your site. And there is likely no scaling the image files, unless you don’t mind pixelated images… maybe if you’re running a site that’s a throwback to the 90s.

Enter FontAwesome. FontAwesome is a vector icon solution that has been around for years, and offers scalable icons, on-demand. It’s so prevalent that it is integrated into most modern WordPress themes. In fact, if you’re using a WordPress theme that lets you customize the social media buttons, you’re likely using FontAwesome.

With FontAwesome you can add social media icons to your site, anywhere you want, in just a couple of lines of HTML. Since every icon is considered a font character, they’re also ready to be styled: customize sizes, color, padding, etc, the same way you would with any text.

FontAwesome isn’t limited to only social media icons– there are hundreds available to add the little touch of visual attention-grabbing your site could probably use. Check out their very simple instructions to get started. Seriously, it’s one step.

FA isn’t the only game in town. Glyphicons is a useful alternative, and is included in the very popular Bootstrap web framework.

A little HTML and CSS and you can have custom-sized, custom-colored social media icons wherever you want.

Recent Blog Posts

Contact Us Today!

  • This field is for validation purposes and should be left unchanged.