Navigation

ThemeWare® Handbuch

Konfiguration

Basiskonfiguration


Darstellungsart

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• Standard
• Verkaufsfördernde Navigation

Beispiel Wert:
Standard

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Basiskonfiguration"

Technischer Name:
twt-header-phone-type

Die Darstellungsart "Verkaufsfördernde Navigation" verschiebt die Navigation an den unteren Bildschirmrand für eine bessere Zugänglichkeit auf Smartphones.

Hinweis: Nutze einfach die Darstellungsart "Standard" falls ein Plugin Dritter nicht mit der "Verkaufsfördernde Navigation" harmoniert.


Maximale Breite (Logo) @Phone (<576px)

Feldtyp:
Textfeld

Beispiel Wert:
160

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Basiskonfiguration"

Technischer Name:
twt-header-logo-max-width-mobile


Höhe (Header) @Phone (<576px)

Feldtyp:
Textfeld

Beispiel Wert:
50

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Basiskonfiguration"

Technischer Name:
twt-header-height-mobile

Nur verfügbar bei der aktiver Darstellungsart "Verkaufsfördernde Navigation".


Fixiert

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• nein
• ja

Beispiel Wert:
ja

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Basiskonfiguration"

Technischer Name:
twt-header-phone-fixed

Farbkonfiguration


Hintergrundfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Farbkonfiguration"

Technischer Name:
twt-header-phone-background-color

Aktions-Buttons


Textfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
#333333

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-color


Textfarbe @hover

Feldtyp:
Farbauswahl

Beispiel Wert:
$sw-color-brand-primary

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-color-hover


Iconfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
#333333

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-icon-color


Iconfarbe @hover

Feldtyp:
Farbauswahl

Beispiel Wert:
$sw-color-brand-primary

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-icon-color-hover


Rahmenfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-border-color


Rahmenfarbe @hover

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-border-color-hover


Hintergrundfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-background-color


Hintergrundfarbe @hover

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Aktions-Buttons"

Technischer Name:
twt-header-phone-btn-background-color-hover

Verkaufsfördernde Navigation


Darstellungsart

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• Standard
• Clean
• Center

Beispiel Wert:
Standard

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-nav-type


Höhe (Navigation) @Phone (<576px)

Feldtyp:
Textfeld

Beispiel Wert:
70

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-nav-height

Nur verfügbar bei der aktiver Darstellungsart "Verkaufsfördernde Navigation".


Logo-Position @Phone (<576px)

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• Links
• Mitte
• Rechts

Beispiel Wert:
Mitte

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-logo-position


Hintergrundfarbe (Navigation)

Feldtyp:
Farbauswahl

Beispiel Wert:
#ffffff

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-nav-background-color


Schlagschatten

Feldtyp:
Textfeld

Beispiel Wert:
0 0 20px

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-nav-box-shadow


Schattenfarbe

Feldtyp:
Farbauswahl

Beispiel Wert:
rgba(0, 0, 0, 0.1)

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-nav-box-shadow-color


Ecken (Aktions-Buttons)

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• Standard
• abgerundete Ecken
• runde Ecken

Beispiel Wert:
runde Ecken

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-corner-type

abgerundete Ecken
Verwendet die Konfiguration "Abgerundete Ecken". (siehe "Layout" > "Layout" > "Abgerundete Ecken")

runde Ecken
Verwendet einen vordefinierten Radius für runde Ecken.


Home-Button anzeigen (Aktions-Button)

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• nein (Standard)
• ja

Beispiel Wert:
nein (Standard)

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-home


Reihenfolge: Home-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
100

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-home-order


Reihenfolge: Navigation-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
200

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-navigation-order


Reihenfolge: Suchen-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
300

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-search-order


Reihenfolge: Warenkorb-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
400

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-cart-order


Reihenfolge: Merkzettel-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
500

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-wishlist-order


Reihenfolge: Mein-Konto-Button (Aktions-Button)

Feldtyp:
Nummernfeld

Beispiel Wert:
600

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-btn-account-order


Warenkorb-Button hervorheben

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• nein
• ja

Beispiel Wert:
ja

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Darstellungsart 'Verkaufsfördernde Navigation'"

Technischer Name:
twt-header-phone-cart-btn-highlighting

Nur verfügbar bei der aktiver Darstellungsart "Verkaufsfördernde Navigation".

Basis-Header "Header 1" and "Header 2"


Hamburger-Menü Text anzeigen @Phone (<576px)

Feldtyp:
Auswahlfeld

Verfügbare Werte:
• nicht anzeigen
• anzeigen

Beispiel Wert:
anzeigen

Pfad zur Einstellung:
Tab "Header" => Bereich "Mobiler Header" => Abschnitt "Basis-Header ('Header 1' und 'Header 2')"

Technischer Name:
twt-header-phone-nav-main-toggle-label-show

Zuletzt aktualisiert am

Diese Seite im Netz: https://doku.themeware.design/handbuch/header/mobiler-header/konfiguration · ThemeWare® Service Portal, service.themeware.design