PWA and Offline Mode

Learnomy can turn your LMS into an installable app with basic offline support. When it is on, a service worker caches the app shell so the interface still renders without a connection, an offline banner tells students when they have dropped offline, and a web app manifest lets them install Learnomy to their home screen.
What you can do
- Register a site-wide service worker that speeds up static assets and buffers content for offline use.
- Show a small offline banner at the top of the page when a student loses connection, and a "back online" confirmation when it returns.
- Let students install Learnomy as an app through a web app manifest served at
/learnomy-manifest.json. - Serve a themed offline fallback page (
/learnomy-offline/) when a student navigates while offline. - Queue lesson-completion progress made offline and sync it automatically once the connection comes back.
- Turn the whole thing off with one toggle when Learnomy is one section of a larger site where a site-wide service worker is unwanted.
How to use it
Step 1 -- confirm the PWA is on
Go to Learnomy Settings > Settings and find the Progressive Web App card. Enable PWA is on by default. When on, Learnomy registers the service worker and offline mode on Learnomy pages.
Step 2 -- let the service worker register
On the next front-end page load, the browser registers the service worker from /learnomy-sw.js with a scope covering all Learnomy routes. On install it pre-caches the app shell (core CSS and JS, the video player library, and the offline page).
Step 3 -- see offline mode in action
When a student goes offline, an offline banner appears at the top of the page reading that they are offline and changes will sync when they reconnect. Cached pages and assets keep working; a fresh navigation while offline falls back to the themed offline page. When the connection returns, the banner switches to a "back online" message and Learnomy flushes any queued progress.
Step 4 -- install as an app (optional)
Because Learnomy serves a web app manifest at /learnomy-manifest.json, supported browsers offer to install Learnomy to the home screen or desktop, opening it as a standalone app.
When to turn it off
Turn Enable PWA off when Learnomy is embedded in a larger site -- for example a community -- where a site-wide service worker would interfere with the rest of the site. Turning it off drops the service worker, the manifest, and the offline routes.
Settings and options
The single control lives on the Progressive Web App card in Learnomy Settings > Settings.
| Field | What it is |
|---|---|
| Enable PWA | Registers the service worker and offline mode on Learnomy pages. Stored as enable_pwa in learnomy_settings. On by default (treated as on when the key is absent). |
What gets cached, and how:
- App shell (core CSS, core JS modules, the Plyr video library and its CSS) -- cache-first, so the interface renders offline.
- REST API responses (
/wp-json/learnomy/...) -- network-first with a cache fallback, so offline reads still work. - Plugin static assets (
/plugins/learnomy/assets/...) -- cache-first, versioned by file modification time. - Page HTML -- never intercepted. Document navigations always go straight to the network so students and buyers always see the real, current page; a fresh navigation only falls back to the offline page when the network is unreachable.
Offline progress:
- Lesson completions made while offline are queued in the browser (IndexedDB) and replayed to the progress sync endpoint via Background Sync, or on the next page load, when the connection returns.
For developers
Routes (registered in includes/class-routes.php, gated by pwa_enabled()):
service-worker-- served at/learnomy-sw.jswith scope/.pwa-manifest-- served at/learnomy-manifest.json.offline-- the fallback shell at/learnomy-offline/(slug filterable vialearnomy_offline_slug).
When pwa_enabled() is false, all three routes are dropped and the service-worker registration script is not enqueued.
Gating:
Learnomy\pwa_enabled()readslearnomy_settings['enable_pwa'](default true when the key is absent) and is overridable via thelearnomy_enable_pwafilter.
Manifest filters (Router::serve_pwa_manifest()):
learnomy_pwa_app_name,learnomy_pwa_app_short_name,learnomy_pwa_theme_color,learnomy_pwa_icon, andlearnomy_pwa_manifest(the whole manifest array).
Client scripts:
assets/js/sw.js-- the service worker (caching strategies, IndexedDB progress queue, Background Sync replay to/wp-json/learnomy/v1/progress/sync).assets/js/sw-register.js-- registration, online/offline banner, and queue-flush helpers (learnomyQueueProgress).