How to Configure Menus

You have a number of choices when it comes to presenting menus for your visitors.

Pages in Sidebar

OM4 Default Menu - Pages in Sidebar By default, your OM4 site will start out with Pages displayed in the sidebar. This will display all pages that you create in the sidebar, with sub-pages nested below their parents.

If you want to exclude one or more pages, you need to find the Page ID (see below) for the pages you want to exclude.

Then go to Dashboard, Design, Widgets and click the configuration button for the Pages widget. Enter the Page IDs you want to exclude, separated by a comma.

Excluding Pages from the Pages Widget

Tip to avoid Excluding Many Pages: If you have a lot of pages you don’t want on the menu, update the pages to have a Parent Page. Exclude the parent page from your menu, and that page- along with all its sub pages - will be excluded from the menu. We often use an Admin page for this purpose, and exclude it from the Pages widget.

Finding Page IDs

Wordpress 2.3 Interface: Under Dashboard, Manage, Pages, you can see a list of all your web pages, with the Page ID shown on the left.

Wordpress 2.5 Interface: Under Dashboard, Manage, Pages, you will see a list of all your web pages. If your browser shows the URL in the status bar, when you mouse over a link, you can see the ID as part of the URL displayed in the browser status bar. In FireFox you can show the status bar by checking the Status bar choice under View.

Custom Menu Bar

Placing a menu bar under the Header can make it very easy for a visitor to navigate around your site. A custom menu places a set of text links below your header:

Here is another example of an OM4 site using a Custom Menu Bar.

Use Dashboard, Design, Site Design to configure your custom menu.

Scroll down to the Menu section and set Menu Type to Custom Text Menu
Menu Bar height and margins are default for a left aligned menu. You can adjust if you need to.
In the Custom Menu Text field, enter a set of links (one per line) to pages on your website. It is easiest to do this using relative links (see example below), but you can use fully qualified URLs as well.

This is how you create two links in a custom menu, to your Home page and About page:

<a href="/">Home</a> <a href="/about/">About</a>

Don’t be afraid to experiment with menu settings, just use a pen and paper to jot down the settings you like, so you can restore them if your experiments don’t always pan out.

Menu Bar over or above your Header Image. Do you want your Menu Bar to float over, or sit above, your Header image? You can set a negative top margin on your Menu Bar so your menu appears in the header area. If you want your menu to appear above your header, set the height of your header are to 25 px more than the height of your header image, and make sure the Header Image Alignment aligns the image to the bottom of the header area. Then use a negative margin on your Menu Bar to move your menu up above the image. You will need to experiment to get the exact settings.

Sub Pages in Sidebar

You can combine a Custom Menu Bar with the Sub Pages widget to display a list of sub pages in the sidebar for the current page. When the current page changes, the list of sub pages automatically updates.

You can see this in action on Janet Shaw’s site. Notice when you click on the Author menu that there are two sub pages visible in the sidebar, above the Testimonials. But if you click the About Me menu it, there are no sub pages so the Testimonials appear at the top of the sidebar.

To use Sub Pages:

Configure your Custom Menubar so visitors can choose the main pages
Use Dashboard, Manage, Pages to setup your pages and sub pages. Use the Order field to set the order in which pages appear.
Use Dashboard, Plugins to activate the Sub Pages plugin
Use Dashboard, Design, Widgets to place the Sub Pages widget in your sidebar

Dynamic Dropdown Menu

A recent addition to the OM4 Theme has been Dynamic Dropdown Menus. You can see these in action on the Kimberley Cruise website.

Dynamic Dropdown Menus will display all your Master Pages (that is, pages without a Parent) in your menu unless you exclude them by Page ID. All Sub Pages for each Master Page are displayed in a drop down menu under the main item, displaying the page title as the menu text.

Use Dashboard, Design, Site Design to configure your dynamic dropdown menus.

Scroll down to the Menu section and set Menu Type to Dynamic Dropdown Menu
Set Dynamic Menu Options
Set up your Pages and Sub Pages (to create a sub page, update the Parent Page field in Manage Pages). The title of each page is used as the menu text.

About the Dynamic Menus

These menus use CSS, so they don’t block search engine spiders from your website. We could have used Javascript, and while they are easier to make look pretty, compromising the accessibility of your website is not great. Making sure the menus look the same across many different browsers means there are a few constraints.

Ease of Use

While these menus are very flexible, they are also quite hard to setup. We have found they usually require a custom CSS rule or two to get them looking exactly the way you want. So if you aren’t willing to experiment a bit and possibly use some CSS, try using the Pages widget or the Custom Menu, or consider paying us to set them up for you.

We will try to make these menus easier to use over time.