Skip to main content

​
Allgemeine Beschreibung

Der Call to Action PWA-Portlet zeigt einen Installations-Button, mit dem Besucher deine Progressive Web App (PWA) direkt auf ihrem Endgerät installieren können. Du kannst frei entscheiden, wie und wo der Button dargestellt wird, um die Installationsrate zu steigern.
Hinweis: Die eigentlichen Einstellungen für die Progressive Web App selbst (Icon, App-Konfiguration, Push Notifications etc.) findest du im Plugin DZM PWA. Dieses Portlet dient lediglich der Darstellung des Installations-Buttons im OnPage-Composer.

​
Featureübersicht

Wähle zwischen einem einfachen Button, einer Topbar oder einer Image Box als Installations-Button Typ.
Passe Text, Typ, Farbe und Breite des Buttons individuell an dein Design an.
Lege die Ausrichtung des Buttons für jeden Breakpoint (XS bis XL) separat fest.
Ergänze den Button optional um ein Icon, das vor oder nach dem Text angezeigt wird.

​
Settings

​
Darstellung

​
select
Wähle die Darstellungsform des Installations-Buttons.Optionen:
  • Einfacher Button: Klassischer Call-to-Action-Button
  • Topbar: Installationshinweis als Leiste am oberen Seitenrand
  • Image Box: Installationshinweis als Box mit Bild
Einfacher Button
Für den einfachen Button gibt es keine weiteren Einstellungen auf dieser Ansicht – Text, Farbe und Breite legst du unter Button Einstellungen fest.

​
Beispiele im Frontend

Beispiel Einfacher Button

​
Button Einstellungen

Button Einstellungen
​
string
default:"Mehr erfahren"
Der Text, der auf dem Button angezeigt wird.
​
select
default:"Full"
Legt die Darstellung des Buttons fest.Optionen:
  • Full: Vollflächig
  • Outlined: Farblich umrandet
  • Plain Text: Nur Schrift
​
select
default:"Primary"
Legt fest, welchem Farbschema der Button folgen soll. Die Farbe richtet sich nach den eingestellten Farben des Templates.
​
select
default:"Content Width"
Legt fest, wie breit der Button sein soll.Optionen:
  • Content Width: So breit wie der Text
  • Full Width: So breit wie der umliegende Container
​
select
default:"links"
Lege die Ausrichtung des Buttons für jeden Breakpoint (XS, SM, MD, LG, XL) separat fest.
​
select
default:"Nach dem Text"
Legt fest, an welcher Position das Icon relativ zum Button-Text angezeigt wird.
​
boolean
default:"false"
Entscheide, ob ein Icon zusätzlich zum Button-Text angezeigt werden soll.