Title: Remove “%” from progress bar label
Last modified: March 9, 2024

---

# Remove “%” from progress bar label

 *  Resolved [lucapoe](https://wordpress.org/support/users/lucapoe/)
 * (@lucapoe)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/)
 * Hallo, is there any way to remove the “%” symbol from the progress bar label?
 * Or maybe I can suggest to use some kind of suffix in the panel, so user can easily
   customize the label as they need
 * thx

Viewing 8 replies - 1 through 8 (of 8 total)

 *  Thread Starter [lucapoe](https://wordpress.org/support/users/lucapoe/)
 * (@lucapoe)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17487502)
 * Or at least, maybe you guys can use specific html tag for the %, so it can be
   easily hidden by css if needed. Because sometime we need to use the progress 
   as other than percentaage, like points, degree, etc
 *  Plugin Contributor [Istiak Rayhan](https://wordpress.org/support/users/istiakrayhan/)
 * (@istiakrayhan)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17487721)
 * Thanks for suggestion, Lucapoe. 
   We have already added it on our to-do list. 
   This feature will be available in the next plugin update.
 *  Thread Starter [lucapoe](https://wordpress.org/support/users/lucapoe/)
 * (@lucapoe)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17489073)
 * Thanks great to hear that
 *  Thread Starter [lucapoe](https://wordpress.org/support/users/lucapoe/)
 * (@lucapoe)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17491428)
 * Btw again, if I can add another suggestion on progress bar, maybe you can make
   the bar start to animate to fill when it appear on screen. Because what the use
   of the animation if user can’t see it right? Keep the great work guys!
 *  Plugin Contributor [Istiak Rayhan](https://wordpress.org/support/users/istiakrayhan/)
 * (@istiakrayhan)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17491443)
 * Thanks. We will also think about this feature.
 *  Plugin Contributor [Istiak Rayhan](https://wordpress.org/support/users/istiakrayhan/)
 * (@istiakrayhan)
 * [2 years, 2 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17532133)
 * We have added the Number settings (Show Number, Number Prefix, Number Suffix)
   in the progress bar block.
   Please check and share your feedback.
 *  Thread Starter [lucapoe](https://wordpress.org/support/users/lucapoe/)
 * (@lucapoe)
 * [2 years, 2 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17534885)
 * That’s great!
 * Btw I don’t know if this is the right way to contribute. I added this CSS to 
   make the animation a little bit smoother:
 *     ```wp-block-code
       .ub_progress-bar.is-style-ub-progress-bar-circle-wrapper .ub_progress-bar-circle .ub_progress-bar-circle-path {
               transition: stroke-dashoffset 1.25s ease-out 0s, stroke-dasharray 1.75s ease-out 0s, stroke 1.75s ease-out 0s, stroke-width 1.75s ease-out .3s;
       }
       ```
   
 * And experiment using this JS in the /src/blocks/progress-bar/front.build.js to
   delay the animation until it appear on screen:
 *     ```wp-block-code
       document.addEventListener("DOMContentLoaded", function () {
         // Select all progress bar elements
         const progressBars = document.querySelectorAll(".ub_progress-bar");
   
         // Intersection observer options
         const options = {
           root: null, // Observe the entire viewport
           threshold: 0.5, // Consider element visible when 50% or more is in the viewport
         };
   
         // Create an IntersectionObserver instance
         const observer = new IntersectionObserver(function (entries) {
           entries.forEach(entry => {
             if (entry.isIntersecting) {
               entry.target.classList.add("ub_progress-bar-filled");
               // Detach the observer from the element after it's visible
               observer.unobserve(entry.target);
             }
           });
         }, options);
   
         // Observe each progress bar element
         progressBars.forEach(bar => observer.observe(bar));
       });
       ```
   
 * Maybe you guys can test and implement it later. The results:
 * [https://test.espresio.id/progress-bar-ultimate-blocks/](https://test.espresio.id/progress-bar-ultimate-blocks/)
 *  Plugin Author [Imtiaz Rayhan](https://wordpress.org/support/users/imtiazrayhan/)
 * (@imtiazrayhan)
 * [2 years, 2 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17535173)
 * Hi [@lucapoe](https://wordpress.org/support/users/lucapoe/),
 * Thank you so much for this.
 * We will be sure to test and implement this in the next release.
   Kind regards.

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Remove “%” from progress bar label’ is closed to new replies.

 * ![](https://ps.w.org/ultimate-blocks/assets/icon-256x256.png?rev=2966061)
 * [Ultimate Blocks – 25+ Gutenberg Blocks for Block Editor](https://wordpress.org/plugins/ultimate-blocks/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/ultimate-blocks/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/ultimate-blocks/)
 * [Active Topics](https://wordpress.org/support/plugin/ultimate-blocks/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/ultimate-blocks/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/ultimate-blocks/reviews/)

 * 8 replies
 * 3 participants
 * Last reply from: [Imtiaz Rayhan](https://wordpress.org/support/users/imtiazrayhan/)
 * Last activity: [2 years, 2 months ago](https://wordpress.org/support/topic/remove-from-progress-bar-label/#post-17535173)
 * Status: resolved