Ajouter une barre de progression de lecture dans WordPress (Elementor)
Reading Progress Bar est une extension gratuite de Master Addons qui ajoute une fine barre en haut ou en bas de l'écran et la remplit lorsque les visiteurs font défiler la page. Vous l'activez par page ou par publication dans les paramètres de page d'Elementor, puis définissez la position, la hauteur, la couleur de la piste, la couleur de remplissage et la vitesse d'animation. Cela convient aux longs articles, didacticiels, documentation et pages juridiques où les lecteurs aiment savoir combien il reste.
Cette extension suit le défilement Pour afficher un but ou un score comme jauge de ligne, de cercle ou de ventilateur, utilisez le Widget Bar de progression. Pour une liste de barres de compétences, utilisez Barres de progression.


Allumez-le par page, en haut ou en bas
Ouvrez la page ou la publication dans Elementor, cliquez sur l'icône d'engrenage pour Paramètres de la page (Post Paramètres sur les publications) et développez le Barre de progression de lecture section. Allumer Activer la barre de progression de lecture et ensemble Position vers le haut ou le bas La barre est fixée au bord de l'écran et se remplit de 0 à 100 % lorsque le visiteur défile du haut de la page vers le bas.
- Le paramètre est enregistré par page, alors activez-le sur les publications longues et laissez-le hors des pages courtes. Il n'y a pas de changement à l'échelle du site.
- Il fonctionne sur les pages et les publications construites avec Elementor, puisque le commutateur est présent dans les paramètres de page d'Elementor.
- La progression couvre toute la hauteur de la page, y compris l'en-tête, les commentaires et le pied de page, et pas seulement le texte de l'article.
- Pour les utilisateurs connectés, la barre descend sous la barre d'administration WordPress.
Hauteur, Couleurs et Vitesse d'animation
Définir Hauteur de 0 à 100 px (5 px par défaut). Couleur d'arrière-plan colore la piste vide (blanc par défaut) et Couleur de remplissage colore la progression (bleu #007bff par défaut). Vitesse d'animation définit la fluidité avec laquelle le remplissage suit le défilement, de 0 à 1 000 millisecondes, 50 par défaut.
- Vous pouvez choisir les couleurs globales de votre kit Elementor pour la piste et le remplissage.
- Une barre de 3 à 6 px est perceptible sans couvrir l'en-tête.
- Une vitesse d'animation plus faible semble plus directe, une vitesse plus élevée plus douce mais légèrement retardée.

Elementor Pro Progress Tracker contre Reading Progress Bar
Elementor Pro dispose d'un widget Progress Tracker qui effectue un travail similaire avec plus d'options Voici comment les deux se comparent.
| Caractéristique | Suivi des progrès Elementor Pro | Barre de progression de lecture Master Addons |
|---|---|---|
| Prix | Besoins d'Elementor Pro | Gratuit avec Master Addons |
| Comment vous l'ajoutez | Un widget, généralement placé dans un modèle d'en-tête ou de publication unique | Un commutateur dans les Paramètres de Page de chaque page |
| Formes | Horizontal ou circulaire | Barre horizontale |
| Pistes | Page entière, contenu de publication ou un sélecteur CSS | Page entière |
| Étiquette pourcentage | Oui, facultatif | Non |
| Placement | Partout où vous mettez le widget, avec des options de direction | Fixé en haut ou en bas de l'écran |
Choisissez Progress Tracker d'Elementor Pro si vous en avez besoin sur chaque publication à partir d'un modèle, d'un style circulaire ou progressez dans l'article uniquement Choisissez la barre de progression de lecture pour une barre simple et gratuite sur les pages sélectionnées. Associez-la gratuitement Table des matières widget sur les longs messages.

Comment ajouter une barre de progression de lecture dans WordPress
Vous avez besoin d'Elementor et du plugin gratuit Master Addons, avec la page ou la publication modifiée dans Elementor.
- Installer et activer Modules complémentaires principaux de WordPress.orget vérifiez que la barre de progression de lecture est activée Additions principales, extensions.
- Ouvrez le message ou la page avec Elementor.
- Cliquez sur l'icône d'engrenage pour ouvrir Paramètres de la page (Paramètres de publication sur les publications).
- Étendre Barre de progression de lecture et allumez Activer la barre de progression de lecture.
- Choisissez Haut ou bas, puis définissez Hauteur, Couleur de fond, Couleur de remplissage et Vitesse d'animation.
- Mettez à jour la page et faites-la défiler sur le front-end pour vérifier la barre.
Questions fréquemment posées pour la lecture de la barre de progression
La barre de progression de la lecture est-elle gratuite ?
Oui. C'est une extension gratuite dans le plugin Master Addons sur WordPress.org et fonctionne avec Elementor gratuit Il s'affiche également sur les téléphones et les tablettes, fixé sur le bord supérieur ou inférieur.
Puis-je l'ajouter à certaines pages mais pas à d'autres ?
Oui, et c'est la seule façon dont cela fonctionne Le commutateur est dans les paramètres de page de chaque page ou publication de la page Élémenteur, alors allumez-le pour les publications longues et laissez-le éteint ailleurs Il n'y a pas de paramètre global pour l'ajouter à chaque publication à la fois.
Est-ce que cela va ralentir mon site web ?
Non. Il ajoute un petit script en ligne et quelques lignes de CSS sur les pages où il est activé, sans fichiers ni images supplémentaires.
Est-ce qu'il mesure uniquement l'article ou toute la page ?
Toute la page Le remplissage s'étend du haut de la page jusqu'en bas, donc les en-têtes, les commentaires et les pieds de page comptent aussi Le Progress Tracker d'Elementor Pro ne peut suivre que le contenu de la publication si vous en avez besoin.
Widgets et extensions d'éléments tendance
Construisez des sites Web sophistiqués en moins de temps.

Glassmorphisme

Extras de conteneurs

Modèles
![Modules principaux Extension de duplicateur de messages/pages pour le lien de ligne Elementor : MA Duplicator dans la liste des pages WordPress créant une ébauche de page de destination - [Dupliqué n° 128]](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Duplicateur de messages/pages
