web-dev-qa-db-fra.com

Générer un menu qui affiche des pages enfants à l'aide de wp_list_pages () avec la fonctionnalité de nouveau menu de WordPress 3.0?

Auparavant, je pouvais charger de manière sélective des pages enfants pour une page parent actuellement sélectionnée en utilisant une logique telle que:

if(  $post->post_parent ) {
  $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
} else {
  $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
}

if ($children) { ?>
   <ul id="subnav">
     <?php echo $children; ?>
   </ul>
<?php 
} else {
}

Il ne semble pas y avoir de moyen natif de le faire en utilisant la nouvelle fonctionnalité register_nav_menus ()/wp_nav_menu (). Quelqu'un sait comment je pourrais corriger cela ensemble à ce stade?

Voici une capture d'écran de ce que j'essaie de réaliser:

Drop down Child menu screenshot

10
ZaMoose

J'ai créé un widget nommé Page Sub Navigation (intelligent je sais) qui fonctionne pour moi.

Si vous installez ceci, vous pouvez simplement faire glisser le widget dans l'une de ses zones etBAMcela fonctionne.

<?php
/*
Plugin Name: Page Sub Navigation
Plugin URI: http://codegavin.com/wordpress/sub-nav
Description: Displays a list of child pages for the current page
Author: Jesse Gavin
Version: 1
Author URI: http://codegavin.com
*/

function createPageSubMenu()
{
  if (is_page()) {
    global $wp_query;

    if( empty($wp_query->post->post_parent) ) {
      $parent = $wp_query->post->ID;
    } else {
      $parent = $wp_query->post->post_parent;
    }

    $title = get_the_title($parent);

    if(wp_list_pages("title_li=&child_of=$parent&echo=0" )) {
      echo "<div id='submenu'>";
      echo "<h3><span>$title</span></h3>";
      echo "<ul>";
      wp_list_pages("title_li=&child_of=$parent&echo=1" );
      echo "</ul>";
      echo "</div>";
    }
  }
}


function widget_pageSubNav($args) {
  extract($args);
  echo $before_widget;
  createPageSubMenu();
  echo $after_widget;
}

function pageSubMenu_init()
{
  wp_register_sidebar_widget("cg-sidebar-widget", __('Page Sub Navigation'), 'widget_pageSubNav');
}
add_action("plugins_loaded", "pageSubMenu_init");
?>

Ou si vous voulez juste les parties juteuses ...

if (is_page()) {
  global $wp_query;

  if( empty($wp_query->post->post_parent) ) {
    $parent = $wp_query->post->ID;
  } else {
    $parent = $wp_query->post->post_parent;
  }

  if(wp_list_pages("title_li=&child_of=$parent&echo=0" )) {
    wp_list_pages("title_li=&child_of=$parent&echo=1" );
  }
}

METTRE À JOUR

J'ai trouvé un autre plugin qui fait essentiellement la même chose (et peut-être mieux, je ne sais pas). http://wordpress.org/extend/plugins/subpages-widget/

9
jessegavin

vous pouvez faire un hack css pour le faire (2 façons que j'essaierais)

1 C’est la façon la plus simple de penser que css affichera les éléments de la sous-navigation.

.current-menu-ancestor ul {display:inline;}
.current-menu-parent ul (display:inline;}

En supposant que votre thème prenne en charge les classes de corps, vous pouvez créer un menu de navigation pour chaque "sous-navigateur" et les paramétrer pour qu'ils s'affichent sous la navigation principale - puis éditez votre feuille de style pour afficher uniquement le div de sous-marin en utilisant quelque chose comme ceci:

.child-menu-about, .child-menu-leadership {display:none;}
body.page-id-YOUR_ABOUT_PAGE_ID .child-menu-about {display:inline;}
body.category-YOUR-CATEGORY-SLUG  .child-menu-leadership {display:inline;}
3
rfair404
<nav class="site-nav children-link">
                <?php       

                    if(  $post->post_parent ) 
                    {
                      $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
                    } 
                    else 
                    {
                      $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
                    }

                    if ($children) { ?>
                       <ul>

                            <?php echo $children; ?>

                       </ul>

                    <?php 
                        } else {
                        }
                ?>
        </nav>

CSS

/*children-links links*/

.children-link 
{       

        background-color: #1a5957;
        color:#FFF;
        font-size: 100%;

}

.children-link li
{
    margin: 10px;   


}

.children-link ul li a:link,
.children-link ul li a:visited 
{
        padding: 15px 17px;
        text-decoration: none;
        border: 1px solid #1a5957;

}
.children-link ul li a:hover 
{
        background-color: #1a5957;
        color:#FFF;
        font-weight: bold;

}
.children-link .current_page_item a:link,
.children-link .current_page_item a:visited
{

    background-color: #1a5957;
    color: #FFF;
    cursor: default;
}
0
maulik

 enter image description here  1 c'est l'affichage php.

 enter image description here  2 c'est l'affichage css.

0
maulik