web-dev-qa-db-fra.com

Mettez en surbrillance la balise actuelle dans wp_tag_cloud

Je suis en train de construire un site Web et l'une des pages sera un glossaire. La première page du glossaire affiche une liste de tous les mots, qui sont des types de publication personnalisés affectés à une taxonomie personnalisée appelée "lettre" qui extrait la première lettre du mot.

En plus du glossaire, il y a une "navigation" qui est un wp_tag_cloud de tous les letters (A-Z). L'utilisateur peut ensuite cliquer sur la lettre et la page affiche tous les mots commençant par cette lettre.

La question que je me pose est la suivante: s’il existe une possibilité, je peux ajouter un style current-tag à la balise actuellement affichée.

Mon code pour cela jusqu'à présent est la suivante:

  <!-- Glossary Search -->
  <div class="search-container">
    <div class="container">
      <div class="show-search col-lg-8 col-lg-offset-3">
       <form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
          <div class="letter-list row-fluid">  


           <!-- IMPORTANT --> <?php wp_tag_cloud( array( 'taxonomy' => 'letter', 'format' => 'flat', 'hide_empty' => false) ); ?>


            <input type="text" value="Search the Glossary" onblur="if (this.value == '') {this.value = 'Search the Glossary';}" onfocus="if (this.value == 'Search the Glossary') {this.value = '';}" name="s" id="glossarySearch" />
          </div>
      </form>
      </div> <!-- end shows-search -->
    </div> <!-- end container -->
  </div> <!-- end search-container -->

Merci beaucoup pour votre aide!

phpfunctionstags
1
Keyfer Mathewson

Lorsque vous êtes dans un modèle de balise, une classe de corps est ajoutée avec term- {termID}, de sorte que vous pouvez connecter "wp_generate_tag_cloud_data" pour vérifier si la classe est présente et ajouter une classe personnalisée à la balise;)

 function tribalpixel_tag_cloud_class_active($tags_data) {

        $body_class = get_body_class();

        foreach ($tags_data as $key => $tag) {
            if(in_array('term-'.$tag['id'], $body_class)) {
                $tags_data[$key]['class'] =  $tags_data[$key]['class'] ." active-tag";
            } 
        }
        return $tags_data;
    }

    add_filter('wp_generate_tag_cloud_data', 'tribalpixel_tag_cloud_class_active');

après cela, vous utilisez simplement CSS pour styler;)

4
Tribalpixel

Un rapide coup d'œil au nuage de balises source ne prend pas en compte la balise actuelle et n'est pas facile à modifier pour l'implémenter dans le code. Cependant, la classe de sortie qui inclut les balises ID - class='tag-link-$tag_id' est utilisée.

Ce que vous pouvez faire est d’accroche dans wp_head, de vérifier si vous êtes dans une archive de balises et de générer un petit bloc CSS en ligne qui donne un style à l’élément correspondant à l’ID actuel, selon les besoins.

3
Rarst