web-dev-qa-db-fra.com

Ajout de classe à l'image sélectionnée

J'ai spécifié une boucle pour afficher les images en vedette de mon type d'article personnalisé et je souhaite ajouter une classe img-responsive du bootstrap à mon image en vedette.

Comment puis-je faire ceci?

Merci!

Code:

<div class="home-featured-img">
    <?php 
    if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
        the_post_thumbnail(); // show featured image
    } 
    ?>
</div>
1
Damir

Vous pouvez ajouter une classe personnalisée pour publier des vignettes. the_post_thumbnail accepte un tableau d'attribut $attr dans lequel vous pouvez spécifier une classe d'image.

Donc, votre code sera.

<div class="home-featured-img">
    <?php
        if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
            the_post_thumbnail( 'full', array( 'class'  => 'responsive-class' ) ); // show featured image
        } 
    ?>
</div>

Dans le code ci-dessus, responsive-class est la classe personnalisée que j'ai ajoutée. Vous pouvez la modifier à votre guise.

2
Robert hue

Le deuxième argument de the_post_thumbnail est $attr, auquel vous pouvez ajouter des classes. Une note est que vous allez redéfinir les classes par défaut, vous devrez donc les ajouter également. La valeur par défaut est attachment-$size, c'est pourquoi j'ai ajouté attachment-post-thumbnail dans mon exemple.

the_post_thumbnail( 'post-thumbnail', array(
    'class' => 'attachment-post-thumbnail my-custom-class'
) );
1
Eric Holmes