In the online demo of this template, you will notice there is a small top menu in the upper right corner. This is a pre-styled menu that you simply make your menu links for. Although you can use this area for any menu you wish to place here, or maybe nothing at all, but if you want the same kind of menu shown, then this quick tutorial will show you how.
Specifics of this Menu Area
- The template code area for this is in a div container called “topmenu” and when you publish something here, it does have a background image that is predefined in the template.css file on line 220.
- The top menu items have three premade icons (email, subscribe, and home) but you can always create your own
- The menu.css file, starting on line 78 is where you will find the styles for this if you need to make adjustments
- This module position is called “top” and is fully collapsible if not used.
Add Your Top Menu
- Go to your menu manager and click NEW and name your fields as you wish but I recommend you title your menu and module as Top Menu; click SAVE
- Add your menu items to this new menu group, i.e. Home, Contact, RSS Subscribe…etc. Don’t forget that if you want to use the premade icons for each one, to apply the menu image to each one you make.
- Go to your Module Manager and open the “Top Menu” module and set your parameters as: Show Title: No, Position: Top, Publish: Yes, Menus: All, Menu Style: List. Then go to the “Other Parameters and do: Show Menu Images: Yes, and then click SAVE.
- Check the front of your site and you should now see your new menu at the top right of your page.