Anwendung –
Übersicht Komponenten
Übersicht Komponenten
Diese Seite bietet eine Übersicht aller Komponenten einer Anwendungsseite – am Beispiel der Anwendung AC/DC Ladestationen.
Über den Button "Zur Konfiguration" gelangt man zu einer Erläuterung, anhand derer die jeweilige Komponente im Detail erstellt, konfiguriert und somit auf der Seite eingefügt werden kann.
Header with Slanted Image
Die Anwendungsseite beginnt immer mit einem Header with Slanted Image.
Die Komponente besteht aus einer Headline, einem einleitenden Text und einem der Schräge angepassten Bild. Der einleitende Text sollte kurz und knapp sein – ausführlichere Informationen können unterhalb des Bildes mit der Komponente "Plain: One Column" weiter ausgeführt werden. Die Hintergrundfarbe des Slants wird auf "Box Grey" eingestellt.
Zur Konfiguration
Plain: One Column (Headline)
Diese Komponente ist eine reine Textkomponente, die an dieser Stelle zur Anzeige einer einspaltigen Überschrift und für den Fließtext darunter verwendet wird.
Zur KonfigurationCards: Three Columns Routing (Special)
Jede einzelne Card dient als Teaser für eine Schutzlösung.
Die Komponente besteht aus einem zur Schutzlösung passenden SVG Icon, einer Headline und einem Text. Über einen Button wird auf die jeweilige Schutzlösung-Seite weitergeleitet.
Plain: One Column (Headline)
Diese Komponente ist eine reine Textkomponente, die an dieser Stelle zur Anzeige einer einspaltigen Überschrift und für den Fließtext darunter verwendet wird.
Zur KonfigurationProduct Slider with Filter
Der Product Slider with Filter, enthält ausgewählte Produkte für die Anwendung, die nach der gewünschten Schutzlösung gefiltert (optional) werden können.
Im unteren Bereich des jeweiligen Produkt-Teasers befinden sich zwei Auswahlmöglichkeiten. Der User kann das Produkt entweder direkt zum Einkaufsmerkzettel hinzufügen (Add) oder detaillierte Informationen über das Produkt erhalten (Details).
Image with Optional Overlay Text
Diese Komponente beinhaltet ein Bild, über das optional Text gelegt werden kann. Die definierte Größe für das Bild ist 2560 x 1440 px.
Wenn das Bild nicht für sich stehen und ein Text eingestellt werden soll, bitte darauf achten, dass der Text nicht zu lang ist und dass das Bild eine gute Lesbarkeit des Textes ermöglicht.
Downloads with Filter
Mithilfe dieser Komponente können Broschüren, Flyer, Schutzvorschläge und weitere Informationen zum Download bereitgestellt werden. Um viele Dokumente sinnvoll zu strukturieren, kann ein Filter eingesetzt werden.
Die Überschrift "Downloads" und der dazugehörige Text oberhalb der Komponente, wird über die Komponente Plain: One Column eingefügt.
Image + Link List
Diese Komponente kombiniert ein Bild auf der einen, mit einer Link-Liste auf der anderen Seite. Headline und Text können optional hinzugefügt werden.
Zur KonfigurationCombo: Image + Text
Diese Komponente kann auf unterschiedliche Art und Weise variiert werden. Kombiniert ein Bild auf der linken Seite, mit einer Headline und einem beschreibenden Text auf der rechten Seite und umgekehrt. Ein Link kann ebenfalls eingestellt werden.
Hinweis: Achtet darauf, dass der Text nicht zu lang ist und bestenfalls die gleiche Höhe wie das Bild auf der anderen Seite hat.
FAQs with Filter
In dieser Komponente können FAQs zum jeweiligen Anwendungsbereich eingestellt werden. Durch das Klicken auf das Pluszeichen, klappt die Antwort aus. Um die FAQ thematisch zu strukturieren, kann ein Filter über das Feld "Filter categories" eingesetzt werden.
Hinweis: Die Überschrift "FAQ" oberhalb der Komponente wird mit der Komponente Plain: One Column eingefügt.
Cards: Three Columns Online Courses / Seminars
Mithilfe der Komponente Cards: Three Columns Online Courses / Seminars, können Onlinekurse, Workshops und Seminare beworben werden. Eine knackige Headline sowie ein kurzer Teasertext werden empfohlen, um den User neugierig zu machen und ihn zum Klicken zu animieren.
Zur Konfiguration
Callback Webform
Oberhalb des Footers und somit die letzte Komponente auf der Seite ist das Rückrufformular Callback Webform. Neben den üblichen Kontaktinformationen wie Telefonnummer und Link zum technischen Support, kann bei Klick auf "Rückruf vereinbaren", ein Formular zur Terminvereinbarung ausgeklappt werden. Die Hintergrundfarbe wird in den "Webform Settings" auf "Off-White" gesetzt.
Zur Konfiguration