Adding a Custom Menu in your WordPress Site or Blog (Static or Drop Down Menu Options)

Custom Menu is a really a Great Feature with Drop Down Menu and much more features like: Open Link in New Tab etc. for all new & old Bloggers who are Blogging using WordPress as their Blogging Platform. Earlier when I was new to WordPress I used to search for new themes all the time as free WordPress Themes were with very little advanced features and initially I was not prepared to go for a Paid Theme. So here is the solution for adding one of the extreme important features of Reputed Blogs – Drop Down Custom Menu in WordPress.

Custom Menu Drop Down & Features in WordPress

Features of a Custom Menu In WordPress (Topics Covered)

You can see that WordPress by default itself provides us multiple options and useful features to work with and improve our Blogs. Whereas many of us including me in past wasted so much time on searching WordPress Plugins for these features itself.

How to enter Menu Options in WordPress?

  • Login to your Dashboard.
  • See Menu Option under Appearance as shown in the above image.
  • Click to open the Menu Options in WordPress.

Let’s discuss first those Options which do not need Coding

Positioning Of Menu Items – by default in WordPress, menu items list in a systematic order either you choose alphabetically or by Page Id or by Date. But using custom menu in WordPress in doesn’t matters how they are aligned i.e. you can set the links in any order as you like.

Selected Links Only – by default in WordPress, if you are not using any custom menu then all the links are shown at the place of menu. And this will show the Pages or Categories that are not to be shown in the menu. So Custom Menu lets you to choose selected links that has to be displayed in the List.

Options To Add Individual Links – by default WordPress themes provides only two options to be displayed i.e. either all Pages or All Categories whether your theme supports single or multiple menu options. But using this option you can go for the selection from Posts, Tags, Categories, Pages & even Custom Links. To add External Links in WordPress Menu Just go under the Tab Options and Check the Links you want to Add in the Menu List and click Add Menu. In case of Custom Links add the URL of the Link and give a name to the Link visible in Menu.

Note: To activate the below mentioned Options you need to open Screen Options and check the Options Required. Which will then become visible when you will open the Link Details (click on the down arrow on top-right position).

Open Link in New Window / Tab – by default all the links either in menu list or in the pages or posts of WordPress blog, all the links open on the same page (reloading for the new URL). But using this feature you can choose which links has to open on the same page and which links needs to be opened on a new page. It is a very good option for External Links and some internal pages like About us or Contact us.

Description – this is very common and the term itself tells you what to do. It adds whatever you write and is visible when somebody hover a link. Good description can help in SEO & improving Page Rank.

Till now you must have completed the process of adding custom menu items in the list and if you need a static menu than it is already ready and skip the next step or else for drop down menu go ahead.

Drop Down Menu Options – this is the most useful and extreme feature of any blog. Well, all the good and Premium themes do have this feature by default for Pages and/or Categories. But, if your theme is good and is set to your blog perfectly but, missing a drop down menu then follow these simple steps and make your good theme into a better one.

The links that comes in the drop down list are called sub-menu items or Child Links. The link has to be placed under the head menu item or say Parent Links in the List. Eg. If we need to put WordPress and/or Online Solutions under the Parent option Blogging than we need to put both under the Blogging option and then rest of the list to follow in same manner. There are 2 options to add a sub-menu or Child Links under Parent menu item:

1. Simply using the option as shown in the Image Under Games (Parent Menu) – which will automatically be replaced with the main (Parent) menu item and just select the option.

2. Second option is to drag a Child Links under the Parent Link and Drag it a little bit on the right side of the Parent Link as shown in the Image.

Similarly do it for all the Child Links you want to put under the Parent Links. At the time of visibility Parent Links are shown and Child Links comes as soon as mouse points over (Link hovering) the Parent Links. To position under the different menu item you can either drag the Link till its right position or else you can use Up One or Down One options (see image) to place them.

Now the remaining option needs some Basic Knowledge of (HTML & CSS Codes)

Link Relationships (XFN) – this is a very unique and good for SEO options and is optional too (those who don’t know about Search Engine Optimization). The term XFN Stands for XHTML Friends Network here in WordPress and this feature simply adds a {Rel = “Tag”} where whatever you write in option will replace “Tag”. eg. Rel = “Author” or “Friend” which spreads information to search engines that this link relates to the Author or Friend Respectively.

>> Learn more about Rel = “Tag” in details

Additional CSS Classes – this option let’s you to customize the style of the particular menu item. If you are aware of CSS Styling codes than you can simply add a {.class} which has to be associated with that particular link. You can change the color, size, background etc. with this feature for single menu item.

Tips:

  • The Links placed on higher position will align to left in the Static List & will align to the Top in Drop Down Menu List.
  • Using a drop down list with custom menu also lets you to change your themes anytime as it won’t affect on your menu position whether the new theme supports drop down menu by default or not.
  • If CSS class doesn’t works with the (.classname) than try without (.) i.e. (classname), if still not working try to add Custom CSS in the main CSS File instead of Custom CSS option or alternative.
  • Try focusing most important Parent Menu Items in extreme left and extreme right positions, according to me they are premium places for Main Links.
  • Remember to activate list of options from Screen Options as shown in one of the above images.

Sources: Lot of Search by & WordPress.Org