We Eat Bricks :: Web Development Blog

Hello,
New improved version of the JQuery drop down menu now available.

It contains the extra features requested:

• Order the pages yourself by using the Page menu order feature.
• Put a link into into the menu for you blog.
• Works with javascript turned off.
• Make the the parent of a drop down menu clickable or not.
• Find out more at my original post.

Enjoy!

UPDATE: Comments fixed. I was getting a reporting a missing sql comments file. The problem and the solution providerd here fixed the issue. Thanks
http://www.dazecoop.co.uk/03-04-2007/wordpress-database-error-cant-open-file-wp_commentsmyi-errno-144

Hi all,
I’m afraid the commenting on this blog is not working at present.

In the meantime if you would like to contact me feel free to email me at weeatbricks@gmail.com

Thanks
Jamie

The wp_jquery_dropdownmenu plugin at a glance:

• Create a navigation menu with drop down menus for you Wordpress blog
• Slick JQuery animated sliding down for menus and fading out.
• Works with javascript turned off.
• Auto highlight of the current page you are are on.
• New features in v.02
• Add a link to your blog to the navigation menu.
• Arrange the order of the page to suit your needs.
• Parents pages can can be either links to pages or not if required.

I wrote this plugin to provide my wordpress blog with a navigation or menu that provides drop down menus or sub navigation menus where you need them.

This plugin uses the cross browser JQuery javascript framework for the sliding down menus and JQuery is installed with the plugin.

Each ‘Page’ of your wordpress blog becomes a link in the new navigation bar. Pages that are ‘children’ populate the drop menu of the parent ‘Page’.

For example. You might have a page titled About. You can then set or create pages such as contact us, team, location or whatever and set the parent of each of these pages to ‘About’.

In your new navigation menu hover over the ‘About’ link and a dropdown menu containing contact us, team, location appears.

I’ve tested this on Wordpress version 2.31 and above. It will not work on version 2.0.x as these version does not support the concept of parent and child pages.

Try out the Demo

Installation

Download wp_jquery_dropdownmenu plugin here

Simply unzip the wp_jquery_dropdownmenu.zip and copy the wp_jquery_dropdownmenu directory into your ./wp-content/plugins directory.

Login to the WordPress Admin Interface and enable the PlugIn in the PlugIn section.

Next put the tag below somewhere inside one of your wordpress template files.
That’s it.

Usage

Example:
Insert this somewhere into one of your templates, eg header.php

<?php
echo wp_jquery_dropdownmenu(2, “Blog”,1, 0);
?>

This is the default dropdown menu configuration. If you would like to learn about how you can alter your dropmenu further please read the following:

There are four settings to consider.

The first value(2 in the above example):
0 - does not put a link to you blog into the dropdown menu.
1 - Put a lnk to your blog on the left hand side of the dropdown menu.
2 - put a link to your blog in the right hand side of the navigation menu.

Second value (”blog” in the above example):
If you would like a lin to you blog to appear in your dropdown menu. Put the text here. In the above example “Blog” is used and will probably do for most people.

Third value (1 in the above example):
0 - pages will by sorted by their ID
1 - pages will be arranged accorded to their menu order. The menu order can be set in the pages section of your wordpress blog.

Fourth value (0 in the above example):
0 - if you would prefer the ‘parent’ of a dropdownmenu to be unavailable for clicking.
1 - if you would prefer the ‘parent’ of a dropdownmenu to to click to it’ page.

Further notes

You can style the css by editing the files styles.css in the plugins/wp_jquery_dropdownmenu folder

Comments, questions or suggestions most welcome!

Enjoy.