web-dev-qa-db-fra.com

Comment ajouter une classe aux anciens de tags cloud?

Comment ajouter une classe CSS à ul et un élément d'ancrage de Tag Cloud généré par la fonction wp_tag_cloud?

Je veux que la classe par défaut pour ul de wp-tag-cloud soit tag-cloud et la balise d'ancrage aurait la classe btn btn-xs btn-primary.

<ul class="tag-cloud">
   <li><a class="btn btn-xs btn-primary" href="#">Apple</a></li>
   <li><a class="btn btn-xs btn-primary" href="#">Barcelona</a></li>
   <li><a class="btn btn-xs btn-primary" href="#">iPod</a></li>
</ul>
functionswidgets
4
Ashish

Les balises sont entourées d'un élément DIV dans la dernière version de WordPress le jour où j'écris cette réponse (4.7.5), et leur classe est tagcloud. Je passe donc à la prochaine question posée dans la question.

Les étiquettes peuvent être modifiées en utilisant le filtre wp_generate_tag_cloud. En écrivant un preg_replace, vous pouvez changer la classe comme vous le souhaitez. Voici un exemple:

add_filter('wp_generate_tag_cloud', 'my_tag_cloud',10,1);
function my_tag_cloud($string){
   return preg_replace('/class="tag-link-.+ tag-link-position-.+"/', 'class="btn btn-xs btn-primary"', $string);
}

Les ancres ont la classe tag-link-X tag-link-position-Y, X et Y étant des nombres.

3
Jack Johansson

Nous pouvons également modifier la classe CSS d'ancrage avec le wp_generate_tag_cloud_data filter (4.3+).

Avec ce filtre, nous pouvons modifier les données d'ancrage suivantes:

  • id
  • url
  • role
  • name
  • title (supprimé en 4.8)
  • slug
  • real_count
  • class
  • font_size
  • formatted_count (ajouté en 4.8)
  • aria_label (ajouté en 4.8)
  • show_count (ajouté en 4.8)

L'attribut style est codé en dur, comme le montre la version 4.8:

$a[] = sprintf(
    '<a href="%1$s"%2$s class="%3$s" style="font-size: %4$s;"%5$s>%6$s%7$s</a>',
      esc_url( $tag_data['url'] ),
      $tag_data['role'],
      esc_attr( $class ),
      esc_attr( str_replace( ',', '.', $tag_data['font_size'] ) . $args['unit'] ),
      $tag_data['aria_label'],
      esc_html( $tag_data['name'] ),
      $tag_data['show_count']
  );

Notez que nous pouvons changer la taille de la police unit avec:

wp_tag_cloud( [ 'unit' => 'rem', 'smallest' => 1, 'largest' => 4 ] );

ou par exemple avec le filtre widget_tag_cloud_args pour les widgets de nuage de tags.

Exemple:

Ici, nous ajoutons les classes btn btn-xs btn-primary aux ancres dans tous les nuages ​​de balises:

add_filter( 'wp_generate_tag_cloud_data', function( $tag_data )
{
    return array_map ( 
        function ( $item )
        {
            $item['class'] .= ' btn btn-xs btn-primary';
            return $item;
        }, 
        (array) $tag_data 
    );

} );
3
birgire

Les classes sont codées en dur dans la fonction wp_generate_tag_cloud(). Votre seule option est de modifier la sortie de chaîne finale via le filtre wp_generate_tag_cloud.

2
Rarst