Account
mittl medien | Webentwicklung in Stuttgart

miTT PWA (Progressive Web App) für Joomla

Erweiterung der Joomla Webseite um eine Progressive Web App, installierbar und offlinefähig

miTT PWA
Progressive Web App
Joomla Plugin

Mit dem miTT PWA Plugin für Joomla mutiert die Joomla Webseite zur ein installiebaren Mobile- und Desktop Applikation. "Appifizieren" Sie Ihre Joomla Webseite zu einer App, egal ob miTT PWA, miTT PWA FIRE PUSH oder miTT PWA ONE PUSH.

miTT PWA

  • ✔️ installierbar auf dem Smarthphone oder Desktop
  • ✔️ Installationshinweis Android
  • ✔️ iOS Install Hinweis
  • ✔️ eigener PWA Installations Button
  • ✔️ Zeitintervall für die PWA Aktualisierung
  • ✔️ Hintergrund Aktualisierung für Beiträge (HTML) und Bilder
  • ✔️ Installations-Statistik PWA

Webseiten Ladezeitoptimierung

  • ✔️ Offline Nutzung
  • ✔️ Fallback Offlineseite
  • ✔️ Cache First
  • ✔️ Network First
  • ✔️ Cache Strategie abhängig von Internet Verbindung
  • ✔️ Statischer Cache
  • ✔️ CDN Support für externe Dateien
  • ✔️ Cache Ausnahmen

Push Nachrichten

  • ✖️ kein Support für Push Nachrichten
Weiter zum Kauf!

miTT PWA FIRE PUSH

  • ✔️ installierbar auf dem Smarthphone oder Desktop
  • ✔️ Installationshinweis Android
  • ✔️ iOS Install Hinweis
  • ✔️ eigener PWA Installations Button
  • ✔️ Zeitintervall für die PWA Aktualisierung
  • ✔️ Hintergrund Aktualisierung für Beiträge (HTML) und Bilder
  • ✔️ Installations-Statistik PWA

Webseiten Ladezeitoptimierung

  • ✔️ Offline Nutzung
  • ✔️ Fallback Offlineseite
  • ✔️ Cache First
  • ✔️ Network First
  • ✔️ Cache Strategie abhängig von Internet Verbindung
  • ✔️ Statischer Cache
  • ✔️ CDN Support für externe Dateien
  • ✔️ Cache Ausnahmen

Push Nachrichten

  • ✔️ Firebase Cloud Messaging
  • ✔️ Versand von Push Nachrichten aus dem Joomla Beitrag
  • ✔️ K2, FLEXIcontent, Virtuemart Support
  • ✔️ unterstützt wird Chrome, Firefox, Edge, Android, Windows, Linux, OSX
Weiter zum Kauf!

miTT PWA ONE PUSH

  • ✔️ installierbar auf dem Smarthphone oder Desktop
  • ✔️ Installationshinweis Android
  • ✔️ iOS Install Hinweis
  • ✔️ eigener PWA Installations Button
  • ✔️ Zeitintervall für die PWA Aktualisierung
  • ✔️ Hintergrund Aktualisierung für Beiträge (HTML) und Bilder
  • ✔️ Installations-Statistik PWA

Webseiten Ladezeitoptimierung

  • ✔️ Offline Nutzung
  • ✔️ Fallback Offlineseite
  • ✔️ Cache First
  • ✔️ Network First
  • ✔️ Cache Strategie abhängig von Internet Verbindung
  • ✔️ Statischer Cache
  • ✔️ CDN Support für externe Dateien
  • ✔️ Cache Ausnahmen

Push Nachrichten

  • ✔️ One Signal Integration
  • ✔️ Versand von Push Nachrichten über One Signal Platform
  • ✔️ unterstützt wird Chrome, Firefox, Edge, Android, Windows, Linux, OSX
Weiter zum Kauf!

Eine PWA kann verschiedene Einsatzgebiete haben, die Vorteile als mobile installierbare App, aber auch Desktopapplikation eingesetzt werden. Als Einzigartigkeit bietet miTT PWA für Joomla bietet die volle Kontrolle über die Einstellung des Cache, Network First, Cache First, Cache Ausnahmen und Statischer Cache, sowie de Gestaltung der Offline Seite.

Bei der Wahl von miTT PWA (Progressive Web App für Joomla) ist das Key Feature die Verwaltung des Caches. Diese Funktion und weitere Merkmale werden in Zukunft weiter ausgebaut.

In der Dokumentation wird der Vorgang zur Einrichtung des Plugins beschrieben, so dass Sie von den Vorteilen profitieren können. Für miTT PWA Fire Push ( Dokumentation Fire Push) und miTT PWA ONE PUSH (Dokumentation One Push) sind die speziellen Einstellungen separat dokumentiert. Für die notwendigen Schritte zur Installation gibt es ein Video auf Englisch: Wie richte ich eine mobile App in Joomla mit miTT PWA (Progressive Web App) ein?

Für Fragen steht Ihnen der Support zur Verfügung. Das Joomla miTT PWA Plugin ist in JED (Joomla Extensions Directory) gelistet.

Joomla miTT PWA (Progressive Web App) installieren

Mit Joomla zur mobilen Web App (PWA)

Sobald der Benutzer mit einen Android Smartphone die Webseite aufruft, zeigt der Browser den Hinweis an, ob man die Webseite dem Startbildschirm hinzufügen will an. Nach Klick wird ein neues Pop Up erzeugt, um diese PWA den Gerät hinzuzufügen.

Je nach Browser, kann es sein, dass diese Meldung erst nach einem wiederholtem Aufruf erscheint. Der Google Chrome Browser zeigt auf den Desktop Rechnern auch einen "Installieren Button" in der Browsereingabezeile rechts an.

Es wäre auch möglich einen eigenen "Installationsbutton" auf der Webseite bzw. mobile Web App zu platzieren, um die Installation der Progressive Web App zu triggern.

iOS Install Banner (PWA)

Auf iOS wird keine automatischer Banner zur Installation angezeigt, sowie es besteht noch keine Möglichkeit die Installation durch einen Button zu ermöglichen. Abhilfe schafft ein Notizbanner, welche auf die Installationsmöglichkeit der PWA (Progressive Web App) hinweist. Wenn kein Installationshinweis erwünscht ist, kann auch die "Install Prompt" der PWA verhindert oder eine eigene Installations Button hinzugefügt werden.

Joomla miTT PWA (Progressive Web App) installieren
Joomla miTT PWA (Progressive Web App) installieren

Starten Sie Joomla als PWA (Progressvie Web App) auf Android und iOs

Wie jede App wird dies mit "Touch" auf das von Ihnen vorher im Joomla Plugin konfigurierte Icon gestartet. Beim Öffnen der App wird wie gewohnt ein Splash Screen mit Logo und Hintergrund, welcher über das Plugin konfiguriert wird.

Für Ansicht der eigentlichen App sind verschiedene Ansichten einstellbar, von "fullscreen", "minimal-ui", "standalone" oder "browser" einstellbar.

PWA App Kurzbefehle (App Shortcuts)

App Shortcuts sind Verknüpfungen, um schnell in der der PWA Teile der App erreichen zu können.
Der Benutzer erreicht die App Shortcuts entweder über Rechtlklick der Desktop Applikation oder langem Touch auf dem Android Smartphone. (Unterstützung ab Chrome Version 84)

Joomla miTT PWA (Progressive Web App) installieren
Joomla miTT PWA (Progressive Web App) installieren

Web App Info

Nach der Installation kann man bei Android nicht unterscheiden, wie die App installiert wurde. Die App mutiert dementsprechend zur nativen App.

Es wird der gewohnte App-Info Screen mit den Informationen, Speicherbelegung und Benachrichtigung pro Woche, sowie die Möglichkeit zu Deinstallieren aufgezeigt.

Optimale Performance für den Benutzer

miTT PWA für Joomla unterstützt die Cache API des Browsers. Der Service Worker sorgt dafür, dass Statische Files, Bilder, Webfont und der Inhalte der Seiten in den "Service Workers" Cache des Browsers gelegt werden. Dieser Cache ist statisch und performant und zudem kontrollierbar im Gegensatz zum "Memory Cache" des Browser.
Es besteht die Möglichkeit zwischen Network First, Cache First oder je nach der Qualität der effektiven Internetverbindung für das Laden der Seiteninhalte zu wählen. Dadurch wird diese PWA Komponente einzigartig und eine optimale Performance beim Besucher ist garantiert.

Joomla miTT PWA (Progressive Web App) installieren
Joomla miTT PWA (Progressive Web App) installieren

Besseres Offline Erlebnis mit Periodic Background Sync der mobilen Joomla App (PWA)

Bei regelmäßig wechselnden Inhalten wie z. B. bei News kann es sinnvoll sein, Inhalte im Hintergrund zu aktualisieren. Somit hat der Benutzer bei keiner oder schlechten Internetverbindung immer Zugriff auf die neuesten Inhalte. Der Benutzer der mobilen Web-App bekommt hier nichts mit, darf sich aber über die offline verfügbaren Inhalte erfreuen. Ein weiteres Feature, welches der PWA ein natives App Feeling verleiht.

Unterstützt wird dieses Feature momentan von Browsern, welche auf Chromium basieren. Dazu zählen Chrome und Microsoft Edge.

Wie richtet man eine mobile App in Joomla mit miTT PWA (Progressive Web App) ein?

Ein kurzes Video, wie man das miTT PWA Plugin in Joomla einrichtet.

JAB20 – Progressive Web App - Why should you use this technique, which possibilities do you have?

On the Joomla Conference JandBeyond I had a presentation about PWA. This lecture shows the possibilities of a PWA, as well as the technical functioning of a Progressive Web App.

Dokumentation miTT PWA

Die Einrichtung der Progressive Web App miTT PWA in Joomla

Lesen Sie mehr...

FAQ miTT PWA

Häufig gestellte Fragen zu miTT PWA - Progressive Web App für Joomla

Lesen Sie mehr...

Dokumentation miTT PWA FIRE PUSH

erweiterte Einstellungen für miTT PWA FIRE PUSH

Lesen Sie mehr...

Dokumentation miTT PWA ONE PUSH

erweiterte Einstellungen für miTT PWA ONE PUSH

Lesen Sie mehr...

Weitere Artikel zum Thema PWA (Progressive Web App)

Progressive Web App unverzichtbar für jede Webseite?

Eine PWA bietet viele Vorteile gegenüber einer klassischen Webseite.

Lesen Sie mehr...

JoomlaDay Vortrag PWA

Mein Vortrag auf dem JoomlaDay in Wien "Zeige mir Deine Offline Seite (PWA)" Wien zeige ich die Erstellung einer Progressiven Web App anhand eines Beispiels auf.

Lesen Sie mehr...

PWA for Commune

Realisierung der Progressive Web App mit Push Nachrichten in Joomla für eine Kommune.

Lesen Sie mehr...

PWA Scope


Der Scope der Progressiven Web App kann bei der Registrierung des Service Workers definiert werden.

Lesen Sie mehr...