The Start Blogging theme uses menus for social icons and then uses menu locations that are already predefined within the theme template files…one in the header.php file and the other in the footer.php file.
The top social icon group looks like:
The bottom social icon group looks like:
You have the option to make two separate menus, or you can make one and assign it to both locations.
Here is a list of what social network icons are available in this theme:
- RSS Feed
- Deviant Art
- Dribbble
- Flickr
- Google+
- GitHub
- Stumbleupon
- Tumblr
- Vimeo
- WordPress.com
- WordPress.org
- VK
- Mailto:
Create a Social Menu
- Go to Appearance >> Menus, then click on the “create a new menu” text link:
- Name your menu anything you want:
- Click on the “Create Menu” button:
- Once created, you will then see a Menu Settings group of options…choose the Social locations that you want this menu to show. For this theme, you can choose “Social Menu” (which is the bottom one), or the “Top Social Menu” location(s).
Adding Social Links
These are the links to your social profiles.
- After you made your social menu, open the “Custom Links” tab and add in the link to your profile and then the name of the network:
- Click on the “Add to Menu” button
- Repeat for each social network you want to show
- Click the “Save Menu” button
Add Your Own Social Icon
If you need more, you can use the Font Awesome icon set as a reference to add any of their available icons by doing your own custom CSS. Using the Twitter icon as an example, you can use it as a template to add your own icon; just replace the link twitter.com part and the content “\f099” to the one you are going to use:
.top-social-icons a[href*="twitter.com"]:before,
.social-icons a[href*="twitter.com"]:before {
content: "\f099";
}
The Font Awesome website will show you want content ” ” code to use and then add the code above with your changes to the customizer’s Additional CSS tab. Once done, you can then continue adding your social icons to the social menu.