Animate In View vs Counters Block – Animated Number Counters, Stats & Dynamic KPIs

Using a fast, simple, native technique, the Animate In View block will watch over inner blocks you add within it and when they come into the user’s view, it will simply fade and optionally slide in. Trigger simple, smooth, modern animations as the content enters the screen. Follow @kevinbatdorf on Twitter View on GitHub Features Both lightweight and fast, and only does one thing. Set a threshold for when the block starts to animate. Run only once, or each time it comes in/out of view. Wrap any existing block with the Animate In block with the push of a button. Transition in left, right, or neither (fade only). Fade only mode: Set the starting position to “none” Change the class name used to add your own custom animations. General Tips & Tricks You can wrap the currently selected block with an Animate In View block by pressing the icon toward the end of the toolbar. You may need to place the block within a group block to ensure content styling is consistent. Some themes may require a group block be at the top level. Alternatively, the Animate In View block has alignment controls enabled just in case. You may need to tweak things if your layouts have custom classes or styles applied. Try copy/pasting the classes, or try to nest the blocks in a way that doesn’t affect the theme styling. Nest blocks to stagger animations. The animations won’t start until all are in view, then one by one. But make sure you don’t use an area too large for the viewport. The Animate In View block comes with a single nested group block by default, but you may use others as well. Use the list view to drag and drop blocks into the Animate In View block. Open an issue if you need an assist. I’m happy to take a look.

Counters Block is the ultimate Gutenberg tool for displaying statistics, milestones, and achievements with professional animated number counters. Whether you’re building a business landing page, a portfolio, or a high-converting dashboard, this block helps you showcase social proof and key metrics in a way that captures attention and builds trust. Counters Block | Pricing | Support | Demos 🚀 NEW: Dynamic Data Integration (Premium) Stop manual updates! Counters Block can now automatically fetch and display live data from your site: WooCommerce Stats: Display total Sales, Order Count, Product Count, and Total Customers (Registered + Guests). WordPress Core Stats: Automatically show total Posts, Pages, Comments, and User counts. HPOS Ready: Fully compatible with WooCommerce High-Performance Order Storage. 🎨 Stunning Designs & Animations With 16 modern counter layouts (including the new Circular Progress Counter), powerful animation triggers, and full responsive controls, you have complete creative freedom without touching a single line of code. 💡 Perfect For: E-commerce: Live sales counters & happy customer stats. Agency/Business: Project milestones & team achievements. Blogs/Portfolios: Published post/page counts & subscriber stats. SaaS/Dashboards: Real-time KPI tracking & performance metrics. Features 📊 Dynamic Data Sources (Premium) WooCommerce Stats: Total Sales, Total Orders, Total Products, and Total Customers. Smart Customer Counting: Includes both registered users and guest checkouts. WordPress Stats: Total Posts, Total Pages, Total Comments, and Total Users. Auto-Sync: Data stays fresh and updates automatically. 🎨 Themes & Layouts 16 ready-made counter themes (13 premium + 3 free) NEW: Circular Progress Counter (Theme 15) Multiple modern layouts with one-click theme switching Fully responsive grid-based layout (Desktop, Tablet, Mobile) Custom column and row gap control ✨ Advanced Number Animations Classic, Rolling, Bounce, Fade, and Slide (Up/Down/Left/Right) Pulse, Flip, and Typewriter animations Animation Triggers: On Visible, On Page Load, On Click, On Hover, or Custom CSS Selector. Global & Per-Counter duration, delay, and stagger controls. 🔢 Number Formatting Custom Prefix & Suffix support. Thousands separator support (Comma & Space). Decimal number support with smooth transitions. Smart Sales Formatting: Automatically handles refunds and prevents negative values. 🖼️ Icon & Typography Custom icon support (Font Awesome, Bootstrap, Lucide). Responsive typography for numbers, labels, and sub-labels. Per-counter styling: Backgrounds, borders, shadows, and hover effects. Free vs Premium Free Version Unlimited static counters. 3 professional counter themes. Fully responsive grid layout. Classic animations & icon support. Basic typography controls. Premium Version Live Dynamic Data: WooCommerce & WP Core stats integration. 13 Premium Themes: Including the Circular Progress Counter. Advanced Animations: Rolling, Bounce, Flip, Typewriter, and more. Smart Formatting: Auto-handling of sales/refunds & guest counting. Priority Support: Direct help from our development team. How to Use Install and activate the Counters Block plugin. Open any Page or Post in the Gutenberg editor. Add Counters Block from the block inserter. (Optional) Select a Data Source (Static, WP Core, or WooCommerce). Customize themes, colors, and animations from the settings panel. Publish and watch your stats come to life! 🚀 Feedback & Support Found a bug or have a feature request? We’d love to hear from you! 📧 Send feedback Support forum: https://wordpress.org/support/plugin/counters-block/ Check out the Parent Plugin of this plugin- B Blocks – A blocks collection and page building tool for Gutenberg. Check out our other WordPress Plugins- Html5 Video Player – Display videos as single and playlist in multiple skins. PDF Poster – Display/Embed PDF files with different styles. Html5 Audio Player – Listen audios with awesome visuals. StreamCast – Customizable radio player with different skins. 3D Viewer – Embed 3D models and 3D products with interaction. Advanced Post Block – Show posts and custom posts in different layouts.