Joomla module
Meet Wayfin.
A menu that knows where you are, and swims along to prove it.
Wayfin reads your page's headings and builds a sticky "on this page" menu by itself. It highlights the section you're in, fills a little water level as you read, and sends a small orange fish along the rail to keep you company. See that strip on the right edge? That's it, built from this page.
Why it exists
Long pages lose people.
A table of contents at the top of the page scrolls away with the first flick of a thumb. After that, readers are on their own: no idea how far they've come, how far is left, or how to get back to the bit they wanted.
Wayfin stays put. It shows where you are, how much is left to read, and gets you anywhere on the page in one click or one keypress. It builds itself from the headings you already wrote, so there's nothing to maintain.
What's in the box
Small fish. Big pond.
Builds itself
No menu to maintain
Reads your h1, h2 and h3 headings, adds IDs where they're missing, and turns existing IDs into tidy menu labels.
Where am I
Always knows the spot
Highlights the current section, fills a water level down the rail, and counts down the minutes left to read.
Groups
Long menus fold up
Sections become labelled groups, and only the one you're reading stays open. The rest tuck away until you get there.
Heed & ignore
You decide what counts
Add a module, a demo or a form to the menu with one attribute. Keep asides and noisy modules out with another.
The swimmer
Pick your companion
A fish, clownfish, pufferfish or shark. Or Tancho the horse, Hawke the goat, or your own image. Read more, gather a school.
Sonar
Land, then look
After every jump, rings pulse out from the heading so your eye lands in the right place. A soft sonar blip if you want one.
Memory
Picks up where you left off
Returning readers can swim straight back to their spot, and read sections get a check. All stored in their browser, and one click on Quit school wipes it.
Accessibility
Everyone gets the map
Real links and buttons, [ and ] to hop sections, clean names for screen readers, and reduced-motion respect throughout.
Where it earns its keep
Anywhere people scroll.
Guides
Docs, how-tos and policies people jump around in.
Long reads
Articles and stories, with a timer that shows what's left.
Landing pages
Like this one. Every section one click away.
FAQs & changelogs
Find the one answer you came for, fast.
For the technical crowd
Under the hood.
- Works with
- Joomla 5.4 and Joomla 6, PHP 8.1+, any template. No backward-compatibility plugins needed.
- Dependencies
- None. No jQuery, UIkit or Bootstrap JavaScript.
- Weight
- About 12 KB of JavaScript and 5 KB of CSS, gzipped, loaded once through Joomla's Web Asset Manager.
- Placement
- Sticky in any module position, or fixed to the left or right edge. Full menu or a slim lateral line that opens on hover.
- Phones
- A slim bar under your header shows the current section; tap it for the full list.
- Memory
- Position and read markers live in the visitor's own browser for 30 days (adjustable). Nothing is sent to your server.
- Events
wayfin:jump,wayfin:read,wayfin:finishand friends, ready for Matomo or Google Analytics. No tracking built in.- Theming
- Cream, ink or bare, an accent colour picker, CSS custom properties, and standard Joomla template overrides.
Ready to dive in?
Want Wayfin on your site? Take it, or let's talk.
Wayfin
Changelog.
1.3.2
Stable · October 2026A keyboard-order fix, checked with real Tab and Shift+Tab alongside A11ytoolbar 1.5.3.
- When it's fixed to the window edge, or showing as the phone bar, Wayfin now comes right after the skip link and the A+ button for keyboard users, instead of after the whole page. In a sidebar it stays where it is.
Earlier releases
1.3.1Quit school & minimize
- Quit school: readers can wipe their read markers, school and saved place for a page, and start fresh.
- Minimize: tuck the menu into a round tab with the swimmer inside. It stays tucked away across the site until they bring it back.
- The Bare theme gets a clean white card when it floats over the page.
- Fix: a reader's place could be saved again right after they cleared it.
1.3.0The school
- School of fish: every section read adds a small follower to the swimmer.
- Tancho and Hawke join the swimmer list as the horse and the goat.
- Mobile Bar Top setting, so the phone bar sits flush under your header.
- The swimmer now faces the way the page scrolls, even while groups fold and unfold.
- Minified script and stylesheet; readable sources ship alongside.
- And a little something for the curious.
1.2.2Offset fix
- Fix: template scripts that hijack
#linkclicks (T4's smooth scroll among them) could override Wayfin's jump and ignore the Link Offset. Wayfin now claims its own clicks first.
1.2.1Ping sound
- Ping Sound: a soft sonar blip with an echo, generated in the browser, with a volume setting.
- Swim back button keeps 4.5:1 contrast on hover.
1.2.0Eight new extras
- Swimmer picker, bubble trail and a finish flourish at the end of the page.
- Sonar ping on the heading after every jump.
- Welcome back and read markers, stored only in the visitor's browser.
- Lateral line menu style: a slim rail that opens on hover, focus or tap.
- Events for analytics: jump, read, finish, copy and resume.
1.1.xHeadings & heed
- h1 support, with indenting that follows the levels actually on the page.
- Heed: add non-heading items, like a module's wrapper, to the menu.
- Fold groups, trim end punctuation and a minutes left timer.
- Headings with a copy-link hook keep a clean name for screen readers.
1.0.0First release
- Self-building menu from h2 and h3, with IDs added where missing and labels taken from existing IDs.
- Separators for busy sections, scroll highlighting, link offset, fade-in from any side.
- Swimming fish, reading progress, copy-link hooks, back to top and [ ] keys.
- Mobile top bar, and standalone demo included.
