Compatibililty:

WebSite X5 Evo and Pro


Animated progress bars are often found on  portfolio websites or on company pages reporting their trends, so to show the reached levels. Do you want a progress bar for your own website? You can easily create one with the Skill Bar Object. Check out the examples available on the Preview page. We've used it in the CV Power Template as well as on the "Who?" page of The Vintage Shop.



How to set up the progress bar

  • Double-click the inserted Skill Bar Object to access the window with all options and stay in the Content section.
  • If you wish, enter in the Label field the text that will be displayed below the progress bar.
  • Set the reached Value. You can choose to express it as a Percentage. Otherwise, you must specify the Maximum value that can be reached.
  • Decide whether the reached value should be displayed on the progress bar: simply check or uncheck the Show value option.
  • Finish by setting the Animation duration and the bar Width in pixels.


How to define its style

  • Still in the Skill Bar window, go to the Style section and choose the Bar Style that best suits your page.
  • Depending on the selected Bar Style, different options will be available. Try adjusting colors, fonts, and alignments until you achieve the look you like most.
  • When you are satisfied, click the OK button to confirm.

 

Are you curious to use this Object on your website pages? Install Skill Bar now


You don't have enough Credits to buy this Object? Check out our Credit Packs