Souhaitez-vous ajouter un bouton Charger plus de publications dans WordPress ? De nombreuses plates-formes populaires permettent aux utilisateurs de charger plus de messages lorsqu’ils atteignent le bas de la page. Dans cet article, nous allons vous montrer comment ajouter facilement un bouton Charger plus de publications dans WordPress.
Quand et pourquoi ajouter un bouton Charger plus de messages dans WordPress
Garder vos utilisateurs engagés avec le contenu vous aide à obtenir plus de vues et, finalement, plus d’abonnés.
De nombreux blogs utilisent le simple lien de navigation « Articles plus anciens » à la fin de leurs pages d’accueil, de blog et d’archives. Certains sites Web utilisent une navigation de page numérique qui ajoute plus de contexte.
Cependant, il existe certains types de sites Web qui peuvent bénéficier énormément du bouton de défilement infini ou de chargement de plus de messages. Voici quelques exemples : les sites Web de photographie, les listes et les sites Web à contenu viral.
Au lieu de charger une toute nouvelle page, le bouton « charger plus de messages » fonctionne comme un défilement infini. Il utilise JavaScript pour récupérer rapidement le prochain ensemble de contenu. Cela améliore l’expérience utilisateur et leur donne une chance de voir plus de votre contenu.
Cela étant dit, examinons comment ajouter facilement un bouton Charger plus de publications sur votre site WordPress.
Ajout du bouton Charger plus de messages dans WordPress
La première chose à faire est d’installer et d’activer le Ajax Charger plus brancher. Pour plus de détails, consultez notre guide étape par étape sur la façon d’installer un plugin WordPress.
Lors de l’activation, le plugin ajoutera un nouvel élément de menu intitulé « Ajax Load More » à votre menu d’administration WordPress. Vous devez cliquer dessus et vous rendre sur la page des paramètres du plugin.
Sur la page des paramètres, vous pouvez choisir la couleur de votre bouton. Vous pouvez également remplacer le bouton par un défilement infini qui charge automatiquement le prochain lot de publications sans que les utilisateurs ne cliquent sur le bouton.
Ensuite, vous devez visiter Ajax Charger plus » Modèle de répéteur page pour ajouter votre modèle d’affichage des articles.
Le plugin est livré avec un modèle de base contenant la boucle WordPress pour afficher les publications. Cependant, il ne correspond pas à votre thème et peut sembler déplacé sur votre site Web.
Pour résoudre ce problème, vous devez copier le code que votre thème utilise pour afficher les articles sur les pages d’index, d’archive et de blog.
Normalement, ce code se trouve dans le dossier template-parts de votre thème. Dans ce dossier, vous verrez des modèles pour afficher un contenu différent. Par exemple content-page.php, content-search.php, et plus encore.
Vous rechercherez le modèle générique content.php. Voici un exemple tiré du fichier content.php de notre thème de démonstration :
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php // Post thumbnail. twentyfifteen_post_thumbnail(); ?> <header class="entry-header"> <?php if ( is_single() ) : the_title( '<h1 class="entry-title">', '</h1>' ); else : the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); endif; ?> </header><!-- .entry-header --> <div class="entry-content"> <?php /* translators: %s: Name of current post */ the_content( sprintf( __( 'Continue reading %s', 'twentyfifteen' ), the_title( '<span class="screen-reader-text">', '</span>', false ) ) ); wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>', 'pagelink' => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%', 'separator' => '<span class="screen-reader-text">, </span>', ) ); ?> </div><!-- .entry-content --> <?php // Author bio. if ( is_single() && get_the_author_meta( 'description' ) ) : get_template_part( 'author-bio' ); endif; ?> <footer class="entry-footer"> <?php twentyfifteen_entry_meta(); ?> <?php edit_post_link( __( 'Edit', 'twentyfifteen' ), '<span class="edit-link">', '</span>' ); ?> </footer><!-- .entry-footer --> </article><!-- #post-## -->
Une fois que vous avez trouvé ce code, vous devez le coller dans le champ Modèles de répéteur dans les paramètres du plugin.
N’oubliez pas de cliquer sur le bouton « Enregistrer le modèle » pour enregistrer vos paramètres.
Ensuite, vous devez visiter Ajax Charger plus » Générateur de codes courts page pour générer le shortcode.
Cette page contient de nombreuses options différentes que vous pouvez personnaliser. Vous devez d’abord sélectionner le type de conteneur. Si vous n’êtes pas sûr, regardez simplement le modèle que vous avez copié plus tôt. La plupart des thèmes modernes utilisent le <div>; élément.
Après cela, faites défiler jusqu’à la section des étiquettes de bouton. Ici, vous pouvez modifier le texte qui apparaît sur le bouton. Par défaut, le plug-in utilise « Anciens messages », et vous pouvez le modifier en « Charger plus de messages » ou tout ce que vous voulez.
Enfin, vous devez choisir si vous souhaitez que les publications se chargent automatiquement ou attendre que les utilisateurs cliquent sur le bouton Charger plus de publications.
Votre shortcode est maintenant prêt à être utilisé. Dans la colonne de droite, vous verrez la sortie du shortcode. Allez-y, copiez le shortcode et collez-le dans un éditeur de texte car vous en aurez besoin à l’étape suivante.
Ajouter Charger plus de messages dans votre thème WordPress
Cette partie du didacticiel nécessite que vous ajoutiez du code dans vos fichiers de thème WordPress. Si vous ne l’avez pas encore fait, consultez notre guide sur la façon de copier et coller du code dans WordPress.
N’oubliez pas de sauvegarder votre thème WordPress avant d’apporter des modifications.
Vous devrez trouver les fichiers modèles dans lesquels vous souhaitez ajouter le bouton Charger plus de publications dans votre thème. Selon l’organisation de votre thème, ces fichiers sont généralement index.php, archives.php, categories.php, etc.
Vous devrez ajouter le shortcode que vous avez copié plus tôt dans votre thème juste après le endwhile; étiqueter.
Puisque nous ajoutons le shortcode dans un fichier de thème, nous devrons l’ajouter dans la fonction do_shortcode, comme ceci :
echo do_shortcode('[ajax_load_more container_type="div" post_type="post"]');
Vous pouvez maintenant enregistrer vos modifications et visiter votre site Web pour voir le bouton « Charger plus de messages » en action.
Nous espérons que cet article vous a aidé à apprendre comment ajouter un bouton Charger plus de messages dans WordPress. Vous pouvez également consulter notre méga liste des conseils, astuces et hacks WordPress les plus utiles pour les débutants.
