Vous souhaitez afficher une liste de publications liées sur votre site WordPress et préférez utiliser du code plutôt qu’un plugin ?
Lorsque les visiteurs de votre blog ont fini de lire un article qui les intéresse, proposer une liste de publications connexes les maintiendra engagés et les aidera à trouver du nouveau contenu à lire.
Dans cet article, nous allons vous montrer comment afficher des articles liés avec WordPress à l’aide de code, sans plugin requis.
Pourquoi afficher les pages associées dans WordPress ?
Lorsque votre blog WordPress commence à se développer, il peut devenir plus difficile pour les utilisateurs de trouver d’autres articles sur le même sujet.
L’affichage d’une liste de contenu connexe à la fin de chaque article de blog est un excellent moyen de garder vos visiteurs sur votre site Web et d’augmenter le nombre de pages vues. Il aide également à améliorer la visibilité de vos pages les plus importantes en affichant votre meilleur contenu là où les gens peuvent le trouver facilement.
Si vous n’êtes pas familier avec le code, vous trouverez plus simple de choisir l’un des nombreux plugins de publication liés à WordPress qui peuvent afficher des publications liées sans code.
Mais si vous vous êtes déjà demandé si vous pouviez afficher des publications associées sans utiliser de plugin, nous partagerons deux algorithmes différents que vous pouvez utiliser pour générer des publications associées avec des vignettes en utilisant uniquement du code :
- Méthode 1 : Comment afficher les articles liés dans WordPress par balises
- Méthode 2 : Comment afficher les articles liés dans WordPress par catégorie
Noter: Si vous souhaitez afficher une vignette avec chaque publication associée, assurez-vous d’abord d’ajouter une image en vedette à ces publications.
Méthode 1 : Comment afficher les articles liés dans WordPress par balises
Un moyen efficace de localiser le contenu associé consiste à rechercher d’autres publications partageant les mêmes balises. Les balises sont souvent utilisées pour se concentrer sur les détails spécifiques contenus dans un message.
Dans cet esprit, vous souhaiterez peut-être aller de l’avant et ajouter des balises communes aux publications que vous souhaitez associer les unes aux autres. Vous pouvez les saisir dans la case ‘Tags’ de l’éditeur WordPress.
Après avoir ajouté des balises à vos publications, la prochaine chose à faire est d’ajouter l’extrait de code suivant à votre thème single.php
modèle. Si vous avez besoin d’aide pour ajouter du code à votre site, consultez notre guide sur la façon d’ajouter du code personnalisé dans WordPress.
$orig_post = $post; global $post; $tags = wp_get_post_tags($post->ID); if ($tags) { $tag_ids = array(); foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id; $args=array( 'tag__in' => $tag_ids, 'post__not_in' => array($post->ID), 'posts_per_page'=>5, // Number of related posts that will be shown. 'ignore_sticky_posts'=>1 ); $my_query = new wp_query( $args ); if( $my_query->have_posts() ) { echo '<div id="relatedposts"><h3>Related Posts</h3><ul>'; while( $my_query->have_posts() ) { $my_query->the_post(); ?> <li><div class="relatedthumb"><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_post_thumbnail(); ?--></a></div> <div class="relatedcontent"> <h3><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_title(); ?--></a></h3> <!--?php the_time('M j, Y') ?--> </div> </li> <!--?php } echo '</ul--></ul></div>'; } } $post = $orig_post; wp_reset_query();
Ce code recherche les balises associées à une page, puis exécute une requête de base de données pour récupérer les pages avec des balises similaires.
Où placer le code ? Cela dépend de votre thème, mais dans la plupart des cas, vous devriez pouvoir coller le code dans votre thème unique.php modèle après le message principal et juste au-dessus de la section des commentaires.
Si vous utilisez le thème Twenty Twenty-One comme nous le sommes sur notre site de démonstration, alors un bon endroit pour coller le code est dans le template-parts/content/content-single.php
fichier après l’en-tête et juste après <?php the_content();
.
Cela affichera automatiquement le contenu associé sur n’importe quel article WordPress. Vous devrez modifier le style et l’apparence de vos publications connexes pour qu’elles correspondent à votre thème en ajoutant du CSS personnalisé.
Méthode 2 : Comment afficher les articles liés dans WordPress par catégorie
Une autre façon d’afficher le contenu associé consiste à répertorier les publications appartenant à la même catégorie. L’avantage de cette méthode est que la liste des articles liés ne sera presque jamais vide.
Comme la méthode 1, vous devez ajouter un extrait de code à votre thème unique.php modèle. Pour plus de détails, reportez-vous à la méthode 1 et à notre guide sur la façon d’ajouter du code personnalisé dans WordPress.
$orig_post = $post; global $post; $categories = get_the_category($post->ID); if ($categories) { $category_ids = array(); foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id; $args=array( 'category__in' => $category_ids, 'post__not_in' => array($post->ID), 'posts_per_page'=> 2, // Number of related posts that will be shown. 'ignore_sticky_posts'=>1 ); $my_query = new wp_query( $args ); if( $my_query->have_posts() ) { echo '<div id="related_posts"><h3>Related Posts</h3><ul>'; while( $my_query->have_posts() ) { $my_query->the_post();?> <li><div class="relatedthumb"><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_post_thumbnail(); ?--></a></div> <div class="relatedcontent"> <h3><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><!--?php the_title(); ?--></a></h3> <!--?php the_time('M j, Y') ?--> </div> </li> <!--?php } echo '</ul--></ul></div>'; } } $post = $orig_post; wp_reset_query();
Maintenant, vous verrez une liste de contenu connexe au bas de chaque article.
Si vous souhaitez modifier le style et l’apparence de vos pages associées, vous devrez ajouter un CSS personnalisé pour correspondre à votre thème.
Nous espérons que ce didacticiel vous a aidé à apprendre à afficher des articles liés avec des vignettes dans WordPress sans plugins.
Vous voudrez peut-être également apprendre à suivre les visiteurs de votre site WordPress ou consulter notre liste de 24 conseils pour accélérer votre site Web.