web-dev-qa-db-fra.com

Mettre en surbrillance le lien de page de blog statique

J'ai créé une barre de navigation comme un système d'onglets pour mon en-tête et je peux obtenir tout sauf mon bouton de news pour le mettre en surbrillance sur cette page. Les nouvelles sont une page statique pour l’ensemble de mon blog/article de nouvelles.

Je ne sais pas si c'est mon code, mais si quelqu'un a des idées, merci beaucoup.

<?php
$parent_title = get_the_title($post->post_parent);
?>

            <?php
                $items = wp_get_nav_menu_items("main-nav");
                foreach($items as $item): 
            ?>
            <a <?php  if($item->title == $parent_title){ echo 'class="active '.$parent_title.'"';}else{ echo 'class="'.$item->title.'"';} ?> href="<?php echo $item->url; ?>"><?php echo $item->title; ?></a>
            <?php endforeach; ?>
1
blackbull77

Par votre commentaire:

Parce que je voulais la liberté de personnaliser le code HTML et CSS du menu. Je ne voulais pas que le HTML généré ressemble à: balises ul ou li. De plus, cela me donne la liberté de configurer mes liens comme je le souhaite. - blackbull77 il y a 20 heures

Vous pouvez faire tout cela avec la sortie de wp_nav_menu() (à l'exception des balises générées <ul> et <li> bien sûr - mais ces balises sont sémantiquement correct puisque vous éditez une liste ). - Chip Bennett Il y a 19 heures

Pourriez-vous montrer comment je peux y arriver? - blackbull77 il y a 44 minutes

  1. Générez votre liste via wp_nav_menu() en vous référant au theme_location, comme suit:

    <?php
    wp_nav_menu( array(
        'theme_location' => 'primary_nav'
    ) );
    ?>
    
  2. Ciblez la classe CSS .current-menu-item pour styler selon vos besoins

  3. Pour le menu de secours par défaut, vous pouvez également cibler la classe CSS .current_page_item.
  4. Pour styliser les éléments de menu parent/ancêtre, ciblez .current-menu-parent, .current-menu-ancestor, .current_page_parent et .current_page_ancestor.
  5. Pour ajouter vos propres classes CSS personnalisées, utilisez le filtre nav_menu_css_class .
0
Chip Bennett

J'ai trouvé la réponse par accident et je vais la transmettre à quiconque voudra peut-être essayer.

Voici comment je l'ai fait:

<?php if ( is_page() ) {

        $parent_title = get_the_title($posts_page->post_title);
        echo $parent_title;    

 } else {

    $posts_page_id = get_option( 'page_for_posts');
    $posts_page = get_page( $posts_page_id);
    $posts_page_title = $posts_page->post_title;

    $parent_title = $posts_page_title;
    echo $parent_title; 

 } ?>

 <?php
     $items = wp_get_nav_menu_items("main-nav");
     foreach($items as $item): 
  ?>
        <a <?php  if($item->title == $parent_title){ echo 'class="active '.$item->title.'"';}else{ echo 'class="'.$item->title.'"';} ?> href="<?php echo $item->url; ?>"><?php echo $item->title; ?></a>
 <?php endforeach; ?>

Si le message est une page, il affiche le titre de la page parente, sinon vous obtiendrez le nom du titre de la page statique du blog. J'espère que cela aidera certaines personnes.

Merci à l'article de DynamicWP!

0
blackbull77