How to Add Social Media Icons to Header or Footer

FAQ  How To  Last Updated: Time to Read: 1 minute

Social links can be added to any menu location using the Layers Pro extension, which adds an array of icons to the Custom Link tab in the Menus admin page.  These are font-icons that will inherit the same colors as your nav links, or can be customized separately using custom classes in the menu link options as normal. You can see this  in action in the Footer menu on this site and our demos.

  1. Go to Appearance  → Customize
  2. Expand the Menus panel
  3. Select the menu to edit or +Add a Menu
  4. Click +Add Items
  5. Select the icon of your choice and enter the full URL to your social profile. Example: http://www.facebook.com/oboxthemes
  6. Check the menu location where you would like the icons to appear.
  7. Click Save & Publish

social-menu

Several action hooks in the header and footer use adding social icons or other custom HTML as an example. See the following references:

To add custom controls to the Customizer for setting links in a child theme or plugin that does not require hard-coding urls with HTML, see our example in the Custom Controls section of the developer guide.