WordPress : Mettez en surbrillance le lien de la page de blog statique dans l’en-tête

Publié par Jean-Michel le

J’ai créé une barre de navigation comme un système d’onglets pour mon en-tête et je peux tout mettre en surbrillance sauf mon bouton d’actualités sur cette page. L’actualité est une page statique pour l’ensemble de mon blog/article d’actualité.

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

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

Solution n°1 trouvée

J’ai trouvé la réponse par accident et je vais la transmettre à tous ceux qui voudront peut-être l’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; ?>

Ce qu’il fait, c’est que si le message est une page, il publiera le titre de la page parent, sinon il vous donnera le nom du titre de la page statique du blog. J’espère que cela aidera certaines personnes.

Un merci spécial à l’article DynamicWP !

Solution n°2 trouvée

Selon votre commentaire :

Because I wanted the freedom to customize the HTML and CSS of the menu. I didn’t want the generated html like: ul or li tags. Plus it gives me freedom to set up my links the way I want them. – blackbull77 20 hours ago

You can do all of that with the output from wp_nav_menu() (except for the generated <ul> and <li> tags of course – but then, those tags are semantically correct since you’re outputting a list). – Chip Bennett 19 hours ago

Could you show how I can go about this? – blackbull77 44 mins ago

  1. Output your list via wp_nav_menu(), referencing the theme_location, like so:

    <?php
    wp_nav_menu( array(
        'theme_location' => 'primary_nav'
    ) );
    ?>
    
  2. Target the .current-menu-item CSS class to style according to your needs

  3. For the default fallback menu, you can also target the .current_page_item CSS class.
  4. Pour styliser les éléments de menu parent/ancêtre, ciblez .current-menu-parent, .current-menu-ancestor, .current_page_parentet .current_page_ancestor.
  5. Pour ajouter vos propres classes CSS personnalisées, utilisez le nav_menu_css_classfiltre.

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *