Statbar element customisation

Hi, I would like to use the statbar element to add a bar to my page that display some data.

What I would like is a bar that I can change the colour of to green.

I would then like to change the colour of the label to white, and have the label display a value such as 4500, instead of the label displaying the percentage value.

The bar itself changes based on the percentage value that you have entered… this will still work for what I visually need it to do, but is there a way to display the value “4500” in the label, but have the percentage value hidden and set to 80% for instance?
This would allow me to control how much of the bar is visually filled on screen, and display the data I wish to present in the label

So far I haven’t had any luck with css and my knowledge of it is fairly limited.

I have noticed that using short codes, the colour can be customized and is actually working on my page [skill_bar percent=“45” style=“background-color: rgb(28, 199, 88)”]

Any help would be greatly appreciated, and I’m so far very happy with this theme!

Hello @Boogledash,

Thanks for asking. :slight_smile:

Can you please share website URL for us to take a closer look?

Thanks.

Many thanks for the quick reply :slight_smile:

There isn’t actually anything related to this statbar on the website at the moment as I gave up trying to get it to work and deleted what I was testing. I thought it would be best to start with nothing and see what advice I was given on this forum.

To give you a better idea of what I am looking for, I quickly made a mock-up of the two bars and took a picture.

As you can see there are two bars in the colours I want, but they are displaying percentages on the label, and I want the label to show a different value “4500”. I would also like the label to be solid white with no opacity.

Currently I am using the latest version of X.

Hi There,

Thank you for the clarification, actually, the Stabar element allows you to customize the label (and more). Inspect the Statbar element and see under the LABEL tab.


Hope that helps,
Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.