Tout savoir sur WordPress
Tutoriel WordPress

Mettre des articles en avant avec les Sticky Posts

L’option des Sticky Posts de WordPress permet de mettre en avant des articles de façon simple et intuitive pour construire, par exemple, un carrousel.

Depuis la version 2.7 de WordPress, il est possible de « mettre en avant un article » en cochant la case du même libellé dans l’espace de rédaction d’un article (Publier > Visibilité). Si l’on coche cette case, l’article apparaitra automatiquement en premier sur la page d’accueil.

Activation d'un Sticky Post dans l'administration

L’option sticky_posts

Pour sauvegarder les articles mis en avant, WordPress insère leur ID dans l’option nommée sticky_posts. Ensuite, on récupère la liste des ID des articles mis en avant sous forme de tableau comme ci-dessous : 

$sticky = get_option('sticky_posts');

Récupérer que les articles mis en avant

Cette option est excellente pour mettre en place un système de carrousel de façon simple et intuitive sur votre site. En effet, il suffit de cocher la case « Mettre cet article en avant sur la page d’accueil » pour qu’un article soit insérer dans la loop configurée pour le carrousel.

Le code ci-dessous permet de configurer une loop qui récupère que les articles mis en avant :


$sticky = get_option('sticky_posts');
$args = array( 'post__in' => $sticky );
query_posts( $args );

Si aucun article n’est mis en avant, alors c’est la liste des derniers articles qui sera affichée.

Ne pas récupérer les articles mis en avant

A l’inverse, on peut avoir besoin d’afficher une liste d’articles qui contient aucun Sticky Posts. Pour cela, le code ci-dessous permet d’exclure de la loop tous les articles mis en avant :


$sticky = get_option('sticky_posts');
$args = array( 'post__not_in' => $sticky);
query_posts( $args );

Ignorer la mise en avant des Sticky Posts dans la loop

Par défaut, WordPress décide d’afficher en premier les Sticky Posts puis le reste des articles, mais ce n’est pas forcément le comportement que l’on souhaiterai à chaque fois.

Par exemple, on décide de se servir des Sticky Posts pour mettre en valeur certains articles avec du CSS. Dans ce cas précis, on ne voudrait pas subir le changement automatique de position dans la loop.

Pour cela, lors de la configuration de la loop, il faut utiliser la clé ignore_sticky_posts comme ci-dessous :


query_posts( array('ignore_sticky_posts' => 1) );

Sticky Posts pour les Custom Post Types

Par défaut, les Sticky Posts sont disponibles pour les articles, mais pas pour les Custom Post Types. Ils nécessitent l’utilisation de l’extension Sticky Custom Post Types pour bénéficier de cette fonctionnalité. Pour plus d’informations au sujet de l’extension : http://wordpress.org/extend/plugins/sticky-custom-post-types/

Une fois activé, le plugin ajoutera l’encart « Sticky » au Custom Post Type de votre choix.

Option des Sticky Posts pour les Custom Post Types

Vérifier si un article est un Sticky Post

Parmi la liste des Conditionals Tags de WordPress, il existe is_sticky() qui permet de vérifier si on a coché « Mettre cet article en avant sur la page d’accueil » dans l’espace de rédaction d’un article.

A savoir que cette fonction s’utilise aussi bien à l’intérieur qu’à l’extérieur de la loop WordPress.

Styliser les Sticky Posts

Afin de cibler les articles mis en avant avec du CSS, WordPress prévoit l’ajout de la class « sticky » via la fonction post_class() ou sticky_post(). La différence entre les deux est que post_class() ajoute d’autres class tandis que sticky_post() insère que la class « sticky ».

Voici un exemple d’utilisation avec la fonction sticky_post() :


<div <?php echo sticky_post(); ?>>
    <h2><?php the_title(); ?></h2>
</div>
Cet article a été mis à jour il y a 1470 jours - Il n'est peut être plus à jour !

Article écrit par Jonathan B.

Jonathan est le co-fondateur de WP Media, startup connue pour être l’auteur de WP Rocket et Imagify. Il est aussi co-organisateur du WordCamp Lyon et Paris.

21 Commentaires

Laisser un commentaire

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

  1. Excellent comme je le disais sur le site de Bruno précédemment (on va éviter de faire du duplicate content ;-))très instructif et très bien expliqué, comme d’hab’

    Bien vu Jonathan pour cet article, merci pour ton travail.

  2. Bonjour,
    J’ai lu sur le web pour mettre en avant il faut passer par sticky posts. Moi pour mon projet, j’ai un carousel, un slider, comment différencier les posts du carousel et ceux du slider, étant donné tous sont des sticky posts ?
    Merci d’avance…

    • Les sticky posts sont disponibles uniquement pour les articles. Donc si votre remarque concerne un Custom Post Type ou une page, cela est normal !

  3. merci mais je suis déjà allé sur le codex, la 1 ère chose que je fais quand je cherche une réponse, je vois pour exclure une catégorie, tous les articles d’une catégorie, retrieve je ne vois ce que cela veut dire, mon anglais est très pauvre, malgré ces codes, je ne vis pas comment récupérer juste les sticky post d’une catégorie.

  4. Merci pour ce post très instructif. Une question : connaissez-vous une technique pour exclure des Articles ou des articles appartenant à une Catégorie d’un module de type « Caroussel » ? (ie : je voudrais exclure les Posts de type Twitter de la home page de mon site)… Merci pour votre aide.

  5. bonjour,

    est ce possible qu’en haut de chaque catégorie d’un site d’avoir en sticky un article de chaque catégorie?
    En gros mettre en avant un article de chaque catégorie dans sa catégorie seulement.
    Merci

  6. Merci pour cet article, cela fait longtemps que je pense qu’il faudra que je télécharge une extension le jour où j’aurai besoin d’une telle fonctionnalité… et je tombe sur cette explication, claire, détaillée, facile.
    Un grand merci.

  7. Une petite question SVP :
    connectée en tant qu’admin, j’ai bien la possibilité de cocher « Mettre en avant ».
    Mais connectée avec un rôle perso (ajouté grâce au plugin Members), je n’ai plus l’option!

    Je ne m’y retrouve pas dans la liste complète des droits, est-ce que vous savez pourquoi je n’y ai pas accès avec mon « custom role » ?

    Merci

  8. Merci! C’est ce que j’ai fini par comprendre. Ça suit sa logique, mais ça m’embête pcq je voulais que les rédacteurs puissent mettre un article en avant, mais ne puissent pas modifier les articles des autres… Tant pis! Merci encore, pour la réponse et pour toute l’aide trouvée sur ce site! ;)