Field type: Select
Available values: • don't use (default) • use individual styling
Example value:
don't use (default)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")"
Technical name:
twt-product-slider-controls-individual
In the tab "Content" you can configure all sliders globally.
Field type: Select
Available values: • Rectangle (default) • Square/Circle
Example value:
Rectangle (default)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-style
Field type: Select
Available values: • not rounded • rounded corners (default) • round corners
Example value:
rounded corners (default)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-corner-type
Field type: Select
Available values: • no effect (default) • fade in
Example value:
fade in
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-hover-type
Field type: Color picker
Example value:
$sw-color-brand-primary
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-color
Field type: Color picker
Example value:
transparent
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-border-color
Field type: Color picker
Example value:
transparent
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-background-color
Field type: Color picker
Example value:
$sw-color-brand-secondary
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-color-hover
Field type: Color picker
Example value:
darken($twt-product-slider-controls-border-color, 10%)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-border-color-hover
Field type: Color picker
Example value:
darken($twt-product-slider-controls-background-color, 7.5%)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Arrow navigation (Individual styling)"
Technical name:
twt-product-slider-controls-background-color-hover
Field type: Color picker
Example value:
rgba(0, 0, 0, 0)
Path to the configuration: Tab "Shopping Experiences" => Block "Product slider (Category "Commerce")" => Section "Product image"
Technical name:
twt-cms-element-product-box
rounded corners Uses the configuration "Border radius". ("Layout" > "Layout" > "Border radius")
round corners Uses a predefined radius for round corners.
Background colour of procuct images in product boxes of shopping experience sliders.