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 ajouter un redimensionnement de police dans WordPress pour l’accessibilité

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 permettez à vos internautes de redimmensionner le texte de votre site WordPress ?

L’objectif d’un redimensionnement des polices est de permettre aux internautes malvoyants d’ajuster plus facilement la taille des polices sans interrompre la mise en page d’un site. Cela aide à améliorer l’accessibilité.

Dans cet article, nous allons vous afficher comment ajouter un texte redimmensionnable pour les internautes dans WordPress.

How to add resizeable text for site visitors in WordPress

Pourquoi ajouter du texte redimmensionnable à votre site ?

Trouver la bonne police de caractères pour votre site WordPress est important car elle joue un rôle massif dans l’attractivité de votre site et aide les internautes à lire votre contenu.

Cependant, il peut arriver que cela ne suffise pas à sélectionner la meilleure police de caractères pour votre site. Si la taille de la police est trop petite, les internautes auront du mal à lire vos articles et finiront par abandonner votre site.

Un moyen plus facile d’améliorer la lisibilité est d’offrir aux internautes l’option de redimmensionner le texte principal de votre site. Cela permet aux utilisateurs/utilisatrices d’ajuster la taille du texte à leur convenance et de passer plus de temps sur votre site.

Même si vous pouvez utiliser la fonctionnalité de zoom intégrée au navigateur en appuyant sur les touches « CTRL et + », celle-ci augmente la taille de tous les éléments de la page, et pas seulement celle du texte. Cela risque de perturber la mise en page du site et de ne pas offrir un bon compte à l’utilisateur/utilisatrice.

Cela dit, voyons comment vous pouvez facilement ajouter du texte redimmensionnable pour vos internautes dans WordPress.

Tutoriel vidéo

Subscribe to WPBeginner

Si vous préférez des instructions écrites, continuez à lire. Vous pouvez utiliser les liens rapides ci-dessous pour passer à une méthode spécifique :

Méthode 1 : Ajouter un texte redimmensionnable dans WordPress (thèmes WordPress classiques uniquement)

Le moyen le plus simple de permettre aux utilisateurs/utilisatrices de redimmensionner le texte sur votre site est d’utiliser une extension WordPress telle que Accessibility Widget.

C’est une extension WordPress gratuite qui vous permet d’ajouter une option à la colonne latérale de votre site pour modifier la taille du texte. L’extension est légère et très facile à utiliser.

Cela dit, notez que l’extension Accessibility Widget n’est pas compatible avec les thèmes Full Site Editing et block, elle fonctionnera donc uniquement si vous utilisez un thème classique.

Note : Vous pouvez remarquer que l’extension n’a pas été testée avec les dernières versions de WordPress. Cependant, nous l’avons testé nous-mêmes et il fonctionne parfaitement pour cet usage.

Si vous n’êtes pas sûr d’essayer ce plugin, vous pouvez lire notre article d’opinion sur la question de savoir si vous devriez installer des extensions qui n’ont pas été testées avec votre version de WordPress.

La première chose à faire est d’installer et d’activer l’extension Accessibility Widget sur votre site. Si vous avez besoin d’aide, veuillez consulter notre guide sur l’installation d’une extension WordPress.

Une fois activé, il suffit de se rendre dans Apparence  » Widget depuis le panneau d’administration de WordPress. Ensuite, vous pouvez cliquer sur le bouton  » +  » et ajouter le bloc  » Accessibility Widget  » à votre colonne latérale.

Add an accessibility widget block

Ensuite, vous pouvez saisir un titre pour le widget, comme « Modifier la taille du texte » ou « Redimmensionner le texte ».

Ensuite, vous devez sélectionner les éléments HTML ou les classes CSS qui seront affectés par le widget. Les options par défaut sont les suivantes : corps, paragraphe, éléments de liste et cellules de tableau. Ces options devraient convenir à la plupart des sites.

Change accessibility widget settings

Le widget vous permet de bénéficier de quatre options de redimmensionnement. Les options par défaut sont 90%, 100%, 110% et 120%. Vous pouvez augmenter ou réduire la taille des polices en saisissant les chiffres dans le champ « Définir à ces tailles ».

Le dernier réglage du widget est le texte du contrôleur, c’est-à-dire le texte que les utilisateurs/utilisatrices verront. Vous pouvez conserver les pourcentages par défaut pour la taille du texte ou utiliser une lettre pour afficher différentes tailles de police.

Une fois que vous avez terminé, cliquez sur le bouton « Mettre à jour » pour stocker les réglages de votre widget.

Vous pouvez maintenant visiter votre site pour voir le widget en action. Voici comment le widget devrait apparaître dans la colonne latérale de votre site :

Change text size preview

Si vous estimez que le texte du contrôleur n’est pas perceptible, vous pouvez le modifier à l’aide de CSS.

Par exemple, ajoutez ce code CSS à la feuille de style de votre thème:

.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}

Ce CSS ajoutera une bordure autour du texte du contrôleur, le mettra en gras et ajoutera un peu de marge interne. Pour plus de détails, veuillez consulter notre guide sur la façon d’ajouter des CSS personnalisés dans WordPress.

Méthode 2 : Ajouter un texte redimmensionnable dans WordPress (Tous les thèmes WordPress)

Un autre moyen facile de permettre aux utilisateurs/utilisatrices de redimmensionner le texte sur votre site est d’utiliser WP Accessibility. Cette extension vous permet d’ajouter une barre d’outils à votre site pour modifier la taille du texte, quel que soit le thème que vous utilisez.

La première chose à faire est d’installer et d’activer l’extension WP Accessibility sur votre site. Vous pouvez consulter notre guide sur l ‘installation d’une extension WordPress si vous avez besoin d’aide.

Une fois activée, il suffit de se rendre sur la page WP Accessibility à partir du panneau d’administration de WordPress.

WP Accessibility Settings

Dans la section « Barre d’outils d’accessibilité », cliquez sur l’option « Activer la barre d’outils d’accessibilité » et sélectionnez « Taille de police ». Cela ajoutera un redimensionneur de police à la barre d’outils.

Si nécessaire, vous pouvez également activer les options Contraste et Niveaux de gris.

En outre, vous pouvez modifier la taille de la police du contenu lorsque vous cliquez sur la barre d’outils. Vous pouvez également sélectionner « Taille par défaut » dans le menu déroulant si vous n’êtes pas sûr de votre choix.

Par ailleurs, nous vous recommandons d’activer l’option « Utiliser une autre feuille de style pour redimensionner les polices ». Lorsque cette option est activée, les utilisateurs/utilisatrices peuvent facilement basculer entre les tailles de police par défaut et une version plus grande et plus lisible du texte.

N’hésitez pas à activer d’autres réglages dans l’extension.

Une fois cela fait, cliquez sur le bouton « Mettre à jour les réglages de la barre d’outils ».

WP Accessibility toolbar settings

C’est tout !

Voici à quoi ressemble notre barre d’outils de redimmensionnement des polices sur l’interface publique :

Gif of how the WP Accessibility plugin works

En savoir plus, vous pouvez consulter notre guide sur l ‘amélioration de l’accessibilité de votre site WordPress.

Nous espérons que cet article vous a aidé à ajouter du texte redimmensionnable sur votre site WordPress. Vous pouvez également consulter notre guide sur la façon d’améliorer les performances de votre site WordPress et les meilleures extensions WooCommerce.

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

8 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!

  2. Shushanna says

    Hi, thanks for the amazing post. I wonder if your site does not have a sidebar, is it possible to to put the widget somewhere else, for example above the navigation.

    • WPBeginner Support says

      You can place it in your theme’s widget areas if your theme has widget areas available!

      Administrateur

  3. Jasper says

    I have installed the widget but don’t have the Set Controller Text box so on the website it shows the %s.
    Any sugestions? Thanks

  4. Ivo says

    Hi, I followed the instructions as on the video but noting happens. Please help.
    I actually wont it to make my girlfriend site to be zoom-able when open in mobile devices. Please suggest…
    Regards,
    Ivo

  5. Wrenling says

    This widget is AMAZING, thank you so much!!

    I’m curious, I added it to my blog and it is EXACTLY what I wanted, but it only affects the main page of the blog – if you click on an individual post, the widget disappears. Can you tell me how to fix this?

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.