Comments Christoffer Grande started the conversationApril 23, 2025 at 12:42pmHello,Is it a option to have the shipping text inside the countdown bar? 1,468Dustin repliedApril 25, 2025 at 4:06amHi Christoffer, Please add the below CSS code to WP-Admin → Appearance → Customize → Additional CSS: .wpcfb-progress-bar, .wpcfb-progress-amount { height: 20px; } .wpcfb-style-rounded .wpcfb-progress-bar, .wpcfb-style-rounded .wpcfb-progress-amount { border-radius: 10px; } .wpcfb-progress-bar:after { content: 'Your text here!'; position: absolute; height: 20px; line-height: 20px; left: 50%; transform: translateX(-50%); } And the result: Best regards,DustinChristoffer Grande repliedApril 25, 2025 at 7:51amHello mate. Thanks, but not actually what I was seeking, because I want to show «Remaining» text inside the bar. Buy for {remaining} and get free shipping. How can that be solved? 1,468Dustin repliedApril 28, 2025 at 3:33pmPlease update our plugin to the latest version 1.4.4, and add the custom code below. (How to add custom code? ↗): add_filter( 'wpcfb_progress_bar_attrs', function ( $attrs, $remaining ) { $attrs['remaining'] = 'Buy for ' . wp_strip_all_tags( wc_price( $remaining ) ) . ' and get free shipping.'; return $attrs; }, 99, 2 ); Then, replace the old CSS code with a new one: .wpcfb-progress-bar, .wpcfb-progress-amount { height: 20px; } .wpcfb-style-rounded .wpcfb-progress-bar, .wpcfb-style-rounded .wpcfb-progress-amount { border-radius: 10px; } .wpcfb-progress-bar:after { content: attr(data-remaining); position: absolute; height: 20px; line-height: 20px; left: 50%; transform: translateX(-50%); }Best regards,Dustin Sign in to reply ...
Hello,
Is it a option to have the shipping text inside the countdown bar?
Hi Christoffer,
Please add the below CSS code to WP-Admin → Appearance → Customize → Additional CSS:
And the result:
Best regards,
Dustin
Hello mate.
Thanks, but not actually what I was seeking, because I want to show «Remaining» text inside the bar.
Buy for {remaining} and get free shipping.
How can that be solved?
Please update our plugin to the latest version 1.4.4, and add the custom code below. (How to add custom code? ↗):
Then, replace the old CSS code with a new one:
Best regards,
Dustin