Wordpress submenu

Status
Niet open voor verdere reacties.

Baljuin

Gebruiker
Lid geworden
28 aug 2008
Berichten
50
Dag,

Ik loop me rot te zoeken, maar kom er niet uit. Ik heb hulp nodig van een Wordpress deskundige.

Het volgende wil ik verwezenlijken. Er is een hoofdmenu: menu a, menu b en menu c. Als ik bijvoorbeeld op menu b klik kom ik op een page. Die page bevat een submenu met de childpages van die page.

Zo dus:

hoofd menu: menu a | menu b | menu c

submenu:
sub 1
sub 2
sub 3

Die childpages hebben nog 1 level omlaag met childpages. sub 2 heeft bijvoorbeeld nog 2 childpages en dan is het klaar. Als ik op sub 2 klik ga je naar die page en ziet het submenu er zo uit:

sub 1
sub 2
sub sub 1
sub sub 2​
sub 2
sub 3

klik je dan op sub sub 1 dan ziet het er zo uit:
sub 1
sub 2
sub sub 1
sub sub 2​
sub 2
sub 3

Ik kom niet verder dan dat hij alle childs laat zien en als ik in het diepste level klik hij alleen nog maar die level laat zien. Heeft iemand misschien tips, of een stukje code die mij kan helpen?

Hoop dat ik niet te vaag ben :)
 
Vaag !? mwhah, dat is maar relatief .. Maar bij het eerste submenu was je me al kwijt, mischien dat je je vraagstelling wat kunt vereenvoudigen !? ;)

Maak zelf namelijk ook gebruik van Wordpress op 3 verschillende website's dus eruit komen zullen we wel, mits de bedoeling maar een beetje duidelijk is ;)
 
haha, het was al laat :)

Maar bedankt voor de aangeboden hulp.

Met wp_list_pages zet ik in de zijkant nu alle childpages neer van het hoofdmenu item waarop geklikt is. Maar deze childpages kunnen ook childs hebben. Wat ik wil is dat als je op 1 van deze childs klikt je alleen de childs van die page ziet. En dus niet van alle childpages.

Een voorbeeld om het te verduidelijk, want een plaatje zegt meer dan 1000 woorden:
voorbeeld.jpg


Dit is dus wat ik wil hebben.

Het oranje is altijd de kop van het hoofdmenu (die soms parent of ancestor is)
De actieve subpagina krijgt een current class en de actieve parent krijgt een current parent class voor dat pijltje. Daarnaast moet wordpress alleen de childs van de current parent laten zien.

Nu heb ik al iets gevonden wat ik de buurt komt, maar verder kom ik niet.

Ik had dit eerst. Een simpele vorm van wp_list_pages, maar dat werkt helemaal niet:
PHP:
<?php if($post->post_parent) {
  		$children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
		$parent_title = get_the_title($post->post_parent);
}
  else {
  $children = wp_list_pages("depth=1&title_li=&child_of=".$post->ID."&echo=0");
  $parent_title = get_the_title($post->ID);
  }
  if ($children) { ?>
  <div id="submenu"><span><?php echo $parent_title;?></span>
  <ul>
  <?php echo $children; ?>
  </ul>
  <?php } ?>
        </div>

En nu ben ik zover:
PHP:
<div id="submenu">
<?php // "Specific Child Menus" v1.01

/*	Author: Adam Meyer | www.apmeyer.com | @apmeyer on twitter

	Feel free to use this code in your wordpress templates.
	The purpose of this code is to generate a navigational menu
	that expands to only display child pages for the page being viewed
*/

// We're assigning this page's post ID to a new variable
// this just makes it a little more obvious later when we
// need to use this value
$thisPageID = $post->ID;

// The function below will be used to recursively build
// child menus for parent pages

// BEGIN FUNCTION getChildMenu()
function getChildMenu($parent) {

	// in the loop below we'll be relying on data outside the function
	// so we need to pull those global variables in
	global $wpdb;
	global $thisPageID;
	global $ancestors;

	// we'll be building a string throughout this function
	// the 'return' variable will contain that string
	$return = '';

	// query the posts table in the wordpress database
	// for published pages with the specified parent
	$querystr = "
	SELECT * FROM $wpdb->posts
	WHERE post_status = 'publish'
	AND post_type = 'page'
	AND post_parent = $parent
	ORDER BY menu_order";

	// get query results
		$pageposts = $wpdb->get_results($querystr, OBJECT);

	// if there are results let's make a menu!
	if ($pageposts) {

		$return = '<ul>';

		//loop through the query results to build our nested child menus
		foreach ($pageposts as $post):

			// wordpress function to prepare the posts...
			// basically it enables us to use certain tags/functions
			setup_postdata($post);
			$return .= '<li><a href="';
			$return .= get_permalink($post->ID);
			$return .= '">';
			$return .= get_the_title($post->ID);
			$return .= '</a>';

			// use the wp_list_pages function to determine whether or not this page has children
			$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");

			// if this list item represents the page being viewed
			// and the page has children, display them
			// OR
			// if this list item has a parent and this list item's
			// ID is a part of the current page's ancestor array, display the child menu
			if(($children && $post->ID == $thisPageID) || ($post->post_parent && in_array($post->ID, $ancestors)) ){
				$return .= getChildMenu($post->ID);
			}

			$return .= '</li>';

		endforeach;

		// and, we're done generating the string that contains our child menus
		$return .= '</ul>';

		//
		return $return;
	}
} // END FUNCTION getChildMenu()

// START Displaying Menu
// we'll be using the getChildMenu() function within this section of code
// to recursively generate child menus (if there are any) for these pages 

// YES this page has at least one parent
if ($post->post_parent){

	// Create an array containing ancestors of the current page
	$ancestors = get_post_ancestors($post->ID);
	// How many ancestors are there?
	$root = count($ancestors)-1;
	// specify the root parent (the eldest grandparent)
	$rootParent = $ancestors[$root];

	// query the posts table in the wordpress database
	// for published pages with the specified parent
	$querystr = "
	SELECT * FROM $wpdb->posts
	WHERE post_status = 'publish'
	AND post_type = 'page'
	AND post_parent = $rootParent
	ORDER BY menu_order";

	// get query results
		$pageposts = $wpdb->get_results($querystr, OBJECT);

	// if there are results, let's make a menu!
	if ($pageposts) {

		// alter the CSS here if you need to use a different class, or if you need to assign an ID
		echo '<ul>';

		// loop through the posts and display each child page as a list item
		foreach ($pageposts as $post):
			setup_postdata($post);

			//list top level parents
			echo '<li';
			// keep level 2 parent "selected" by adding CSS class
			if ($post->ID == $thisPageID || in_array($post->ID, $ancestors)){
			 	echo ' class="current_page_item"';
			}
			
			echo '><a href="';
			echo the_permalink();
			echo '">';
			echo get_the_title($post->ID);
			echo '</a>';

			// use the wp_list_pages function to determine whether or not this page has children
			$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");

			// if this list item represents the page being viewed
			// and the page has children, display them
			// OR
			// if this list item has a parent and this list item's ID is a
			// part of the current page's ancestor array, display the child menu
			if( ($children && $post->ID == $thisPageID) || ($post->post_parent && in_array($post->ID, $ancestors)) ){
				//display children as list
				echo getChildMenu($post->ID);
			}

			echo '</li>';

		endforeach;
	}

// NO this page does not have a parent
} else {

	// if we are at the absolute root level then no child menus should be displayed
	// so, it's easiest to just use the wordpress wp_list_pages function to display the menu
	echo '<ul>';
	wp_list_pages('title_li=&depth=1&sort_column=menu_order&child_of='.$thisPageID);
	echo '</ul>';

} // END Displaying Menu

?>
</div>
 
Oh en het gaat me trouwens alleen om het php script. met HTML en CSS kom ik er wel uit.:cool:
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan