What is trait

When you drag and drop a widget that renders an associated component, you’ll see different options on the side panel. These options include checkboxes for ‘show/hide’ headings, dropdowns for ‘heading size’ options, a ‘color-picker’ for heading color, and some default options provided by the Experro Storefront. These options are known as traits within the Experro Storefront. Here in below image you can see options for the hero-carousel component.

Here you can see the some Trait’s for the hero-carousel, like,

Trait	Description
CONTENT_MODEL_POP_UP	This trait takes a content model internal name as a configuration value and displays a list of records associated with that content model. It provides the selected Content Model records data as props to a component within the cms-library, effectively integrating the component with the widget.
TEXT	It’s a simple text input where any value entered will be passed as a prop to a component.
CHECKBOX	It provides the value ‘on’ if the checkbox is selected and ‘off’ if the checkbox is unchecked.
DROPDOWN	It displays multiple values to select from, accepting an options array of JSON where each object has the structure name: ‘Name to Show’, value: ‘Value which you will get in component’ .
COLOR_PICKER	A simple color picker provides the selected color’s hex value in the component’s props.

Here, we comprehend the concept of traits; let’s delve into How we can effectively utilize them.

Types of traits Blog

Getting Started

Overview

Theme Components

Create Custom Widget

Theme Templates

Experro CLI

Other