Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Expandable Page Hierarchy WordPress

  • SOLVED

Within my top-level of pages, I have a page of information about guitar effects pedals. As sub-pages, I have all of the manufacturers of effects pedals, and as sub-pages of each manufacturer, I have a page for each pedal containing information and links, etc.

So my page structure is roughly

Home
About
Effects Pedals
- Boss
- - Turbo Distortion
- - Metal Zone
- Ibanez
- - Echo/Delay
- - Tube Screamer
Contact
Gallery

Using the following code on the Effects Pedals page, I am able to output the hierarchy of child pages:

<?php
global $post;
$parent_id = get_pages("child_of=".$post->ID."&sort_column=menu_order&depth=1") ? $post->ID : $post->post_parent;
wp_list_pages('title_li=&child_of='.$parent_id.'&depth=3' );
?>


What I'd like to be able to do is use jQuery to collapse the UL of manufacturers and the UL of pedals that manufacturer makes and make them expand on click. So, I need to have a way of disabling the links to the manufacturer pages so that the ULs can be expanded by clicking - or another innovative way of doing this.

Answers (4)

2010-05-11

Edouard Duplessis answers:

wp_list_pages() and [[LINK href="http://jquery.bassistance.de/treeview/demo/"]]jquery treeview[[/LINK]]

2010-05-11

Oleg Butuzov answers:

i think yo need [[LINK href="http://www.webandblog.com/hacks/wordpress-drop-down-pages-menu-with-jquery-magic/"]]this[[/LINK]]. or [[LINK href="http://design-notes.info/tutorial/wordpress/accordion-menu/"]]this[[/LINK]], and one more [[LINK href="http://www.seoadsensethemes.com/wordpress-multi-level-drop-down-menu-using-jquery/"]]tutorial[[/LINK]] for the related question

2010-05-11

Erez S answers:

http://design-notes.info/tutorial/wordpress/accordion-menu/
Exactly what you are want to do


Erez S comments:

Also try this:
http://www.webspaceworks.com/resources/wordpress/30/
http://roshanbh.com.np/2008/06/accordion-menu-using-jquery.html


Erez S comments:

Sorry for the triple post,but here is plugin(!) for doing this:
http://wordpress.org/extend/plugins/collapsing-pages/screenshots/

2010-05-12

Ehthisham tk answers:

A better tuto with different demo can be found here.

[[LINK href="http://www.dynamicdrive.com/dynamicindex1/treeview/index.htm"]]http://www.dynamicdrive.com/dynamicindex1/treeview/index.htm[[/LINK]]