Adding a social profile menu to WordPress

Last year, Justin Tadlock posted about a simple way to add a social media navigation menu in WordPress. He then followed it up with a post showing how to use this method with the Genericons icon font. This is a slick trick so that you can use WordPress’s core menu system to add a list of links to your social profiles. You’ll see them on most pages. You can see it here at the very bottom of my site on the right.

Warning: this post is for advanced WordPress developers who are comfortable adding PHP and CSS code to their themes or plugins.

I wanted to use the same concept that Justin demonstrated for a client’s site I’m working on at the moment. But I wanted to use the Socicons font, an icon font that includes support for tons of social networks, instead of the Genericons icon font. It was pretty straightforward, so I thought I’d share the CSS code I used to get it working in case anyone else finds it useful.

I put it up as a Gist, so you can have a look at the CSS code. To get this working, you’ll need to follow Justin’s steps to set up the navigation menu, copy how he loads the Genericons font to load the Socicons font, and then follow the instructions at the top of my CSS code to register your navigation menu for use with the CSS code.

Call to action box goes here
Need a Plugin to Improve Your Site?
Browse Plugins Now
New Plugin Launch: AI Admin Assistance for WordPress
New Plugin Launch: AI Admin Assistance for WordPress

We’re excited to share the latest release from our sister brand, WP AI Power Tools: AI Admin Assistance, a WordPress plugin that adds a smart, slide-in help panel and AI assistant to any or every screen in your wp-admin. Whether you’re managing your own site or building for clients, this plugin lets you embed guidance,…

How to Use WPML with Five Star Restaurant Menu
How to Use WPML with Five Star Restaurant Menu

If you are running a multilingual restaurant website, you may want to translate your menu, sections, and items so your customers can browse in their preferred language. The good news is that Five Star Restaurant Menu is built with localization in mind and works with translation plugins such as WPML. Here is how to configure…

How to Quickly Optimize the SEO of Your Blog Posts and More with AI-Powered SEO Suggestions
How to Quickly Optimize the SEO of Your Blog Posts and More with AI-Powered SEO Suggestions

Optimizing on-page SEO can be time-consuming, especially when you want your posts to rank and attract more clicks. Reviewing titles, headings, meta descriptions, links, images, and readability manually can slow down your workflow. AI-Powered SEO Suggestions, offered by our sister company WP AI Power Tools, streamlines this process by giving real-time AI-powered guidance right inside…

Discover More Posts
Browse Plugins Now