Générer un menu qui affiche les pages enfants en utilisant wp_list_pages () avec la nouvelle fonctionnalité de menu dans WordPress 3.0?

Question

Générer un menu qui affiche les pages enfants en utilisant wp_list_pages () avec la nouvelle fonctionnalité de menu dans WordPress 3.0?

- 10
- 14581 2010-08-18
Auparavant,je pouvais charger demanière sélective despagesenfantspour unepageparent actuellement sélectionnéeen utilisant une logiquetelle 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 { }

Ilne semblepas y avoir demoyennatif defaire celaen utilisant lanouvellefonctionnalité register_nav_menus ()/wp_nav_menu ().Quelqu'un sait-il commentje pourrais corriger celaensemble à ce stade?

Voici une capture d'écran de ce quej'essaie d'accomplir:
Previously, I was able to selectively load child pages for a currently-selected parent page using logic such as:

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 { }

There doesn't seem to be a native way to do this using the new register_nav_menus()/wp_nav_menu() functionality. Anyone know how I could patch this together at this point?

Here's a screenshot of what I'm trying to achieve:
menus

- C'est difficile,car wp_nav_menune concernepas la hiérarchie despages (ou despages dutout,d'ailleurs).Jene connaispas assez lesmenuspour y répondremaintenant,mais c'est une questiontrèsintéressante.
  
  This is tough, since wp_nav_menu doesn't relate to page hierarchy (or pages at all, for that matter). I don't know enough about menus to answer this now, but this is a very interesting question.
  - 0
  - 2010-08-18
  - John P Bloch
- Jene comprendspasentièrement la question.Qu'est-ce que vousessayez d'accomplir?Je vois le codemaisje ne comprendspas le contexte.Vous avez un site qui le souhaite?Une capture d'écran?
  
  I don't fully understand the question. What are you trying to accomplish? I see the code but I don't get the context. Got a site that does want? A screenshot?
  - 0
  - 2010-08-18
  - MikeSchinkel
- Il souhaite ajouter des élémentsenfants des éléments demenu deniveau supérieur demanière conditionnelle (c'est-à-dire uniquement si cette arborescenceest active) dans lanouvelle API dumenu denavigation.
  
  He wants to add child items of top level menu items conditionally (i.e. only if that tree structure is active) in the new nav menu api.
  - 0
  - 2010-08-18
  - John P Bloch
- @John P. Bloch - Que signifie * "seulement si l'arborescenceest active" *?Parlons-nous uniquement despages?Qu'enest-il desmessages,des catégories,desbalises,desmessagespersonnalisés,etc.?Veut-il lefaire sur le client viajQuery ou sur le serveur?Je suppose queje préfèrene pas supposeret j'aimeraisen savoirplus sur le cas d'utilisation réel.
  
  @John P. Bloch - What does *"only if the tree structure is active"* mean? Are we talking Pages only? What about Posts, Categories, Tags, Custom Posts, etc? Does he want to do it on the client via jQuery or in the server? I guess I'd rather not assume and I'd like to hear more about the actual use-case.
  - 0
  - 2010-08-18
  - MikeSchinkel
- @MikeSchinkel Dans ce casparticulier,je pense quenousne parlons que depages,mais celan'apas d'importance detoutefaçon;la solution seratoujours lamême.Jepense que ZaMoose veut que ce soitfait côté serveur.
  
  @MikeSchinkel In this particular case, I think we may be talking pages only, but that doesn't matter anyway; the solution will still be the same. I think ZaMoose wants it done server-side.
  - 0
  - 2010-08-18
  - John P Bloch
- @MikeSchinkel John a raison.Je veux charger despagesenfants (siellesexistent)pour lapageparent actuelle,puis afficher une listenon ordonnée desditsenfants.Essentiellement,celapermet un sous-menu contextuelpour lespages.
  
  @MikeSchinkel John is correct. I want to load child pages (if they exist) for the curent parent page and then output an unordered list of said children. Essentially this allows for a contextual submenu for pages.
  - 0
  - 2010-08-18
  - ZaMoose
- @ZaMoose: Désolé d'être si dense.Que voulez-vous dire "* charger lespagesenfants?" * Cela signifie-t-il lamême chose?* "Je veux sortir une listenon ordonnée depagesenfants si unepage a despagesenfants." * Et où voulez-vous les sortir?Dans le cadre d'unmenu déroulant ou ailleurs sur lapage?Je sais que c'estparfaitement clairpour vouset évidemmentpour John,maisilme manqueexactement ce que vous voulez.
  
  @ZaMoose: Sorry for being so dense. What do you mean "*load child pages?"* Does this mean the same? *"I want to output an unordered list of child pages if a page has child pages."* And where do you want to output them? As part of a drop down menu or somewhere else on the page? I know it's perfectly clear to you and evidently to John but I'm just missing exactly what you want.
  - 0
  - 2010-08-18
  - MikeSchinkel
- @MikeSchinkel: Cetteimage devraitillustrer ce queje fais. http://skitch.com/zamoose/d12rt/about-us-delta-sigma-theta-sorority-inc-south-jersey-alumnae-chapter
  
  @MikeSchinkel: This image should illustrate what I'm going for. http://skitch.com/zamoose/d12rt/about-us-delta-sigma-theta-sorority-inc-south-jersey-alumnae-chapter
  - 0
  - 2010-08-19
  - ZaMoose
- @ZaMoose - Parfait,merci (Mec,j'adore Skitch,n'est-cepas? :) Je vais éditer votremessagepourinclure votre capture d'écran.Cela dit,je vois que @jessegavin vous a répondumais celane fonctionnepas avec BuddyPress?Hmm,cen'étaitpas dans votre question ouj'aurais laissépasserparce queje ne suispasencore au courant de BuddyPress.
  
  @ZaMoose - Perfect, thanks (Dude, I just love Skitch, don't you? :) I'm going to edit your post to include your screenshot. That said, I see @jessegavin answered you but it doesn't work with BuddyPress? Hmm, that wasn't in your question or I would have let it pass by because I'm not up to speed on BuddyPress yet.
  - 0
  - 2010-08-19
  - MikeSchinkel
- @MikeSchinkel: Ouais,j'ai divisé lapartie BPen une question distincte.Je vaismarquer la réponse de @jessegavin commefaisant autorité.
  
  @MikeSchinkel: Yeah, I've broken the BP portion out into a separate question. I'm going to mark @jessegavin's answer as authoritative.
  - 0
  - 2010-08-19
  - ZaMoose
- Cool.Je vais supprimer le * "BuddyPress" * quej'ai ajouté dutitre.
  
  Cool. I'm going to remove the *"BuddyPress"* I added from the title.
  - 0
  - 2010-08-19
  - MikeSchinkel
- ... Et oui,Skitchesttout àfait l'atoutpour annoter les captures d'écran.*sourire*
  
  ...And yes, Skitch is quite the asset for annotating screenshots. *grin*
  - 0
  - 2010-08-19
  - ZaMoose

4 réponses

votes

- 2
- 2010-08-19
vouspouvezfaire un hack csspour lefaire (2façons quej'essaierais)

1 c'est lemoyen leplus simple auquelje puissepenserpour que le css affiche les éléments de la sous-navigation.

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

2en supposant que votrethèmeprenden charge les classes de corps,vouspouvez créer unmenu denavigationpour chaque "sous-nav",et les définirpour les afficher sous lanavigationprincipale -puis éditer votrefeuille de stylepourn'afficher que les div du sous-réseauen 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;}
you could do a css hack to do this (2 ways that I would try)

1 this is the easiest way I can think of do make the css display the items in the subnavigation.

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

2 assuming that your theme supports body classes you could create a nav menu for each "sub nav", and set them to display beneath the main navigation - then edit your stylesheet to only show the subnav div's using something like this:

.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;}

0

2017-07-11

 <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;
}

<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
- 2017-07-11
1 ceciest l'affichage PHP.

2 c'est l'affichage css.

1 this is the php display .

2 this is the css display .
- Publier des réponses sousforme de captures d'écran de codeest lepiremoyenpossible - veuillez rééditer votre réponse.Quelquesmots d'explicationne feraientpas demal également.
  
  Posting answers as code screenshots is the worst possible way - please reedit your answer. A few words of explanation wouldn't hurt also.
  - 0
  - 2017-07-11
  - Picard

jessegavin · Accepted Answer · 2010-08-18

9

2010-08-18

J'ai créé un widgetnommé Page Sub Navigation (intelligent queje connais) quifonctionnepourmoi.

Si vousinstallez ceci,vouspouvez simplementfaireglisser le widget vers l'une de vos zones de widgetet BAM celafonctionne.

 <?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 voulezjuste lespartiesjuteuses ...

 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" );
  }
}

MISE À JOUR

J'aitrouvé un autreplugin quifaitessentiellement lamême chose (etpeut-être lefaitmieux,je ne saispas). http://wordpress.org/extend/plugins/subpages-widget/

I created a Widget named Page Sub Navigation (clever I know) that is working for me.

If you install this, you can just drag the widget to one of your widget areas and BAM it works.

<?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");
?>

Or if you just want the juicy parts...

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" );
  }
}

UPDATE

I found another plugin that does essentially the same thing (and maybe does it better, I don't know). http://wordpress.org/extend/plugins/subpages-widget/

C'esttellementproche de ce dontj'aibesoin.Le seulproblèmeest qu'il se comportemal lorsque BuddyPressest actif.

This is SO, so close to what I need. The only problem is that it misbehaves when BuddyPress is active.
- 0
- 2010-08-19
- ZaMoose