PHPackages oliverthiele/ot-countup - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. oliverthiele/ot-countup ActiveTypo3-cms-extension oliverthiele/ot-countup ======================= CE CountUp - TYPO3 content element for animated, viewport-triggered counting statistics (key figures). v1.0.1(yesterday)07↑2471.4%GPL-2.0-or-laterPHP >=8.4 Since Jul 22Compare [ Source](https://github.com/oliverthiele/ot-countup)[ Packagist](https://packagist.org/packages/oliverthiele/ot-countup)[ Docs](https://www.oliver-thiele.de/)[ RSS](/packages/oliverthiele-ot-countup/feed)WikiDiscussions Synced today READMEChangelogDependencies (4)Versions (4)Used By (0) ot\_countup — Animated CountUp Content Element for TYPO3 ======================================================== [](#ot_countup--animated-countup-content-element-for-typo3) Adds a content element with animated, viewport-triggered counting statistics (key figures) to TYPO3. [![TYPO3](https://camo.githubusercontent.com/309a8731f095ee93250b88cfa7d6fbc4e3ed3917cf6b981716e6fd068831654f/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5459504f332d31342e332d6f72616e67652e737667)](https://typo3.org/)[![Packagist Version](https://camo.githubusercontent.com/9ee7d80f736827c51d0230b22ceb4e2e3080b2dc354db3c62b091a0c6724c4b0/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6f6c69766572746869656c652f6f742d636f756e7475702e737667)](https://packagist.org/packages/oliverthiele/ot-countup)[![PHP](https://camo.githubusercontent.com/a48281c3a48610be8e371fe6e21a34bcb35aed5a0cebff15b0e8d76d7fb8f614/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f646570656e64656e63792d762f6f6c69766572746869656c652f6f742d636f756e7475702f7068702e737667)](https://php.net/)[![License](https://camo.githubusercontent.com/fb35056c5bbdf10f88147e4fc5ab988418523e611dadbecfb1f4aa1e60cb77e3/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f6f6c69766572746869656c652f6f742d636f756e7475702e737667)](LICENSE.txt)[![Changelog](https://camo.githubusercontent.com/6bc02a7bc61afc1cb3faaa53420df6d904b9940d7f3e2e11a463e1fdbb3cd52d/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4368616e67656c6f672d4348414e47454c4f472e6d642d626c75652e737667)](CHANGELOG.md) Features -------- [](#features) - Any number of key figures per content element, managed via IRRE - Each key figure counts up from a start to an end value once it scrolls into view - Optional prefix/suffix per key figure (e.g. "ca.", "+", "%", "years") - Optional icon per key figure — works standalone, or with visual icon selection when [`ot-iconselector`](https://packagist.org/packages/oliverthiele/ot-iconselector) is installed, and with rendered SVG icons when [`ot-icons`](https://packagist.org/packages/oliverthiele/ot-icons) is installed - No hard dependency on SiteKit or any icon extension — works in any TYPO3 v14 project - Accessible by default: animated numbers are `aria-hidden`, a visually hidden element exposes the final value immediately, `prefers-reduced-motion` disables the animation - Progressive enhancement: the end value is present in the markup without JavaScript - Ships pre-minified, dependency-free vanilla JavaScript and CSS — no build step required to use the extension Requirements ------------ [](#requirements) RequirementVersionTYPO3^14.3PHP>=8.4Installation ------------ [](#installation) ``` composer require oliverthiele/ot-countup ``` After installation, activate the **Site Set "OtCountup"** for your site in the TYPO3 backend. Configuration ------------- [](#configuration) ### TypoScript [](#typoscript) TypoScript is auto-included via the Site Set. For manual integration without Site Set: ``` @import 'EXT:ot_countup/Configuration/TypoScript/setup.typoscript' ``` ### Optional icon support [](#optional-icon-support) Install [`oliverthiele/ot-iconselector`](https://packagist.org/packages/oliverthiele/ot-iconselector) for a visual icon picker on the `icon_identifier` field, and [`oliverthiele/ot-icons`](https://packagist.org/packages/oliverthiele/ot-icons) to render the selected icon as inline SVG in the frontend. Both are entirely optional — without them, `icon_identifier` is a plain text field and no icon is rendered. ### Template override [](#template-override) To customise the output, override the template in your sitepackage: ``` tt_content.ot_countup.templateRootPaths.10 = EXT:your_sitepackage/Resources/Private/Templates/ ``` The same override mechanism can be used to swap the shipped JS/CSS for assets built by your own project's build pipeline — see `Resources/Private/Bootstrap5/Templates/CountUp.html` for the `f:asset.*` calls to replace. Usage ----- [](#usage) 1. Create a new **CountUp** content element in the TYPO3 backend. 2. Add key figures via the IRRE interface. Each key figure has a label, start/end value, optional prefix/suffix, and an optional icon. 3. Optionally set the animation duration (ms) for the whole element — it applies to every key figure. Development ----------- [](#development) The shipped assets in `Resources/Public/JavaScript/` and `Resources/Public/Css/` are pre-built and committed. The source lives in `Resources/Private/JavaScript/CountUp.ts` (TypeScript) and `Resources/Private/Scss/CountUp.scss`(Sass) — the `.ts`/`.scss` extensions make it explicit that these files need compiling, unlike the portable, build-free JS/CSS convention used elsewhere in this ecosystem. To change them: ``` npm install npm run typecheck # type-check without emitting npm run build # compile + minify to Resources/Public/ ``` This is only needed for maintaining the extension itself — consumers do not need Node.js. License ------- [](#license) GPL-2.0-or-later — © 2026 Oliver Thiele ### Health Score 43 — FairBetter than 89% of packages Maintenance100 Actively maintained with recent releases Popularity6 Limited adoption so far Community2 Small or concentrated contributor base Maturity53 Maturing project, gaining track record How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~0 days Total 2 Last Release 1d ago ### Community Maintainers ![](https://avatars.githubusercontent.com/u/5030298?v=4)[Oliver Thiele](/maintainers/oliverthiele)[@oliverthiele](https://github.com/oliverthiele) --- Tags countertypo3statisticscontent elementcountup ### Code Quality Static AnalysisPHPStan Type Coverage Yes ### Embed Badge ![Health badge](/badges/oliverthiele-ot-countup/health.svg) ``` [![Health](https://phpackages.com/badges/oliverthiele-ot-countup/health.svg)](https://phpackages.com/packages/oliverthiele-ot-countup) ``` ### Alternatives [friendsoftypo3/content-blocks TYPO3 CMS Content Blocks - Content Types API | Define reusable components via YAML 103519.9k57](/packages/friendsoftypo3-content-blocks)[typo3/cms-styleguide TYPO3 extension to showcase TYPO3 Backend capabilities 106760.3k34](/packages/typo3-cms-styleguide)[wazum/sluggi TYPO3 extension for URL slug management with inline editing, auto-sync, locking, access control, and redirects 40529.5k](/packages/wazum-sluggi)[pagemachine/typo3-formlog Form log for TYPO3 23238.6k8](/packages/pagemachine-typo3-formlog)[jweiland/events2 Events 2 - Create single and recurring events 2166.7k3](/packages/jweiland-events2)[in2code/lux Living User eXperience - LUX - the Marketing Automation tool for TYPO3. 2158.6k1](/packages/in2code-lux) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)