Configuration

Basic configuration

---

Layout type

Field type: Select

Available values: • default • Sales Promoting Navigation

Example value: default

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Basic configuration"

Technical name: twt-header-phone-type

The layout type "Sales Promoting Navigation" moves the navigation to the bottom of the screen for better accessibility on smartphones.

Note: Please use the layout type "default" if a third party plugin does not support the "Sales Promoting Navigation".

---

Maximum width (Logo) @Phone (<576px)

Field type: Text field

Example value: 160

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Basic configuration"

Technical name: twt-header-logo-max-width-mobile

---

Height @Phone (<576px)

Field type: Text field

Example value: 50

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Basic configuration"

Technical name: twt-header-height-mobile

---

Fixed

Field type: Select

Available values: • no • yes

Example value: yes

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Basic configuration"

Technical name: twt-header-phone-fixed

Colour configuration

---

Background colour

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Colour configuration"

Technical name: twt-header-phone-background-color

Action buttons

---

Text colour

Field type: Color picker

Example value: #333333

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-color

---

Text colour @hover

Field type: Color picker

Example value: $sw-color-brand-primary

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-color-hover

---

Icon colour

Field type: Color picker

Example value: #333333

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-icon-color

---

Icon colour @hover

Field type: Color picker

Example value: $sw-color-brand-primary

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-icon-color-hover

---

Border colour

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-border-color

---

Border colour @hover

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-border-color-hover

---

Background colour

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-background-color

---

Background colour @hover

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Action buttons"

Technical name: twt-header-phone-btn-background-color-hover

Sales Promoting Navigation

---

Layout type

Field type: Select

Available values: • default • Clean • Center

Example value: default

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-nav-type

---

Height @Phone (<576px)

Field type: Text field

Example value: 70

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-nav-height

Only available with the active layout type "Sales Promoting Navigation".

---

Logo position @Phone (<576px)

Field type: Select

Available values: • left • center • right

Example value: center

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-logo-position

---

Background colour (Navigation)

Field type: Color picker

Example value: #ffffff

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-nav-background-color

---

Drop shadow

Field type: Text field

Example value: 0 0 20px

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-nav-box-shadow

---

Shadow colour

Field type: Color picker

Example value: rgba(0, 0, 0, 0.1)

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-nav-box-shadow-color

---

Corner type (Action buttons)

Field type: Select

Available values: • default • rounded corners • round corners

Example value: round corners

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-corner-type

rounded corners Uses the configuration "Border radius". (see "Layout" > "Layout" > "Border radius")

round corners Uses a predefined radius for round corners.

---

Show home button (Action button)

Field type: Select

Available values: • no (default) • yes

Example value: no (default)

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-home

---

Order: Home button (Action button)

Field type: Number field

Example value: 100

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-home-order

---

Order: Navigation button (Action button)

Field type: Number field

Example value: 200

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-navigation-order

---

Order: Search button (Action button)

Field type: Number field

Example value: 300

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-search-order

---

Order: Cart button (Action button)

Field type: Number field

Example value: 400

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-cart-order

---

Order: Wishlist button (Action button)

Field type: Number field

Example value: 500

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-wishlist-order

---

Order: Account button (Action button)

Field type: Number field

Example value: 600

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-btn-account-order

---

Cart button highlighting

Field type: Select

Available values: • no • yes

Example value: yes

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-cart-btn-highlighting

Only available with the active layout type "Sales Promoting Navigation".

---

Search flyout position

Field type: Select

Available values: • top (default) • bottom

Example value: bottom

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Sales Promoting Navigation"

Technical name: twt-header-phone-search-flyout-position

Basic headers "Header 1" and "Header 2"

---

Show hamburger menu label @Phone (<576px)

Field type: Select

Available values: • don't show • show

Example value: show

Path to the configuration: Tab "Header" => Block "Mobile header" => Section "Basic headers "Header 1" and "Header 2""

Technical name: twt-header-phone-nav-main-toggle-label-show