Scroll Indicator is a lightweight WordPress block for adding a “keep scrolling” cue to landing pages, editorial layouts, hero sections, and long-form content.
Site builders can choose an icon style, tune the size and color, add optional text, and let visitors click or keyboard-activate the indicator to move one viewport down the page.
- Five animated icon styles: mouse, arrow, chevron, dots, and hand.
- Preset sizes plus a custom CSS size value.
- Native block editor support for text color, spacing, typography, and alignment.
- Fixed screen positioning and draggable absolute positioning for hero-style sections.
- CSS-only animation that respects
prefers-reduced-motion. - Optional helper text beneath the icon.
- Automatic hide-on-scroll behavior.
- Keyboard-accessible click-to-scroll behavior on the front end.
- No animation libraries or heavy runtime dependencies.
- Download or build the plugin ZIP.
- Upload the ZIP from Plugins → Add Plugin → Upload Plugin in WordPress.
- Activate Scroll Indicator.
- Add the Scroll Indicator block to any post or page.
The human-readable source for the compiled JavaScript and CSS is in src/.
Production assets in compiled/ are generated with @wordpress/scripts.
Install dependencies:
npm installStart the development build:
npm startCreate a production build:
npm run buildCreate a local plugin ZIP:
npm run plugin-zipPressShip is the preferred WordPress.org submission path for this repo:
npx pressship pack .
npx pressship publish . --dry-runnpm run lint:js
npm run lint:css
php -l scroll-indicator.php
npm audit --omit=dev --audit-level=highThe assets/ directory contains WordPress.org plugin directory artwork:
banner-1544x500.pngbanner-772x250.pngicon-256x256.pngicon-128x128.png
These are intended for the WordPress.org SVN assets directory after the plugin is approved. They are not required inside the installable plugin ZIP.
The compiled block files live in compiled/ so PressShip includes them in the installable ZIP by default.
GPLv2 or later.
