List of available native sections and overridable components

2 min read

Sections in FastStore are components that organize and encapsulate other components, enabling you to create cohesive and functional content for your store.

For example, the Hero is a native section designed to capture your brand's identity and messaging. To effective function in the store, the Hero comprises three components: Hero, HeroImage, and HeroHeader.

FastStore native sections

Check out below a list of FastStore native sections, their components that can be overridden, and if there are props that can be changed through the Headless CMS.

Components prefixed with __experimental indicate that they can be overridden. However, it's important to note that their props are not accessible. We advise against overriding these components unless it is really necessary.

Alert

Type	Availability
Documentation	Alert FastStore UI
Overridable components	`Alert` and `Icon`
Headless CMS: props customization	`Icon` `dismissible`

BannerText

Type	Availability
Documentation	Banner Text FastStore UI
Overridable components	`BannerText` `BannerTextContent`
Headless CMS: props customization	`ColorVariant` `Variant`

Breadcrumb

Type	Availability
Documentation	Breadcrumb FastStore UI
Overridable components	`Breadcrumb` `Icon`
Headless CMS: props customization	`Icon (HomeIcon)`

Empty State

Type	Availability
Documentation	Empty State FastStore UI
Overridable components	`EmptyState`
Headless CMS: props customization	Coming soon!

Hero

Type	Availability
Documentation	Hero FastStore UI
Overridable Components	`Hero` `HeroImage` `HeroHeader`
Headless CMS: props customization	`ButtonProps (Label, Icon)` `ColorVariant` `Variant`

Navbar

Type	Availability
Documentation	Navbar FastStore UI
Overridable components	`Navbar` `NavbarLinks` `NavbarLinksList` `NavbarSlider` `NavbarSliderHeader` `NavbarSliderContent` `NavbarSliderFooter` `NavbarHeader` `NavbarRow` `NavbarButtons` `IconButton`
Headless CMS: props customization	NavbarRow: `Logo` NavbarButtons: `SignIn Button Icon`, `Cart Icon` Navigation: `Regionalization Icon`, `Menu Icon`, `Home Icon`

Newsletter

Type	Availability
Documentation	Coming soon!
Overridable components	`ToastIconSuccess` `ToastIconError` `HeaderIcon` `InputFieldName` `InputFieldEmail` `Button`
Headless CMS: props customization	`Icon` `Variant (Lite / Full)`

ProductDetails

Type	Availability
Documentation	FastStore UI
Overridable components	`ProductTitle` `DiscountBadge` `BuyButton` `Icon` `Price` `QuantitySelector` `SkuSelector` `ShippingSimulation` `ImageGallery` `ImageZoom` `__experimentalImageGalleryImage` `__experimentalImageGallery` `__experimentalShippingSimulation`
Headless CMS: props customization	ProductTitle: `showDiscountBadge`, `discountBadgeSize`, `showReferenceNumber` BuyButton: `Icon`

ProductShelf

Type	Availability
Documentation	Product Shelf FastStore UI
Overridable components	`ProductShelf` `__experimentalCarousel` `__experimentalProductCard`
Headless CMS: props customization	Product Card Configuration: `showDiscountBadge`, `bordered`

FastStore native sections.css-17dhml5{min-width:18px;min-height:18px;width:18px;height:18px;}

FastStore native sections