Contents
Read Time

Read Time

Cet outil calcule et affiche automatiquement le temps de lecture estimé de vos articles et articles de blog. Il analyse à la fois le contenu textuel et les images pour fournir des estimations temporelles précises, aidant les lecteurs à comprendre combien de temps il leur faudra pour consommer votre contenu. Personnalisez la vitesse de lecture, le temps de traitement de l'image et le format d'affichage. Parfait pour améliorer l'expérience utilisateur et définir des attentes appropriées en matière de consommation de contenu.
Partager ce contenu
Read Time
Implémentez-le plus rapidement
Site Démo
Clonable
1

Ajouter le script

Ajoutez ce script dans les paramètres de page > Code personnalisé > Avant la fermeture de la balise </body>

<!-- BeBranded Contents -->
<script async src="https://cdn.jsdelivr.net/npm/@bebranded/bb-contents@latest/bb-contents.js"></script>
2

Attribut principal

Activer le module

Attribut bb-reading-time
bb-reading-time = " "

Ajoutez l'attribut bb-reading-time à l'élément où vous voulez afficher le temps de lecture.

Ajouter cet attribut :
Nom
bb-reading-time
Valeur
NOTE
L'attribut bb-reading-time peut être vide. Par défaut, il analysera le contenu de l'élément lui-même.
3

Cibler un contenu spécifique

Contenu cible

Attribut bb-reading-time-target
bb-reading-time-target = ".article-content"

Utilisez bb-reading-time-target pour spécifier un sélecteur CSS du contenu à analyser.

Ajouter cet attribut :
Nom
bb-reading-time-target
Valeur
.article-content
NOTE
Exemple : ".article-content" analysera le contenu de l'élément avec la classe article-content.
Optionnel

Vitesse de lecture personnalisée

Vitesse de lecture

Attribut bb-reading-time-speed
bb-reading-time-speed = "200"

Définissez le nombre de mots par minute pour le calcul. La valeur par défaut est 230 mots/minute.

Ajouter cet attribut :
Nom
bb-reading-time-speed
Valeur
200
NOTE
Valeurs typiques : 150-200 (lecture lente), 200-250 (lecture normale), 250-300 (lecture rapide).
Optionnel

Temps par image

Temps par image

Attribut bb-reading-time-image-speed
bb-reading-time-image-speed = "15"

Définissez le nombre de secondes supplémentaires pour chaque image. La valeur par défaut est 12 secondes.

Ajouter cet attribut :
Nom
bb-reading-time-image-speed
Valeur
15
NOTE
Considérez la complexité de vos images : 5-10s pour des images simples, 10-20s pour des images complexes.
Optionnel

Format d'affichage

Format personnalisé

Attribut bb-reading-time-format
bb-reading-time-format = "Temps de lecture : {minutes} min"

Utilisez bb-reading-time-format pour personnaliser l'affichage avec le placeholder {minutes}.

Ajouter cet attribut :
Nom
bb-reading-time-format
Valeur
Temps de lecture : {minutes} min
NOTE
Le placeholder {minutes} sera remplacé par le nombre de minutes. Exemple : "Temps de lecture : 5 min"
1

2

Toujours besoin d'aide ?
Nous Contacter

Essayez d'autres contenus

Tous les Contenus
Youtube Grid sur Webflow

Youtube Grid sur Webflow

Créez des grid de vidéos YouTube dynamiques qui récupèrent et affichent automatiquement les vidéos de n'importe quelle chaîne YouTube dans une disposition en grille personnalisable.
Infinite Marquee

Infinite Marquee

Créez du contenu fluide à défilement infini avec une vitesse, une direction et une fonctionnalité de pause au survol personnalisables.
Current Year

Current Year

Affichez et mettez à jour automatiquement l'année en cours sur votre site Web grâce à des options de mise en forme personnalisables.