cecil / theme-pwa
Cecil component theme PWA
Fund package maintenance!
ArnaudLigny
Open Collective
Installs: 6 759
Dependents: 3
Suggesters: 0
Security: 0
Stars: 0
Watchers: 0
Forks: 0
Language:Twig
Type:cecil-theme
Requires
- cecil/theme-installer: ^1.4||^2.0
- 2.x-dev
- dev-master / 2.x-dev
- 2.19.2
- 2.19.1
- 2.19.0
- 2.18.1
- 2.18.0
- 2.17.0
- 2.16.1
- 2.16.0
- 2.15.3
- 2.15.2
- 2.15.1
- 2.15.0
- 2.14.2
- 2.14.1
- 2.14.0
- 2.13.1
- 2.13.0
- 2.12.2
- 2.12.1
- 2.12.0
- 2.11.1
- 2.11.0
- 2.10.2
- 2.10.1
- 2.10.0
- 2.9.1
- 2.9.0
- 2.8.0
- 2.7.7
- 2.7.6
- 2.7.5
- 2.7.4
- 2.7.3
- 2.7.2
- 2.7.1
- 2.7.0
- 2.6.2
- 2.6.1
- 2.6.0
- 2.5.1
- 2.5.0
- 2.4.0
- 2.3.3
- 2.3.2
- 2.3.1
- 2.3.0
- 2.2.0
- 2.1.3
- 2.1.2
- 2.1.1
- 2.1.0
- 2.0.5
- 2.0.4
- 2.0.3
- 2.0.2
- 2.0.1
- 2.0.0
- 1.x-dev
- 1.19.0
- 1.18.1
- 1.18.0
- 1.17.2
- 1.17.1
- 1.17.0
- 1.16.0
- 1.15.4
- 1.15.3
- 1.15.2
- 1.15.1
- 1.15.0
- 1.14.4
- 1.14.3
- 1.14.2
- 1.14.1
- 1.14.0
- 1.13.7
- 1.13.6
- 1.13.5
- 1.13.4
- 1.13.3
- 1.13.2
- 1.13.1
- 1.13.0
- 1.12.6
- 1.12.5
- 1.12.4
- 1.12.3
- 1.12.2
- 1.12.1
- 1.12.0
- 1.11.1
- 1.11.0
- 1.10.1
- 1.10.0
- 1.9.6
- 1.9.5
- 1.9.4
- 1.9.3
- 1.9.2
- 1.9.1
- 1.9.0
- 1.8.2
- 1.8.1
- 1.8.0
- 1.7.1
- 1.7.0
- 1.6.2
- 1.6.1
- 1.6.0
- 1.5.2
- 1.5.1
- 1.5.0
- 1.4.1
- 1.4.0
- 1.3.1
- 1.3.0
- 1.2.0
- 1.1.0
- 1.0.0
This package is auto-updated.
Last update: 2025-07-23 19:45:34 UTC
README
The PWA component theme for Cecil provides helpers to implement a Web manifest and a service worker to turn a website into a Progressive Web App.
Features
- Generated and configurable Web manifest
- Generated and configurable service worker
- Automatic caching of visited resources
- No dependencies, vanilla JavaScript
- Precaching of assets and published pages
- Offline support and image placeholder
- Custom install button support instead of browser prompt
Prerequisites
- A Cecil website
- A supported browser
- HTTPS
Installation
composer require cecil/theme-pwa
Or download the latest archive and uncompress its content in
themes/pwa
.
Usage
Add pwa
in the theme
section of the config.yml
:
theme: - pwa
Add the following line in the HTML <header>
of the main template:
{{ include('partials/pwa.html.twig', {site}, with_context = false) }}
Web manifest
Configure web manifest options:
manifest: background_color: '#FFFFFF' theme_color: '#202020' icons: - icon-192x192.png - icon-512x512.png - src: icon-192x192-maskable.png purpose: maskable - src: icon-512x512-maskable.png purpose: maskable
Note
The icons
section is optional. If not provided, the theme will generate a default set of icons based on the icon.png
file in the assets directory of your website.
Tip
Create your own maskable icons with Maskable.app.
Web manifest Optional
Add shortcuts from the main
menu entries:
manifest: shortcuts: true
Provide installer screenshots:
manifest: screenshots: - screenshots/desktop.png - screenshots/mobile.png
Service worker
Enable the service worker:
serviceworker: enabled: true
Service worker Optional
Disable browser install prompt, and use custom install button:
serviceworker: install: prompt: false button: '#install-button' # query selector
<button id="install-button" hidden>Install App</button>
Icons are precached by default. To disable this behavior:
serviceworker: install: precache: icons: false
By default all published pages are precached. To limit this number:
serviceworker: install: precache: pages: limit: 10
Set list of precached assets:
serviceworker: install: precache: assets: - logo.png
Display a snackbar on update and connection lost:
serviceworker: update: snackbar: true offline: snackbar: true
Define ignored paths:
serviceworker: ignore: - name: 'cms' path: '/admin'
Do not precache a specific page (through its front matter):
--- serviceworker: precache: false ---