web-dev-qa-db-fra.com

Changer ul class = "children" pour wp_list_pages?

Bonjour, j'utilise ce code pour imprimer une liste de pages et de sous-pages:

<ul>
<?php wp_list_pages('title_li=&depth=2&child_of='); ?>
</ul>

Il produit:

<ul>
    <li><a href="#">Page 1</a></li>
    <li><a href="#">Page 2</a>
        <ul class="children">
            <li><a href="#">Subpage 2a</a></li>
            <li><a href="#">Subpage 2b</a></li>
        </ul>
    </li>
    <li><a href="#">Page 3</a></li>
        <ul class="children">
            <li><a href="#">Subpage 3a</a></li>
            <li><a href="#">Subpage 3b</a></li>
        </ul>
    <li><a href="#">Page 4</a></li>
</ul>

Existe-t-il un moyen de remplacer le <ul class="children"> par autre chose dans functions.php? comme <div class="container"><div class="container2"><ul> et la fermeture à </ul></div></div>

Je vérifiais cet exemple mais je ne sais pas comment l'appliquer à mon cas ... Toute aide appréciée, merci!

functionswp-list-pages
1
Shirou June

Vous pouvez le remplacer en fournissant votre objet Walker lors de l'appel de wp_list_pages, comme ceci:

<votre-modèle> .php 

wp_list_pages(array(
    'title_li' => null,
    'depth' => 2,
    'child_of' => 0,
    'walker' => new My_Walker(),
));

À la place du Walker_Page par défaut, wp_list_pages utilisera votre walker personnalisé, My_Walker. La seule différence dont nous avons besoin ici est de regrouper toute votre liste dans les deux div que vous avez décrites dans votre question. Pour ce faire, nous devons remplacer les méthodes start_lvl et end_lvl de Walker_Page. Comme défini ci-dessous, la liste sera encapsulée dans deux divs lorsqu'elle sera au niveau 0 (le niveau le plus haut), tandis que les listes suivantes seront des éléments simples ul.

functions.php 

class My_Walker extends Walker_Page {

    function start_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);

        if ($depth == 0) {
            $output .= "\n$indent<div class='container'><div class='container2'><ul>\n";
        } else {
            $output .= "\n$indent<ul class='children'>\n";
        }
    }

    function end_lvl( &$output, $depth = 0, $args = array() ) {
        $indent = str_repeat("\t", $depth);

        if ($depth == 0) {
            $output .= "$indent</ul></div></div>\n";
        } else {
            $output .= "$indent</ul>\n";
        }
    }
}

Alternativement, comme décrit dans le lien que vous avez fourni, il suffit de remplacer la page_css_class et d’envelopper manuellement chaque appel de fonction avec vos divs:

functions.php 

function add_parent_class( $css_class = array(), $page = null, $depth = null, $args = array() )
{
    if ( ! empty( $args['has_children'] ) )
        $css_class = array();
    return $css_class;
}
add_filter( 'page_css_class', 'add_parent_class', 10, 4 );

<votre-modèle> .php 

<div class="container"><div class="container2"><ul>
<ul>
<?php wp_list_pages('title_li=&depth=2&child_of='); ?>
</ul>
</div></div>
3
Simon