How to customise a WordPress website: Part 2

Customise the navigation menu

We’ll make a few changes to the navigation menu. This is fairly easy.

From Appearance/Graphene Theme Options/Colors, open the options for Primary Menu and run through the choices to make your own colour selections. For the time being, I’ve changed the white on black to white on blue by selecting blue from top and bottom background options in the Primary menu tab.

Change navigation colours from Graphene Options/Colors and make your choice from the Primary menu options.

You can, of course, change the nav menu to whatever colours you like. The spectrum is yours to choose from, with the range of choices covering default, hover and active states, including the main menu and dropdown menu. This is a great facility to have as most free themes and a lot of premium themes don’t have an easy back-end control like this to change nav settings.

This is how the top of my site looks with the header in place and a change of nav colour.

There’s a lot of stuff in the menu at the moment that I don’t want as the fine folk at Graphene have put loads of sample pages in. You might find these useful, so have a look through them and keep what you want but I’m going to delete them all apart from the Contact Page.

To delete pages, go to Pages/All Pages on the left-hand side of the work pane and select the ones to delete. After deleting the ones I don’t want, the nav menu looks like the screen shot below.

My next foray will be to remove the top bar as it weighs down on the page and I prefer to put a search form and RSS feed button in the sidebar rather than at the top of the page.

This is a simple matter of finding Top Bar options, which is eighth on the list under Graphene Options/General, and checking the box to hide the top bar and pressing Save All Options.

Tick the box to hide the top bar and hit the Save button.

If you want to keep the top bar, you can change the colours to your own tastes under Graphene Theme Options/Colors.

The screen shot below shows what the site looks like with the top bar gone and the Contact Page renamed as Contact.

A note about setting navigation menus

Check your menu settings to make sure your nav shows what you want it to show.

Go to Appearance/Menus as shown below and name your Primary Navigation as Primary Navigation. Check the box to automatically add new top-level pages.

On the left of this page you will see Theme Locations. Make sure your Header Menu is set to Primary Navigation and Save.

If you want a Home Page link, then under Custom Links add your home page address (in this case http://www.mysteryreading.com), set Home as the label and click on the button to Add to Menu and then click on Save Menu on the right-hand of the page.

Set a Home page link to show up in the nav menu.

 

As you add categories you will need to go back to this page to select the category and add it to the menu so it shows up in the nav. You can drag and drop the menu items in whatever order you want. Always remember to Save Menu at the end of making any changes. You can see in the screen shot below that I have set up a Blog category.

You can reorder navigation menu items by dragging and dropping.

On the next page, I’ll look at adding content