Get Started

Downloading the Extension

Email: After purchasing from our store, you receive an email with the download link.

Store: You can also download from the Downloads section. Use the same email address you used when purchasing.

Download the package — Counters_UNZIP.zip

Unzip the Package

• UNZIP Counters_UNZIP.zip.
• Inside you will find:
  • mod_counters_2.0.zip — install this on Joomla 4, 5, or 6
  • readme.txt — version notes and quick setup

Go to System → Install → Extensions and open the Upload Package File tab.

Upload mod_counters_2.0.zip and click Upload & Install.

After a successful install:

• Go to Content → Site Modules
• Open Counters (or create a new module of type Counters)
• Add items under the Counters tab, pick a layout, publish, and assign a position

Note: Counters 2.0 supports Joomla 4, 5, and 6 only. Joomla 3.x is not supported. PHP 8.0+ required.

Choose how the stats block is presented on the page.

• Design Layout: Classic, Cards, Glass, Minimal, Pill, or Split
• Columns: Auto-fit, or force 2–6 columns
• Gap: Space between counters (e.g. 24px)
• Alignment: Left, center, or right
• Title Position: Show title/description above or below the number
• Show Icons: Toggle built-in SVG icons (or Font Awesome override)
• Icon Size: Icon size in pixels
• Hover Lift: Subtle lift / shadow on hover for card-style layouts

Click Add to create each counter item.

• Title: Label shown with the number (e.g. Happy Clients)
• Description: Optional short supporting line
• From / To: Start and end values (decimals supported, e.g. 99.9)
• Duration (ms): Animation length (e.g. 2000 = 2 seconds)
• Decimals: 0–4 decimal places
• Prefix / Suffix: e.g. $, +, %, x
• Built-in Icon: Users, Award, Chart, Rocket, Star, and more (no Font Awesome required)
• Font Awesome Class: Optional override (e.g. fas fa-chart-line)
• Accent Colour: Optional per-item accent for icon and prefix/suffix

Animation starts when the counter scrolls into view (IntersectionObserver).

• Thousand Separator: Format large numbers (e.g. 125,000)
• Separator Character: Default comma; customise if needed
• Decimal Separator: Default period
• Easing: Linear, Ease Out, or Ease In Out
• Replay On Scroll: Re-animate when the counter leaves and re-enters the viewport

Numbers reserve width for the final value so digit changes do not jitter the layout. Reduced-motion preferences jump straight to the final value.

Match your brand without custom CSS (Extra CSS is still available under Advanced).

• Accent Colour: Default accent for icons and prefix/suffix
• Number / Title / Description Colours
• Card Background & Border Colour (RGBA supported)
• Corner Radius (0–48px)
• Number Size & Weight
• Title Size & Weight
• Card Padding: e.g. 28px 20px

• Module Class Suffix: Extra CSS class on this module instance
• Alternative Layout: Override template layout if you provide one
• Extra CSS: Optional CSS; unsafe rules (e.g. @import, expression()) are stripped

Download / update key

• Go to the Download Section
• Log in (or register) with the purchase email
• Copy the license / download key for Counters

Common issues

• Nothing on the page: Module published? Correct position and menu assignment?
• Not in page source: View source and search for jx-counters. If missing, the module is not assigned to that page.
• Changes not showing: System → Clear Cache after saving.
• No animation: Scroll until counters are in view. Check the browser console for JS errors. Prefer a hard refresh after updating assets.
• Numbers look jumpy: Update to 2.0+ (width-locked count-up). Reduce Number Size in Appearance for large values like 125,000.
• Inside an article: See Joomla docs — module inside an article.