Transform your counters with non-Latin numerals. An Elementor addon that extends animated counter functionality to support Arabic numerals (٠١٢٣٤٥٦٧٨٩) alongside traditional Latin numbers, with full RTL language support.
✅ Animated Counters — Smooth animations from 0 to target number
✅ Arabic Numerals — Display counters in Arabic numerals (٠-٩)
✅ Latin Numerals — Classic Latin number support (1-9)
✅ RTL Language Ready — Full support for Arabic, Persian, and other RTL languages
✅ Customizable — Add prefixes/suffixes, adjust animation duration and delay
✅ Responsive Design — Adapts beautifully to all screen sizes
✅ Elementor Native — Works seamlessly with Elementor page builder
- Persian/Farsi numeral support (۰-۹)
- Chinese numerals
- Roman numerals (I, II, III, etc.)
- User-configurable character sets
- Advanced animation easing options
- Thousand separators
- WordPress: Latest stable version (currently tested on 6.x)
- PHP: 7.4 or higher
- Elementor: Latest stable version (tested with Elementor 3.15+)
- Browser: Modern browsers with ES6 support (Chrome, Firefox, Safari, Edge)
- Go to WordPress Admin → Plugins → Add New
- Search for "Elementor Extended Counter Widget"
- Click Install Now, then Activate
- Download the plugin
.zipfile - Extract to
/wp-content/plugins/elementor-extended-counter-widget/ - Go to WordPress Admin → Plugins
- Find "Elementor Extended Counter Widget" and click Activate
cd wp-content/plugins
git clone https://github.com/TarekNabil/Elementor-Extended-Counter-Widget.git
cd Elementor-Extended-Counter-Widget
# Plugin is ready to activate in WordPress Admin-
Activate Plugin
- Go to WordPress Admin → Plugins
- Click Activate on "Elementor Extended Counter Widget"
-
Add Widget to Page
- Open/create a page with Elementor
- Search for "Extended Counter" in the widgets library
- Drag to your page
-
Configure Counter
- Set number value (default: 100)
- Choose number format: Latin or Arabic
- Add optional prefix/suffix (e.g., "$" or "K+")
- Customize animation duration and delay
- Style colors and typography
-
Publish & Done!
- Preview on frontend to see animation in action
elementor-extended-counter-widget/
├── elementor-extended-counter-widget.php # Plugin entry point
├── includes/
│ ├── class-plugin.php # Plugin orchestrator
│ ├── class-number-converter.php # Number format utilities
│ ├── widgets/
│ │ ├── class-counter-widget.php # Counter widget class
│ │ └── loader.php # Widget registration
├── assets/
│ ├── js/counter-animation.js # Animation engine
│ └── css/counter-widget.css # Widget styling
├── languages/ # Translation files (i18n)
├── plan.md # Development roadmap
└── readme.txt # WordPress.org metadata
- PSR-4 Autoloading: Automatic class loading via namespaces
- Elementor Widget Model: Extends
\Elementor\Widget_Basefor native integration - Utility Classes: Reusable
NumberConverterfor easy format extensions - RTL-First CSS: Defensive styling that works with both LTR and RTL languages
- Extensible Architecture: Registry patterns for adding custom number formats
- Clone the repository
- Ensure WordPress and Elementor are installed locally
- Create
.github/instructions/plugin.instructions.md(read for coding standards) - Review
plan.mdfor implementation roadmap
The NumberConverter class uses a registry pattern for extensibility:
Step 1: Add your converter method in includes/class-number-converter.php
public static function convert_to_Armenian( $number ) {
// Conversion logic here
return $converted;
}Step 2: Register the format in widget controls (includes/widgets/class-counter-widget.php)
'Armenian' => __( 'Armenian Numerals', 'elementor-extended-counter-widget' ),Step 3: Update the animation script (assets/js/counter-animation.js) to call the new format
- PHP: PSR-12 WordPress Coding Standards
- JavaScript: ES6+ with JSDoc documentation
- CSS: BEM naming, RTL-aware selectors
- All user-visible strings wrapped in
__()/_e()for translation
<phase>: <action> — <description>
Phase 1: Add Number_Converter utility — Implements Latin to Arabic conversion
Phase 3: Implement widget renderering — Adds HTML structure and data attributes
Before commit, verify:
- PHP lint passes (no syntax errors)
- All strings are translatable
- Input is validated, output is escaped
- Code follows WordPress standards
- Widget appears in Elementor library
- Animations work (Latin and Arabic)
- RTL rendering is correct
This plugin is prepared for WordPress.org plugin repository:
- ✅ GPLv3+ License
- ✅ Security best practices (input validation, output escaping)
- ✅ i18n-ready (text domain, translation functions)
- ✅ Elementor dependency declared
- ✅ Minimum PHP version specified
- ✅ No tracking or external data collection
We welcome contributions!
- Fork the repository
- Create a feature branch (
git checkout -b feature/arabic-animation-easing) - Follow the code standards (see
.github/instructions/plugin.instructions.md) - Test thoroughly (see testing checklist above)
- Submit a pull request with clear description
- Bug fixes with test cases
- Performance improvements
- Accessibility enhancements
- Additional number format support
- Documentation improvements
- Translation contributions
Be respectful, inclusive, and constructive. Harassment or discrimination will not be tolerated.
- Check: Elementor is activated and up to date
- Fix: Deactivate and reactivate the plugin; clear browser cache
- Check: Number format dropdown is set to "Arabic"
- Fix: Ensure WordPress language is set to an RTL language for proper rendering
- Check: Browser console for JavaScript errors
- Fix: Update browser to latest version; disable JS minification plugins temporarily
Create an issue with:
- WordPress version
- Elementor version
- PHP version
- Steps to reproduce the issue
- ✨ Arabic numeral support
- ✨ Animated counter widget
- ✨ RTL language support
- ✨ Customizable animation duration and delay
- ✨ Prefix/suffix support
This plugin is licensed under the GNU General Public License v3.0 (GPLv3+). See LICENSE file for details.
Tarek Nabil
GitHub | Portfolio
Questions? Open an issue or visit GitHub Discussions