Alle Seiten
Bereitgestellt von GitBook
1 von 1

Loading...

Button-Teaser

Der ThemeWare® "Button-Teaser" ist unabhängig von seinem CMS-Block. Du kannst den Teaser auch in anderen CMS-Blöcken verwenden. Teste einfach unterschiedliche Blöcke (beispielsweise mit einer unterschiedlichen Spaltenanzahl) aus um deine Erlebniswelt individueller zu gestalten.

ThemeWare® "Button-Teaser"

Wichtig: Dieses Element ist nur in der ThemeWare® Pro Edition verfügbar.


Element konfigurieren

Den ThemeWare® "Button-Teaser" kannst du wie folgt konfigurieren:

  1. Klicke auf den entsprechenden CMS-Block (1) um den Bearbeitungsmodus zu aktivieren

  2. Fahre mit der Maus über das gewünschte CMS-Element

  3. Klicke auf das "Zahnrad"-Icon (2) um das CMS-Element zu konfigurieren

  4. Es öffnet sich das Pop-up "Element-Einstellungen"

  5. Nehme die gewünschten Änderungen vor

  6. Speichere deine Änderungen

Du hast das CMS-Element nun konfiguriert.


Die Konfiguration vom "Button-Teaser" ist recht selbsterklärend. Der Button-Text und das Bild sind Pflichtfelder. Mehr brauchst du genau genommen nicht konfigurieren.

Im Tab "Allgemein" konfigurierst du den Content des Elementes.

Content (Inhalt)

Im Abschnitt "Content" kannst du den Button-Text (2) eingeben. Der Button-Text ist ein Pflichtfeld.

Bild

Im Abschnitt "Bild" definierst du das Hintergrundbild (1) des Teasers. Dies ist ein Pflichtfeld.

Link

Im Abschnitt "Link" definierst du das Ziel des Teasers wenn dieser angeklickt wird.

Im Tab "Layout" kannst du den Button (2) und den Hover-Effekt vom Content und ein Farb-Overlay konfigurieren.

Allgemein

Im Abschnitt "Allgemein" kannst du die allgemeine Hintergrundfarbe (1) konfigurieren.

Button

Im Abschnitt "Button" kannst du den Button-Stil (die Farbe) konfigurieren und festlegen ob der Button (2) gefüllt oder als Outline-Button dargestellt werden soll.

Zudem kannst du die horizontale Ausrichtung und die vertikale Ausrichtung vom Button im Teaser konfigurieren.

Bild

Im Tab "SEO & Pagespeed" kannst du das "Lazy Loading" vom Bild konfigurieren.

Du kannst zwar jedes HTML-Element unserer Teaser über passende CSS-Klassen selektieren, falls du eigene CSS-Klassen nutzen möchtest, kannst du diese im Tab "Erweitert" einfügen.


Anwendungsbeispiele findest du in den ThemeWare® Demoshops:

Im Abschnitt "Bild" kannst die gewünschte horizontale Positionierung des Bildes im Anzeigemodus 'Cover' auswählen.

Hover

Im Abschnitt "Hover" kannst du einen Hover-Effekt für den Inhalt (=Button) auswählen.

Farb-Overlay

Im Abschnitt "Farb-Overlay" kann ein Farb-Overlay aktiviert und konfiguriert werden.

ThemeWare® "Button-Teaser" konfigurieren
Elemente vom "Button-Teaser"

Konfiguration

Allgemein

Layout

SEO & Pagespeed

Erweitert

Hinweis: Bitte beachte, dass Theme-Variablen nicht in der Administration zur Verfügung stehen. Die Button-Farbe der Vorschau wird in der Storefront durch die entsprechenden Theme-Farbe ersetzt.

Demo

Button-TeaserDemostore
ThemeWare® Demoshop => Button-Teaser
Logo