Oops! Something went wrong while submitting the form.
Interactions
CMS
Boosters
Time to Read
Use the Refokus Time to Read tool to calculate the total read time of a text element or rich text element and display the calculated time dynamically within Webflow.
[.c-title-3-primary]How do you create a Time to Read calculator in Webflow?[.c-title-3-primary]
‍
Use Refokus Time to Read tool to calculate the total read time of a text element or rich text element and display the calculated time dynamically on another text element.
‍
Step #1
Copy the
Time to Read
<script> and paste it before the </body> of your page
To start, add a text or rich text element in the project. Ensure that the text you want to calculate is in one single element. This is the text that will be calculated into a read time. Give this text or rich text element a class, anything you want, for this example. We use the class '.c-rich-content'.
Next step, we need to create an element that displays the calculation of the text or rich text element. This would be a text element that will dynamically change based on the calculation.
Adding the Time to Read Attribute to the text element
time-to-read
.c-rich-content
To this element we want to add the following attribute: (Remember the class you gave the text element you need to be calculated, this is the value of the attribute.)