Roslyn - Navigation Menu
Top Header and Footer Navigation
To add a menu to your blog, navigate to Dashboard > Appearance > Menus and click on “Create a Menu.”
Select the items you wish to add to the menu, and click “Add to Menu”. Drag and drop the items into the order you wish them to appear. "Tabbed" items will become drop-downs.
Assign the menu to a Theme Location at the bottom of the menu. In the Roslyn theme, the navigation at the top is the Header Menu. The Footer Menu will display directly to the left of the footer credits.
More information on setting up the menu can be found here.
Header Right Navigation
The Header Right navigation is the navigation menu that displays to the right of the logo.
Create your menu in Dashboard > Appearance > Menu. Do not assign it a location. Navigate to Dashboard > Appearance > Widgets. Drag a Custom Menu widget to the Header Right widget area. Select your menu from the drop drown and save.
Adding The Category Icons
You'll need to install the Font Awesome 4 Menus plugin. Once the plugin has been installed and activated, navigate to Dashboard > Appearance > Menus. Click on "Screen Options" on the top-right of the screen and check on the "CSS Classes" box. Close Screen Options.
Enter the icon code as shown below. You are NOT locked into these specific icons. You can see a whole list of available icons from FontAwesome here.
Head to the FontAwesome site, click on the icon you want to use. Highlight the fa-_______ code below the icon and copy/paste that code into the " CSS Classes" box in your Menu page. Be sure to Save your menu once done.