Table Of Contents

Reading Progress Bar Widget

How to Use Reading Progress Bar Widget

If you start to think about how to make the reading progress on your website, you can go for our Reading Progress bar Widget by Element Pack. The widget will let you show the bar to the readers.

I’ll include step-by-step instructions and detailed pictures to help you get started.

To Insert Widget

Reading Progress Bar Widget insert

Inserting widget, it is just a matter of drag and dropping. You can insert the widget in any place of your page. As you see in the screenshot above.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot.

Reading Progress

Look at the controls included in the section. With the default one, Skin control will allow you to set a skin such as Back To Top With Progress, Horizontal Progress, and Progress with Cursor and also the position of the skin.

Moreover, you can set size and offset horizontally and vertically. Have a look at the screenshot above.

Go to the Content tab > Reading Progress > and check the controls.

Style Tab

Now, let’s work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you require to design. 

Let’s have a look.


There is nothing more to do here. Here, this section will help you add Color, Active Background, Box Shadow, and Typography.

Just go to the Style tab > Additional > and Check all the controls.

Video Assist

In conclusion, it seems that you’ve read this article and found it very useful. If you want to know more about the widget, you can watch the video on Reading Progress Widget by Element Pack and also go to our demo page.

Enjoy New Year 2022 with a 35% Discount on all Products! Check Here


Don’t worry we hate spam and we promise you will get only quality news and offer from us.

© Copyright 2021 All Rights Reserved by BdThemes