mdtanvirahmed

<p>StichyX Bar is a lightweight and versatile WordPress plugin designed to enhance user engagement on your website by incorporating dynamic progress bars that animate smoothly as users scroll through your content. Built with performance in mind, this plugin leverages pure CSS and JavaScript to deliver eye-catching visual effects without compromising page load times. Whether you’re showcasing project completion, skill levels, fundraising goals, or any metric-driven data, StichyX Bar provides an intuitive way to present information in an interactive and modern format.</p>
<h3>Key Features</h3>
<ul>
<li><strong>Scroll-Triggered Animation</strong>: Progress bars only animate when they enter the viewport, ensuring a seamless user experience and reducing unnecessary resource usage.</li>
<li><strong>Shortcode Flexibility</strong>: Easily customize bars with attributes like percentage fill, animated numbers, custom labels, and colors, making it adaptable for various content types.</li>
<li><strong>Section-Based Fallbacks</strong>: Automatically apply predefined colors based on parent section classes (e.g., red, blue, or dark themes), simplifying styling for developers who prefer class-based theming.</li>
<li><strong>Responsive Design</strong>: Bars scale beautifully across devices, from desktops to mobile screens, maintaining readability and aesthetics.</li>
<li><strong>No Dependencies</strong>: Relies solely on WordPress core functions, with no external libraries required, ensuring broad compatibility and easy maintenance.</li>
<li><strong>SEO-Friendly</strong>: Generates clean, semantic HTML that search engines can easily index, while keeping JavaScript unobtrusive.</li>
</ul>
<p>Ideal for portfolios, business websites, blogs, and e-commerce sites, StichyX Bar helps transform static data into compelling visual stories. The plugin is actively maintained, with regular updates to improve functionality and security. For support or customizations, reach out to the author at https://i-am-tanvir.netlify.app/. Compatible with WordPress 5.0+ and tested up to version 7.0.</p>
<h3>Usage</h3>
<p>Use the <code>[progress_bar]</code> shortcode anywhere on your site.</p>
<h3>Basic Example</h3>
<pre><code>[progress_bar percent="75"]
</code></pre>
<h3>Advanced Example</h3>
<pre><code>[progress_bar percent="85" number="850" label="Sales Growth" color="#ff5733"]<h3>Shortcode Attributes</h3>
</code></pre>
<p>* <code>percent</code> (required): Percentage value for the progress fill (0-100). Default: 50<br />
* <code>number</code>: Number to animate beside the bar. Default: 0<br />
* <code>label</code>: Optional label displayed above the bar.<br />
* <code>color</code>: Custom fill color in hex or color name.</p>
<h3>Section-Based Color Fallbacks</h3>
<p>If you prefer not to use the <code>color</code> attribute, the plugin can apply fallback colors based on section classes:<br />
* <code>.bg-red</code> <span aria-hidden="true" class="wp-exclude-emoji">→</span> red (#ff4d4d)<br />
* <code>.bg-blue</code> <span aria-hidden="true" class="wp-exclude-emoji">→</span> blue (#4d79ff)<br />
* <code>.bg-dark</code> <span aria-hidden="true" class="wp-exclude-emoji">→</span> dark (#111)</p>
<h3>Example</h3>
<pre><code><section class="bg-red">
    [progress_bar percent="60" number="600"]
</section>
</code></pre>


StichyX Bar

A lightweight WordPress plugin for animated progress bars with shortcode controls and responsive scroll effects.

Freemius

Ben Roberts

<p>Ultimeter uses a simple shortcode, widget or block, to display a choice of different meters (a thermometer and a progress bar in the Lite version, with three more added in the Pro version). It then allows you to choose between percentage or currency units (with heaps more metrics in the Pro version). You can specify the total (goal) amount, as well as the total raised (progress) amount. You can even choose the colour of the meter, to keep it in line with your own styles.</p>
<h3>Features</h3>
<ul>
<li>Choice of 3 meters</li>
<li>Change the colours to suit your branding</li>
<li>Control alignment and size</li>
<li>Set goal and current values</li>
<li>Choice of either percentage or currency units</li>
<li>Automatic formatting of currency values</li>
<li>Choice of currency unit</li>
<li>Duplicate meters easily</li>
<li>Multiple meters per page or site</li>
<li>Insert using a shortcode or a block</li>
</ul>
<h3>Pro Features</h3>
<ul>
<li>Many more meter designs, including a radial meter, a vertical progress bar, and a range of inline and text-based meters.</li>
<li>A third measurement unit with custom values – takes a singular and plural form, i.e. boxes, bags etc.</li>
<li>Ability to add custom CSS to make even more style changes.</li>
<li>A new set of Infinite Meters that count up indefinitely.</li>
<li>The ability to upload your own image to use as a meter. This could be a photo, or your company logo.<br />
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/kRq5_a8q8kI?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></li>
<li>Heaps more styling options, such as the ability to color the progress and goal labels, as well as your milestones.</li>
<li>Add milestones to your meters, to proudly display key points in your progress.<br />
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/OehM4Jyd5MQ?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></li>
<li>Track WooCommerce sales progress. Pick a product, and the Ultimeter will display the all-time gross sales figure.</li>
<li>Fully integrated with GiveWP. Pick a GiveWP form to track, and display your fundraising progress using any Ultimeter.</li>
<li>Fully integrated with Charitable Fundraising Plugin. Pick a Charitable Campaign to track, and display your fundraising progress using any Ultimeter.</li>
<li>Fully integrated with Gravity Forms. Pick a form to track, and display the total payments or number of entries.</li>
<li>Fully integrated with Fluent Forms. Pick a form to track, and display the number of form submissions.</li>
<li>A growing collection of WordPress hooks to allow you to configure more of your meter’s content.</li>
<li>Track data from any compatible plugin or external data source via an API.</li>
<li>Celebrations – add an exciting animation when you reach your target.</li>
<li>‘Boost’ your progress by a user-specified amount. Great for adding offline payments to donation campaigns.</li>
<li>Use our Zapier integration to connect Ultimeter to 2000+ other applications. Ultimeter can now track (nearly) everything!</li>
<li>Real-time updating. No need to refresh the page. Your meters will adjust their progress dynamically (Enterprise Edition)<br />
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/7uzYrp6fVSU?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span></li>
</ul>
<p>Plus:<br />
* Regular updates<br />
* Our awesome email and personal support</p>
<p>To see all the Pro Features, head to the <a href="https://ultimeter.app" rel="nofollow ugc">plugin homepage</a> and then compare our <a href="https://ultimeter.app/pricing" rel="nofollow ugc">simple and affordable plans</a>.</p>


Ultimeter

Ultimeter - the Ultimate Progress and Goals Meter

StichyX Bar vs Ultimeter