Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coupe WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Comment personnaliser les extraits WordPress (Aucun codage nécessaire)

Note éditoriale : Nous percevons une commission sur les liens des partenaires sur WPBeginner. Les commissions n'affectent pas les opinions ou les évaluations de nos rédacteurs. En savoir plus sur Processus éditorial.

Vous souhaitez personnaliser votre extrait WordPress ?

Un extrait est une courte partie de votre publication que vous pouvez afficher dans une liste d’articles de blog ou sur d ‘autres pages clés de votre site.

Dans cet article, nous allons vous afficher comment personnaliser vos extraits WordPress sans écrire de code.

Customizing WordPress excerpts without coding

Tutoriel vidéo

Subscribe to WPBeginner

Si vous préférez les instructions écrites, continuez à lire.

Quand et pourquoi utiliser des extraits sur WordPress ?

Tout d’abord, voyons dans quelles circonstances il est judicieux d’utiliser des extraits et pourquoi il est judicieux de le faire.

Par défaut, WordPress affiche les publications complètes sur la page d’accueil, la page du blog et les archives de votre site.

Cela rend votre site WordPress plus lent, et cela peut également causer des problèmes avec les moteurs de recherche parce que cela signifie que vous aurez du contenu dupliqué sur votre site.

L’utilisation d’extraits accélère le chargement de vos pages, car vous chargez uniquement une petite partie de chaque article. Vous pouvez utiliser des extraits sur :

  • La page d’accueil de votre site, s’il affiche des publications de blog.
  • Vos différentes pages d’archives pour les catégories et les identifiés.
  • La page de publication de votre blog, si vous avez une page d’accueil statique.

De nombreux thèmes WordPress sont configurés pour utiliser des extraits par défaut dans des endroits tels que votre page d’accueil. Avec les thèmes WordPress premium, vous pouvez avoir l’option de choisir si vous voulez afficher des publications complètes ou des extraits.

Pour plus de détails, consultez notre article sur les publications complètes par rapport aux extraits pour plus de raisons d’utiliser des extraits.

Pourquoi personnaliser vos extraits ?

Si votre thème par défaut utilise des extraits, WordPress génère automatiquement un extrait pour vous. Par défaut, WordPress utilise les 55 premiers mots de votre publication, bien que de nombreux thèmes en affichent un peu plus.

Qu’y a-t-il de mal à cela ? Ne pouvez-vous pas simplement enregistrer du temps en laissant WordPress rédiger l’extrait pour vous ?

Voici le problème. L’extrait généré automatiquement commencera par le texte qui se trouve au début de votre publication. Cela peut convenir dans certains cas, mais cela ne fonctionne pas si bien si vous avez quoi que ce soit avant l’ introduction de votre publication.

Voici un exemple tiré d’un site utilisant le thème Ribosome :

A post excerpt shown in the Maxwell theme. Post text reads 'Image credit: 200degrees This post was last updated in April 2020. What's the best way to build your email list? We've come up with 35 great options for you. Whether...''

Comme vous pouvez le constater, l’extrait affiche le texte du tout début de la publication. Ce texte inclut le crédit de l’image mise en avant, ainsi qu’une Note indiquant la date de la dernière mise à jour de la publication. Cela n’a pas l’air très bon.

Si votre thème ne gère pas très bien les extraits, vous pouvez les personnaliser pour les rendre plus faciles à lire et vous aider à obtenir plus de clics pour les publications.

Ceci étant dit, voyons les différentes façons de personnaliser les extraits dans WordPress. Vous pouvez utiliser les liens sur ce lien pour passer à la méthode de votre choix :

1. Comment ajouter un extrait personnalisé dans WordPress (par défaut)

Ajouter un extrait personnalisé dans WordPress est assez simple. Tout d’abord, vous devez créer une nouvelle publication ou modifier une publication existante.

Dans le panneau de droite de l’éditeur de contenu WordPress, vous devriez voir le menu déroulant  » Extrait « . Cliquez sur la flèche vers le bas située à côté.

Excerpt panel in post editor

Il se dépliera pour afficher l’encadré de l’extrait.

Vous pouvez saisir votre extrait de publication personnalisé ici. Nous avons simplement copié le premier paragraphe de notre publication.

Add excerpt

Note : Si vous utilisez encore l’ancien éditeur classique, vous devez cliquer sur l’onglet « Options d’écran » dans le coin supérieur droit. Cochez ensuite la case « Extrait ». Vous verrez maintenant un espace pour votre extrait sous la case où vous écrivez votre publication.

Votre thème WordPress utilisera désormais l’extrait personnalisé pour cette publication.

Preview of a custom excerpt added to a WordPress post

Comme vous pouvez le constater, le lien Lire la suite ne s’affiche pas après l’extrait. Selon le thème que vous utilisez, il se peut que les extraits personnalisés n’aient pas ce lien.

Le lecteur peut toujours cliquer sur le titre de l’article ou sur l ‘image mise en avant pour lire l’intégralité de votre publication.

2. Modifié la longueur de l’extrait

Si vous souhaitez modifier la longueur des extraits sur votre site, vous pouvez utiliser l’extension gratuite WPCode. Il s’agit uniquement du moyen le plus simple et le plus sûr d’ajouter du code personnalisé à votre site, mais il est également livré avec une grande bibliothèque d’extraits de code préconfigurés.

Nous utiliserons aujourd’hui l’un de ces extraits intégrés.

Pour commencer, vous devez installer et activer WPCode. Pour plus de détails, vous pouvez consulter notre guide étape par étape sur l’installation d’une extension WordPress.

Une fois activé, vous pouvez aller dans  » Code Snippets «  Add Snippet dans votre panneau d’administration WordPress et rechercher  » extrait « .

Survolez le résultat intitulé « Modifier la longueur de l’extrait » et cliquez sur le bouton « Utiliser l’extrait ».

Searching WPCode for the snippet keyword

L’extension insère alors l’extrait de code suivant pour vous :

add_filter(
	'excerpt_length',
	function ( $length ) {
		// Number of words to display in the excerpt.
		return 40;
	},
	500
);

Ensuite, vous verrez l’écran « Modifier l’extrait ». WPCode a déjà pré-configuré tous les Réglages pour vous.

Par défaut, cet extrait limitera l’extrait à 40 mots. Vous pouvez ajuster le chiffre de la ligne 5 en fonction de ce qui convient le mieux à votre blog WordPress.

WPCode changing the number of words in an excerpt and activating a snippet

Une fois que vous avez défini la longueur de l’extrait que vous souhaitez, il vous suffit de permuter le commutateur sur « Actif » et de cliquer sur le bouton « Mettre à jour ».

Désormais, lorsque vous visiterez votre site, les extraits raccourcis se trouveront à l’endroit où votre thème les affiche.

Voici un exemple de ce que cela donnerait en utilisant le thème Twenty Twenty-Two et en définissant l’extrait WPCode pour afficher 5 mots.

Example of the trimmed snippet in WordPress

Note : l’extrait de WPCode fonctionne uniquement avec les extraits par défaut générés par WordPress.

Modifier la longueur des extraits personnalisés

Si vous souhaitez modifier la longueur des extraits personnalisés, vous devrez ajouter un extrait personnalisé distinct dans WPCode. Il est très facile de copier et de coller des extraits de code dans WordPress, et comme nous utilisons WPCode, les étapes sont en grande partie les mêmes que celles décrites ci-dessus.

Tout d’abord, naviguez vers Extraits de code «  Ajouter un extrait. Survolez la rubrique  » Ajouter un module personnalisé (nouvel extrait)  » et cliquez sur le bouton  » Utiliser l’extrait « .

WPCode Add new Snippet

La page « Créer un extrait personnalisé » s’affiche ensuite.

Vous devez maintenant donner un titre à votre nouvel extrait et coller le code suivant dans le champ « Prévisualisation du code » :

add_filter( 'get_the_excerpt', function( $excerpt, $post ) {
	
	$excerpt_length = 40; // Change excerpt length 
	$excerpt_more   = '...<br><br><a href="' . get_permalink($post->ID) . '">Read More »</a>'; // Add ellipsis and 'Read More' permalink text when trimmed
	
    if ( has_excerpt( $post ) ) {
        $excerpt = wp_trim_words( $excerpt, $excerpt_length, $excerpt_more );
    }
	
    return $excerpt;
	
}, 10, 2 );

Vous pouvez modifier la valeur de $excerpt_length à la ligne 3 pour choisir le nombre de mots de votre extrait personnalisé.

En outre, la modification du texte mis en évidence ci-dessous à la ligne 4 entraînera la modification du texte d’ancrage du lien « Lire la suite » lorsque l’extrait sera découpé.

WPCode edit custom excerpt length and activate it

Lorsque vous avez personnalisé l’extrait en fonction de vos besoins, assurez-vous que le « Type de code » est défini sur « Extrait PHP ».

Vous pouvez ensuite permuter le commutateur sur « Actif » et cliquer sur le bouton « Enregistrer l’extrait ».

Désormais, lorsque vous visiterez votre site, vous verrez que vos extraits personnalisés sont raccourcis à la longueur que vous avez choisie à la ligne 3.

3. Modifié Lire la suite pour les extraits

Outre l’extrait ci-dessus, vous pouvez également utiliser la bibliothèque d’extraits WPCode pour modifier le texte « Lire la suite » qui apparaît avec les extraits dans la plupart des thèmes.

Il suffit d’installer et d’activer l’extension gratuite WPCode. En savoir plus, vous pouvez suivre notre guide étape par étape sur l’installation d’une extension WordPress.

Une fois activé, vous pouvez aller dans Code Snippets  » Add Snippet dans votre panneau d’administration. De là, il vous suffit de rechercher « extrait » et de survoler avec votre souris le résultat intitulé « Modifier le texte de lecture pour les extraits ».

Search for a WPCode snippet by name

Vous pouvez cliquer sur le bouton « Utiliser l’extrait » pour accéder à la page « Modifier l’extrait ». WPCode a déjà préconfiguré l’extrait de code pour vous et, par défaut, il est défini sur « Lire toute la publication ».

Cependant, vous pouvez remplacer le texte de la ligne 4 par ce que vous voulez.

WPCode on the edit snippet page to change the read more text for an excerpt

Lorsque vous êtes satisfait de votre nouveau texte, il vous suffit de permuter le commutateur sur « Actif » et de cliquer sur le bouton « Mettre à jour ».

4. Affichage d’extraits dans votre thème

La plupart des thèmes WordPress populaires sont dotés d’un support intégré permettant d’afficher des extraits personnalisés sur vos publications.

Cependant, certains thèmes peuvent ne pas avoir de support pour les extraits. Si c’est le cas du vôtre, alors vous devrez modifier manuellement les modèles de votre thème.

Ajout d’un extrait de publication dans les thèmes en bloc

Si vous utilisez un thème en bloc, vous pouvez vous rendre sur la page Apparence  » Éditeur pour modifier votre thème dans l’Éditeur du site.

L’éditeur/éditrices du site s’ouvre alors. Cliquez sur le Modèle que vous souhaitez modifier dans la colonne latérale gauche ou pointez simplement la zone où vos publications sont affichées.

Site editor

L’éditeur du site complet peut afficher vos dernières publications à l’aide du bloc Boucle de requête, qui est le moyen standard d’afficher une liste de publications.

Après avoir ajouté le bloc de la boucle de requête, vous devez cliquer sur le bouton « Choisissez » pour sélectionner une composition.

Query loop block

WordPress inclut plusieurs Mises en page comme compositions pour la boucle de requête, vous pouvez choisir entre une grille, un tableau, une liste, et plus encore.

Le Modèle de publication généré affichera désormais automatiquement l’extrait de votre publication.

Excerpt block

Toutefois, la seule chose que vous pouvez modifier ici est le texte « Lire la suite ».

Ajout d’un extrait de publication dans les thèmes classiques

Si vous utilisez un thème classique, vous pouvez ajouter un extrait de publication en créant un thème enfant et en ajoutant du code.

Cela ajoute une certaine complexité au processus, et si vous n’êtes pas à l’aise avec cela, alors vous pouvez utiliser la méthode 3 de cet article, qui ne nécessite pas d’ajouter de code.

Dans votre thème enfant, vous aurez besoin du Modèle utilisé pour afficher les pages que vous souhaitez modifier. Consultez notre guide sur la hiérarchie des modèles WordPress pour savoir quel modèle vous devez modifier.

Les noms de fichiers diffèrent légèrement en fonction de votre thème, mais vous recherchez probablement home.php, content.php, archive.php et category.php.

Dans chacun de ces fichiers, vous devrez trouver cette ligne :

<?php the_content() ; ?>

Ensuite, vous devrez le remplacer par l’identifié_excerpt comme ceci :

<?php the_excerpt() ; ?>

Important : nous ne recommandons pas cette méthode aux débutants. Même si vous êtes assez expérimenté avec WordPress, vous voudrez peut-être éviter de créer un thème enfant et de modifier vos fichiers de modèles.

Les deux méthodes suivantes sont d’excellentes alternatives.

5. Afficher le début de vos publications avec l’identifiant More

Une autre façon de créer une version courte de votre publication pour votre page d’accueil WordPress et vos pages d’archives est d’utiliser l’identifié « More ».

Cette balise fonctionne un peu différemment d’un extrait. Au lieu de créer un extrait uniquement textuel de votre publication, l’identifié More vous permet d’interrompre votre publication à un certain moment.

Cela signifie que seule la première partie de votre publication (jusqu’à l’identifiant) s’affichera dans la liste des publications sur votre page d’accueil, la page des catégories, etc. L’avantage de l’identifiant More est qu’il conserve toute la mise en forme.

À l’endroit où vous placez l’identifiant More, WordPress affiche un lien « Lire la suite ». Les Lecteurs peuvent cliquer sur ce lien pour accéder à l’intégralité de votre publication. Ils seront automatiquement renvoyés au bon endroit dans la publication.

Pour créer un identifiant More, créez une nouvelle publication ou modifiez une publication existante.

Ensuite, vous devez ajouter un bloc à l’endroit où vous souhaitez que l’identifiant Plus soit placé. Sélectionnez le bloc Plus dans la section Options de mise en page ou recherchez-le à l’aide de la barre de recherche.

Adding the More block

C’est ainsi que l’identifiant More apparaîtra dans l’éditeur de contenu.

De manière facultative, vous pouvez choisir de masquer le contenu précédant l’identifiant More sur la publication proprement dite.

More tag in content editor

Note : Vous pouvez également ajouter un identifiant More dans l’ancien éditeur classique. Cliquez à l’endroit où vous souhaitez placer l’identifiant dans votre publication, puis cliquez sur le bouton Plus dans la barre d’outils visuelle.

Pratiquement tous les thèmes pourront utiliser l’identifiant More partout où les publications sont affichées. Note : si votre thème affiche des extraits, vous devrez personnaliser l’extrait lui-même. Vous ne pouvez pas le modifier en ajoutant un identifiant More aux publications.

6. Ajouter des extraits WordPress personnalisés à l’aide d’une extension

Que faire si la fonctionnalité d’extraits personnalisés intégrée à WordPress ne donne pas les résultats escomptés … et que vous ne souhaitez pas non plus utiliser l’identifié More ?

Il existe une solution simple. Vous pouvez utiliser une extension pour créer et afficher des extraits personnalisés.

Tout d’abord, vous devez installer et activer le plugin Advanced Excerpt.

Si vous n’avez jamais installé d’extension auparavant, consultez nos instructions étape par étape sur l’installation d’un plugin WordPress.

Une fois que vous l’avez activé, vous pouvez aller dans Réglages  » Extrait pour configurer son fonctionnement.

Advanced excerpt settings

Ici, vous pouvez modifier des éléments tels que le nombre de caractères ou de mots que l’extrait affichera. Vous pouvez également permettre à l’extrait de s’interrompre au milieu d’un mot ou d’une phrase.

Vous pouvez également rétablir le lien « Lire la suite » qui disparaît normalement de l’extrait personnalisé. Vous pouvez même modifier ce lien avec le texte de votre choix et changer son fonctionnement :

Restoring and customizing the 'Read More' link using the Advanced Excerpt plugin

Astuce : Pour utiliser des extraits personnalisés avec cette extension, décochez la case ‘Générer des extraits même si une publication a un extrait personnalisé joint.’

Il se présente comme suit.

Use custom excerpts with the Advanced Excerpt plugin

Après avoir apporté des modifications aux Réglages avancés des extraits, veillez à cliquer sur le bouton « Enregistrer » en bas de l’écran.

Avec l’extension Advanced Excerpt, vos extraits conserveront le format de votre publication. Voici un extrait généré automatiquement avec l’extension activée.

Comme vous pouvez le constater, le retour à la ligne et le texte en italique ont été conservés.

Post excerpt produced by Advanced Excerpt plugin

Par défaut, l’extension Advanced Excerpt utilise des extraits sur votre page d’accueil, votre flux RSS et d’autres pages d’archives.

Il n’apporte aucune modification à votre contenu, et si vous souhaitez l’inactiver, alors vous pouvez simplement désactiver l’extension.

Nous espérons que cet article vous a aidé à personnaliser facilement des extraits WordPress sans aucun codage. Vous aimerez peut-être aussi notre liste des extensions que tout site d’entreprise doit avoir ou notre guide sur la façon d’obtenir un certificat SSL pour votre site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Divulgation : Notre contenu est soutenu par les lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Consultez comment WPBeginner est financé, pourquoi cela compte et comment vous pouvez nous soutenir. Voici notre processus éditorial.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

L'ultime WordPress Toolkit

Accédez GRATUITEMENT à notre boîte à outils - une collection de produits et de ressources liés à WordPress que tous les professionnels devraient avoir !

Reader Interactions

41 commentairesLaisser une réponse

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

    • WPBeginner Support says

      If you wanted a custom length for a specific post or page then you would want to manually set the excerpt in the post/page itself.

      Administrateur

  2. Marie-Christine says

    Hello,
    in code editor is there a way to display the Excerpt tab in the main window instead of in the side bar?

    • WPBeginner Support says

      We do not have a method we would recommend at the moment to force it into the main editing area.

      Administrateur

  3. Raihan says

    I’m facing a big problem. The excerpt is showing perfectly in desktop and tab responsive mode on the post. But the main issue is, it is not showing up in mobile responsive mode. What should I do…..?

    • WPBeginner Support says

      It would depend on the specific theme you are using as each theme has different styling but if you reach out to your theme’s support they can normally assist with the mobile styling.

      Administrateur

  4. Edwin says

    So I’m having an issue where anything I write in the excerpt box DOES NOT display verbatim but only display the first 40 characters or whatever from the content summary. What am I doing wrong here?

    • WPBeginner Support says

      You would want to check with your theme’s support as it sounds like a design for your specific theme.

      Administrateur

  5. Roni Lion says

    I may have missed it, but what I was looking for and did not find is how it looks to the user. A user sees a web page or post, sees the excerpts, clicks the more button–where and how does it display? It’d be meaningful to include in this post — unless you already did and I missed it!

    • WPBeginner Support says

      The display would heavily depend on your specific theme, as each are different we can’t say how your specific theme will display the excerpts

      Administrateur

    • WPBeginner Support says

      If you reach out to the plugin’s support they should be able to assist you with a conflict like that.

      Administrateur

  6. Márcio says

    The new versions of the post editor hides the « add more tag » button.
    The way I found to solve the problem was installing the classic editor plugin.

    • WPBeginner Support says

      For adding it in Gutenberg, you can use the more block or the manual excerpt can be found in the document’s settings :)

      Administrateur

  7. Nancy says

    I have installed the Advanced Excerpt plugin, selected a place on my posts for the Read More button & made sure except was selected in my screen options in the drop down box at the top but it doesn’t work. I have a long posts on my home page, no Read More button & don’t see how the plugin makes any difference at all. Please help. Thanks.

  8. Leanna says

    This article is helpful for posts on the site, but does it carryover to automated emails sent to subscribers when new post is added? Currently emails show the entire new post, not giving them a reason to visit the site.

  9. Theresa Fronius says

    This was SO helpful. I tried the first two, which did not help. But the last one, installing the Advanced Excerpt plugin – THAT DID THE TRICK! Wish I would have found this before I had invested so many hours in trying everything else under the sun. Thank you!

  10. Bexster says

    That was a great post! I’ve been looking to remove image captions from being pulled into post excerpt summary – this easily did the trick! Also looking into this plugin too as need a call to action button not showing up at present. TY!!

  11. Michał - Poland says

    Thank you very much. Ive been thinking for a long time, how to extend « excerpt » . Even try to find it somewhere in the code. Very greatful for this information.

  12. John says

    I am making a blog with wordpress free and with sapor I am stuck because I don’t know how to change a photo they already had on the blog I pressed a button on the top right corner and I chose a image and it came on top of the photo that had on I’m trying to change their one not add another so could you tell me how to do it (I’m doing it with sapor)

    Kind regard’s
    John

  13. Nic Mattson says

    I want to completely remove the automatic excerpt from appearing on certain posts display modules. Any advice?

  14. Ernie says

    Can you help me remove « read more » on my post pages. Even my privacy policy page have this annoying « read more » button. I installed WP and already had this button. Thanks!!

  15. Ihsan says

    Dear Author,

    Can you guide me on how to allow link (tag) on my post excerpt on Recent Post Extended plugin please? I tried few things – adding the tag on excerpt box, tried few things that I found online the last 3 hours, but no successful result. Please help.

    Thank you and regards,
    Ihsan

  16. Hemang Rindani says

    WordPress is a powerful CMS platform that can handle large chunks of data through easy to use interface. Over a website it is important to showcase the offerings on the landing page to attract more visitors. WordPress provides excerpts that helps a developer to add a summary block to the webpage. This size, shape and color of the block can be customized by the user. The links to the entire content can be placed in the block and can be managed manually from the dashboard. Use only the authenticated plugins like Advanced Excerpt that doesn’t compromise the website security.

  17. Ken Schleimer says

    The plug-in is a nice idea but I’d like to use an image instead of text for the « Read More » and haven’t found an easy way to accomplish it.

  18. deuns26 says

    hello,
    this website has exactly the same Article.

    I wonder who to create original article.
    often it is the same article, but in other language.

Laisser une réponse

Merci d'avoir choisi de laisser un commentaire. Veuillez garder à l'esprit que tous les commentaires sont modérés selon notre politique de commentaires, et votre adresse e-mail ne sera PAS publiée. Veuillez NE PAS utiliser de mots-clés dans le champ du nom. Ayons une conversation personnelle et significative.