You need to create Menu from Appereance -> Menus and choose create a new menu option.

After that you can choose Pages, Posts, Custom Links(useful for One-Page layout’s menu), Categories from the left column and click Add to Menu button. The selected menus will be added under the Menu Structure. Then you will need to choose Theme Locations under the Menu Settings:

  • Choose Header Menu if you want to use the menu at the top of your website.
  • Choose Top bar (Not login) Menu if you want to set a custom menu for the Not Logged In users of your site.
  • Choose Top bar (Login) Menu if you want to set a custom menu for the Logged In users of your site. We recommend not to use this menu, since there a default menu setup already for your Logged In users.

For More info see the image below:

How to make Login/Signup menu at the top bar like live demo site?

At first create a new menu and choose Top bar (Not login) Menu as shown in the screenshots above. Then create a Custom Links menu like the following screenshot:

After that from the top right corner click on the ‘Screen Options’ and then give tick mark on ‘CSS Classes’ and ‘Description’. See below screenshot:

Then, you will see the ‘CSS classes’ field and the ‘Description’ field under the custom link menu you just created. Put ‘login-comments’ in the ‘CSS classes’ field and ‘fa-lock’ (or any other font-awesome icon) in the ‘Description’ field. Your Login menu is created and it will work as like the demo. If you forget to put ‘login-comments’ in the ‘CSS classes’ field, the Login menu will be created, but it will not work (Login Form will not come). And, for Signup menu link, you need to put ‘signup’ in the ‘CSS classes’ field and ‘fa-user-plus’ (or any other font-awesome icon) in the ‘Description’ field.

How to create menu in the Top Bar Left Side?

Top bar left side can have maximum 3 menu items, otherwise it can break the top bar design. That is why ‘WP Nav Menu’ does not have any option to create the Top bar left side menu items. You will have the 3 menu item options under the ‘Header Settings’ of your ‘Theme-Options’.

How to remove the signup/login area from Top Bar?

1. Visit your ‘Appearance –> Theme-Options –> Header Settings’ page and find the following option and switch it ‘On’.

switch-on

2. Visit ‘Appearance -> Menus’ page and find the menu which is selected for ‘Top bar (Not login)’ And/Or ‘Top bar (Login). Delete that menu. See the following screenshot:

top-login

 

How to add Ask Question or Post Question button in the header menu?

Under the ‘Header Settings’ of your ‘Theme-Options’ you will find a field saying ‘Label of Main Menu Post Question Button’.  If you put some text there (for example: Ask Question) the button will be visible at the right side of the Header Menu as you see in our live preview. After that, put ‘#ask-question’ in the URL field of the button.

Now you are done creating the button. But, it will not work yet as like our live demo. Couple of steps to follow to make the button functioned like the live preview –

1.1. Create a new page using ‘Add Question’ template

1.2. Select that page as ‘Add question’ page from ‘Theme-Options –> Questions’ settings

If you have already imported the ‘Demo Data’ by following the instructions given here, you can go to 2nd step directly. Because ‘Add Question’ page using ‘Add Question’ template is already created in the demo data. Now, go to the ‘Appearance –> Theme-Options –> Questions’ settings and find ‘Add question page’ drop-down settings. Choose the correct ‘Add Question’ page as described above and save settings. Now you will see the ‘Post Question’ or ‘Ask Question’ button of the Header Menu is working as like our demo.

About The Author