Hero (Klassisch)
Der klassische Hero ist ein seitenweites Feld auf Seiten-Ebene (nicht im content-Array). Er unterstützt title, subtitle und einen optionalen button. Varianten: klein (SM, Standard) oder gross (LG, nur Startseite). Optionale Felder: image, highlighted, reverse. Als Seitentyp kann er auch mehrere Slides (slides[]) enthalten.
Karte (Card)
Die Card-Komponente eignet sich für thematisch gruppierte Inhalte mit optionalem Titel, optionalem Untertitel (subtitle), Bild, Textinhalt (body) und Aktionsbuttons. Erlaubte body-Inhalte: paragraph, list, link, table.
Beispielkarte mit Bild und Buttons
Cards können Texte, Listen und Tabellen enthalten. Über das buttons-Feld lassen sich ein oder mehrere Aktionsbuttons hinzufügen.
Karte mit Titel und Untertitel (subtitle)
Optionaler Untertitel unterhalb des Titels
Das subtitle-Feld erscheint unterhalb des Haupttitels der Karte.
Bild mit Text (ImageSplit)
ImageSplit teilt den Inhaltsbereich in zwei Hälften: Bild und Text. Mit reverse true erscheint das Bild rechts statt links. Weitere optionale Varianten: type TESTIMONIAL (kreisförmiges Bild, zentriertes Layout – für Zitate oder Personenvorstellungen), highlighted content (blauer Inhaltsbereich) oder full-width (gesamter Block blau), startPosition true (Inhalt oben ausrichten statt mittig), subtitle (optionaler Untertitel).
Bild links, Text rechts (Standard)
Die ImageSplit-Komponente eignet sich für Produktvorstellungen, Testimonials oder thematische Abschnitte mit visueller Unterstützung. Optional kann ein Link-Button unterhalb des Textes hinzugefügt werden.
Bild rechts, Text links (reverse true)
Mit reverse true erscheint das Bild auf der rechten Seite und der Text auf der linken. Ideal für abwechslungsreiche Seitenlayouts, bei denen mehrere ImageSplit-Blöcke untereinander erscheinen.
Karte (Map)
Map bettet eine Google Maps-Ansicht für einen Standort ein. Der Wert von location wird als Suchanfrage an die Google Maps Embed API übergeben. Felder: location (erforderlich, zweisprachig).
Link-Kacheln (LinkTiles)
LinkTiles rendert eine Gruppe anklickbarer Kacheln, optional mit Icons links/rechts und farbigem Hintergrund. Mit cols 2 erscheinen die Kacheln in zwei Spalten (Standardwert: cols 1, einspaltiger Stapel).
Grid mit Topics
Das Grid mit topics rendert Icon-Links in einem konfigurierbaren Raster (maxCols 1–4). Topics sind einfache Navigationselemente mit Icon und Text.
Themenübersicht (Grid Topics)
Grid mit Blocks
Das Grid mit blocks rendert anklickbare Bildkacheln. Mit contentInsideBlock true liegt der Text über dem Bild, mit false darunter.
Anleitung (InstructionCard)
InstructionCards eignen sich für schrittweise Anleitungen. Sie bestehen aus optionalem Icon, optionalem Titel und einem Anweisungstext.
Schritt 1 – Online-Antrag ausfüllen
Füllen Sie das Online-Formular aus und laden Sie die erforderlichen Dokumente (Lohnausweis, Ausweiskopie) direkt beim Antrag hoch.
Schritt 2 – Antrag wird geprüft
Unser Team prüft Ihren Antrag und gibt Ihnen in der Regel innerhalb von 1–2 Werktagen eine Rückmeldung.
Schritt 3 – Vertrag unterzeichnen
Sie erhalten den Vertrag per Post. Nach Unterzeichnung und Ablauf der gesetzlichen Widerrufsfrist von 14 Tagen wird der Betrag ausgezahlt.
Grid mit CardBlocks
Das Grid mit cardBlocks rendert Text-Kacheln mit optionalem Titel (inkl. Icon und Farboptionen) und optionalem Absatz (inkl. Icon). Ideal für Vorteils- oder Schritt-Übersichten. Verfügbare titleIconColor-Werte: black, green, blue. paragraphIconColor: black, green.
Schnelle Abwicklung
Antwort innerhalb von 1–2 Werktagen nach Einreichung der Unterlagen.
Flexibel & anpassbar
Laufzeit und Betrag können individuell auf Ihre Bedürfnisse angepasst werden.
Vollständig online – kein Besuch einer Filiale erforderlich.
Grid mit Banners – BannerTable
Das Grid mit banners rendert Produktkarten mit 16:9-Bild-Header. BannerTable zeigt eine preisvergleichende Zeilen-Tabelle mit alternierenden Zeilenhintergründen, optionalem Badge (label) und einer Preis-Fusszeile. Icons: check_circle (grün) oder check_indeterminate_small (grau). Jeder Banner benötigt zwingend entweder table oder insurance.
Basic
Premium
Grid mit Banners – BannerInsurance
Die BannerInsurance-Variante zeigt Versicherungsoptionen mit Titel, Beschreibung und strukturierten Leistungsabschnitten (optionSections), jeweils mit Titel und Bullet-Liste.
CarProtect Basic
- Unfallschutz bis CHF 50'000
- Pannenhilfe 24/7
CardBlock – Mehrere Absätze (paragraphs, 1 Spalte)
Mit dem paragraphs-Array kann eine CardBlock-Kachel mehrere Absätze mit optionalem Fett-Label und Text darunter enthalten. Zusammen mit maxCols 1 und dem automatisch reduzierten gap werden die Kacheln kompakt untereinander dargestellt.
Warum sich Cembra CyberProtect lohnt
Stellen Sie sich vor:
Sie erhalten eine SMS, angeblich von einem Paketdienst. Sie klicken auf die SMS, weil es eilig aussieht. Kurz darauf werden mehrere hundert Franken von Ihrer Kreditkarte abgebucht. Ein klarer Fall einer Phishing-Attacke.
Mit Cembra CyberProtect sind die finanziellen Folgen bis CHF 5'000.– gedeckt.
Sie bestellen online ein neues Tablet – und erhalten ein beschädigtes Gerät. Der Händler reagiert nicht und der Versanddienst weigert sich, die Verantwortung zu übernehmen.
CardBlock – Zeilen mit Icons (rows, ohne Seitenbild)
Mit dem rows-Array kann eine CardBlock-Kachel Zeilen mit einem Icon (mit Hintergrund), einem fetten Label und einem optionalen Link darstellen. Ideal für Schritt-für-Schritt- Anleitungen.
So funktioniert es im Schadenfall
CardBlock – Zeilen mit Icons und Seitenbild
Mit sideImage und imagePosition right oder left erscheint neben den rows ein Bild. Der Inhalt nimmt flex-1 ein, das Bild circa ein Drittel der Kachelbreite.
So funktioniert es im Schadenfall
Grid mit blauem Hintergrund (background blue)
Mit background blue erhält der gesamte Grid-Block einen blauen Hintergrund. Erlaubte Werte für background: white, blue. Kombinierbar mit allen Grid-Inhaltstypen (topics, blocks, cardBlocks, banners).
Vorteil 1
Schnelle Bearbeitung innerhalb von 1–2 Werktagen.
Vorteil 2
Vollständig online – kein Filialbesuch nötig.
Vorteil 3
Transparente Konditionen ohne versteckte Kosten.
Karussell mit Überschrift (heading)
Das optionale heading-Feld fügt eine Überschrift oberhalb des Karussells ein. Es enthält nur title (kein type – das Feld wird auf das Carousel abgestimmt). Alle anderen Carousel-Felder gelten weiterhin: highlighted, size (sm/md), cards.
Unsere Kennzahlen
Karussell – Bild-VCards (Image VCards)
Die dritte VCard-Variante im Carousel verwendet ein Bild (image.src + image.alt) und einen Textblock. Mit href wird die Kachel als Link gerendert. Ohne href erscheint sie als nicht-klickbares div. Felder: image.src, image.alt, text, href (optional).