[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides faststore building sections list of native sections in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/components-index)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/storefront-features-overview)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-overview)

[Section override](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/overrides-overview)

[Section override - Use cases](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/override-use-cases-overview)

[Creating a new section](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-creating-a-new-section)

[List of native sections and overridable components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections)

[Experimental exports - Hooks and Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-experimental-exports-hooks-and-components)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/components-index)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/storefront-features-overview)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-overview)

[Section override](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/overrides-overview)

[Section override - Use cases](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/override-use-cases-overview)

[Creating a new section](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-creating-a-new-section)

[List of native sections and overridable components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections)

[Experimental exports - Hooks and Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-experimental-exports-hooks-and-components)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/storefront-best-practices)

---

[Storefront development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/storefront-development)

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-overview)

List of Native Sections and Overridable Components

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](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-hero) is a native section designed to capture your brand's identity and messaging. To effectively function in the store, the Hero comprises three components: `Hero`, `HeroImage`, and `HeroHeader`.

## Considerations while customizing default components

Overriding certain FastStore components can affect the store’s behavior. For example, customizing `__experimentalProductCard` and `SearchInput` can impact your store's analytics tracking. These components collect data for the [Intelligent Search Analytics](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/analytics--6qRMAHDL9hvv3oE0bh8mA1), so it's crucial to maintain their tracking functionality when making modifications.

See below how customizing certain components can affect your store.

### `__experimentalProductCard`

**Impacted sections:** [ProductGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections%23productgallery) and [ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections%23productshelf).

To ensure that click events on this component continue to be recorded after overriding the component, use the [useProductLink\_unstable hook](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-experimental-exports-hooks-and-components%23hooks). For more information on how to use the `useProductLink_unstable` hook and how to add it to the component, see the [Experimental exports - Hooks and Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-experimental-exports-hooks-and-components).

> For reference, view the default [ProductCard](https://read.calvincode.net/reader?url=https://github.com/vtex/faststore/blob/91d2669f5d390da4a3889f9c12948290c213866d/packages/core/src/components/product/ProductCard/ProductCard.tsx%23L88) implementation on GitHub.

### `SearchInput`

**Impacted section:** [Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections%23navbar)

Customizing the `SearchInput` may affect the tracking of search events. To maintain this functionality, you'll need to ensure that search events are logged even after modifications to the component.

1. Add the following code to the custom component you are overriding (based on the default [SearchInput](https://read.calvincode.net/reader?url=https://github.com/vtex/faststore/blob/94f1d5be2e0fa11a98a5b6a08f0d68a8eb2bd95b/packages/core/src/components/search/SearchInput/SearchInput.tsx%23L62) component):

`1

const sendAnalytics = async (term: string) => {

2

 import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {

3

 sendAnalyticsEvent<SearchEvent>({

4

 name: 'search',

5

 params: { search_term: term },

6

 })

7

 })

8

}

`

1. Within the custom component, make sure the `sendAnalytics` function is called whenever a user enters a search term. The following code is an example calling the `sendAnalytics` function based on the [FastStore default implementation](https://read.calvincode.net/reader?url=https://github.com/vtex/faststore/blob/94f1d5be2e0fa11a98a5b6a08f0d68a8eb2bd95b/packages/core/src/components/search/SearchInput/SearchInput.tsx%23L102). Adjust the code to suit your specific context as needed.

`1

const onSearchSelection: SearchProviderContextValue['onSearchSelection'] = (

2

 term,

3

 path

4

) => {

5

 addToSearchHistory({ term, path })

6

 sendAnalytics(term)

7

 setSearchDropdownVisible(false)

8

}

`

## 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, their props are not accessible. **We do not recommend** overriding these components unless it is necessary.

### Alert

| Type                              | Availability                                                                                |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [Alert](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-alert)[Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/reference-icons) |
| Headless CMS: props customization | Icon dismissible                                                                                |

**Alert - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "schema": {

4

 "title": "Add the Section name",

5

 "description": "Short description for the section's purpose",

6

 "type": "object",

7

 "required": ["icon", "content", "dismissible"],

8

 "properties": {

9

 "icon": {

10

 "type": "string",

11

 "title": "Icon",

12

 "enumNames": [

13

 "Bell",

14

 "BellRinging",

15

 "Checked",

16

 "Info",

17

 "Truck",

18

 "User"

19

 ],

20

 "enum": ["Bell", "BellRinging", "Checked", "Info", "Truck", "User"]

21

 },

22

 "content": { "type": "string", "title": "Content" },

23

 "link": {

24

 "title": "Link",

25

 "type": "object",

26

 "properties": {

27

 "text": { "type": "string", "title": "Link Text" },

28

 "to": { "type": "string", "title": "Action link" }

29

 }

30

 },

31

 "dismissible": {

32

 "type": "boolean",

33

 "default": false,

34

 "title": "Is dismissible?"

35

 }

36

 }

37

 }

38

 }

`

---

### BannerText

| Type                              | Availability                                                                                |
| --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Overridable components            | [BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-banner-text) [BannerTextContent](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-banner-text%23banner-text-content) |
| Headless CMS: props customization | ColorVariant Variant                                                                                |

**BannerText - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

 {

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["title", "caption", "link"],

9

 "properties": {

10

 "title": {

11

 "title": "Title",

12

 "type": "string"

13

 },

14

 "caption": {

15

 "title": "Caption",

16

 "type": "string"

17

 },

18

 "link": {

19

 "title": "Call to Action",

20

 "type": "object",

21

 "required": ["text", "url"],

22

 "properties": {

23

 "text": {

24

 "title": "Text",

25

 "type": "string"

26

 },

27

 "url": {

28

 "title": "URL",

29

 "type": "string"

30

 },

31

 "linkTargetBlank": {

32

 "type": "boolean",

33

 "title": "Open link in new window?",

34

 "default": false

35

 }

36

 }

37

 },

38

 "colorVariant": {

39

 "type": "string",

40

 "title": "Color variant",

41

 "enumNames": ["Main", "Light", "Accent"],

42

 "enum": ["main", "light", "accent"]

43

 },

44

 "variant": {

45

 "type": "string",

46

 "title": "Variant",

47

 "enumNames": ["Primary", "Secondary"],

48

 "enum": ["primary", "secondary"]

49

 }

50

 }

51

 }

52

 }

`

---

### Breadcrumb

| Type                              | Availability                                                                                |
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [Breadcrumb](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-breadcrumb)[Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon) |
| Headless CMS: props customization | Icon (HomeIcon)                                                                                |

**Breadcrumb - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": ["pdp", "plp"],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["icon", "alt"],

9

 "properties": {

10

 "icon": {

11

 "title": "Icon",

12

 "type": "string",

13

 "enumNames": ["House"],

14

 "enum": ["House"]

15

 },

16

 "alt": {

17

 "title": "Alternative Label",

18

 "type": "string"

19

 }

20

 }

21

 }

22

 }

`

---

---

### CrossSellingShelf

| Type                              | Availability                                                                                |
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-product-shelf)\_\_experimentalCarousel\_\_experimentalProductCard |
| Headless CMS: props customization | title kind                                                                                |

**CrossSellingShelf - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": ["pdp", "custom"],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["title", "numberOfItems", "kind"],

9

 "properties": {

10

 "title": {

11

 "title": "Title",

12

 "type": "string"

13

 },

14

 "numberOfItems": {

15

 "title": "Total number of items",

16

 "type": "integer",

17

 "default": 5,

18

 "description": "Total number of items. The quantity may be smaller if the query returns fewer products."

19

 },

20

 "itemsPerPage": {

21

 "type": "integer",

22

 "title": "Number of items per page",

23

 "default": 5,

24

 "description": "Number of items to display per page in carousel"

25

 },

26

 "kind": {

27

 "title": "Kind",

28

 "description": "Change cross selling types",

29

 "default": "buy",

30

 "enum": ["buy", "view"],

31

 "enumNames": ["Who bought also bought", "Who saw also saw"]

32

 },

33

 "taxesConfiguration": {

34

 "title": "Taxes Configuration",

35

 "type": "object",

36

 "properties": {

37

 "usePriceWithTaxes": {

38

 "title": "Should use taxes to calculate the price?",

39

 "type": "boolean",

40

 "default": false

41

 },

42

 "taxesLabel": {

43

 "title": "Tax label to be displayed",

44

 "type": "string",

45

 "default": "Tax included"

46

 }

47

 }

48

 }

49

 }

50

 }

51

},

`

---

### EmptyState

| Type                              | Availability                                                                          |
| --------------------------------- | ------------------------------------------------------------------------------------- |
| Overridable components            | [EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state) |
| Headless CMS: props customization | title titleIcon variant bkgColor                                                      |

**Empty State - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "schema": {

4

 "title": "Add the Section name",

5

 "type": "object",

6

 "description": "Short description for the the section's purpose",

7

 "properties": {

8

 "title": {

9

 "title": "Title",

10

 "type": "string"

11

 },

12

 "titleIcon": {

13

 "title": "Title Icon",

14

 "type": "object",

15

 "properties": {

16

 "icon": {

17

 "title": "Icon",

18

 "type": "string",

19

 "enumNames": ["CircleWavy Warning"],

20

 "enum": ["CircleWavyWarning"]

21

 },

22

 "alt": {

23

 "title": "Alternative Label",

24

 "type": "string"

25

 }

26

 }

27

 },

28

 "subtitle": {

29

 "title": "Subtitle",

30

 "type": "string"

31

 },

32

 "showLoader": {

33

 "type": "boolean",

34

 "title": "Show loader?",

35

 "default": false

36

 },

37

 "errorState": {

38

 "title": "Error state used for shown errorId and fromUrl properties in 500 and 404 pages",

39

 "type": "object",

40

 "properties": {

41

 "errorId": {

42

 "title": "errorId used in 500 and 404 pages",

43

 "type": "object",

44

 "properties": {

45

 "show": {

46

 "type": "boolean",

47

 "title": "Show errorId in the end of message?"

48

 },

49

 "description": {

50

 "type": "string",

51

 "title": "Description shown before the errorId"

52

 }

53

 }

54

 },

55

 "fromUrl": {

56

 "title": "fromUrl used in 500 and 404 pages",

57

 "type": "object",

58

 "properties": {

59

 "show": {

60

 "type": "boolean",

61

 "title": "Show fromUrl in the end of message?"

62

 },

63

 "description": {

64

 "type": "string",

65

 "title": "Description shown before the fromUrl"

66

 }

67

 }

68

 }

69

 }

70

 }

71

 }

72

 }

73

}

`

---

### Hero

| Type                              | Availability                                                                                |
| --------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable Components            | [Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-hero) [HeroImage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-hero%23heroimage) [HeroHeader](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-hero%23heroheader) |
| Headless CMS: props customization | ButtonProps (Label, Icon) ColorVariant Variant                                                                                |

**Hero - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

 {

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["title"],

9

 "properties": {

10

 "title": { "title": "Title", "type": "string" },

11

 "subtitle": { "title": "Subtitle", "type": "string" },

12

 "link": {

13

 "title": "Call to Action",

14

 "type": "object",

15

 "properties": {

16

 "text": { "type": "string", "title": "Text" },

17

 "url": { "type": "string", "title": "URL" },

18

 "linkTargetBlank": {

19

 "type": "boolean",

20

 "title": "Open link in new window?",

21

 "default": false

22

 }

23

 }

24

 },

25

 "image": {

26

 "type": "object",

27

 "title": "Image",

28

 "properties": {

29

 "src": {

30

 "type": "string",

31

 "title": "Image",

32

 "widget": { "ui:widget": "media-gallery" }

33

 },

34

 "alt": { "type": "string", "title": "Alternative Label" }

35

 }

36

 },

37

 "colorVariant": {

38

 "type": "string",

39

 "title": "Color variant",

40

 "enumNames": ["Main", "Light", "Accent"],

41

 "enum": ["main", "light", "accent"]

42

 },

43

 "variant": {

44

 "type": "string",

45

 "title": "Variant",

46

 "enumNames": ["Primary", "Secondary"],

47

 "enum": ["primary", "secondary"]

48

 }

49

 }

50

 }

51

 }

`

---

### Navbar

| Type                              | Availability                                                                                |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar) [NavbarLinks](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-navbar-links) [NavbarLinksList](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-navbar-links%23navbar-links-list) [NavbarSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar-slider) [NavbarSliderHeader](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar-slider%23navbar-slider-header) [NavbarSliderContent](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar-slider%23navbar-slider-content) [NavbarSliderFooter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar-slider%23navbar-slider-content) [NavbarHeader](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar%23navbar-header) [NavbarRow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar%23navbar-row) [NavbarButtons](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-navbar%23navbar-buttons) [IconButton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-icon-button)\_experimentalButtonSignIn: Overriding this prop will prevent the default redirect to the /account page.\_\_experimentalSKUMatrixSidebar: Overriding this prop customizes the Quick Order SKU selection sidebar in the Navbar, improving the bulk add-to-cart process for B2B use cases. |
| Headless CMS: props customization | NavbarRow: LogoNavbarButtons: SignIn Button Icon, Cart IconNavigation: Regionalization Icon, Menu Icon, Home Icon                                                                                |

**Navbar - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "required": ["logo"],

8

 "properties": {

9

 "logo": {

10

 "title": "Logo",

11

 "type": "object",

12

 "required": ["src"],

13

 "properties": {

14

 "src": {

15

 "title": "Image",

16

 "type": "string",

17

 "widget": { "ui:widget": "media-gallery" }

18

 },

19

 "alt": { "title": "Alternative Label", "type": "string" },

20

 "link": {

21

 "title": "Logo Link",

22

 "type": "object",

23

 "required": ["url", "title"],

24

 "properties": {

25

 "url": { "title": "Link URL", "type": "string" },

26

 "title": { "title": "Link Title", "type": "string" }

27

 }

28

 }

29

 }

30

 },

31

 "searchInput": {

32

 "title": "Search Input",

33

 "description": "Search Input configurations",

34

 "type": "object",

35

 "required": ["sort"],

36

 "properties": {

37

 "sort": {

38

 "title": "Results default sort value",

39

 "type": "string",

40

 "default": "score_desc",

41

 "enumNames": [

42

 "Price, descending",

43

 "Price, ascending",

44

 "Top sales",

45

 "Name, A-Z",

46

 "Name, Z-A",

47

 "Release date",

48

 "Discount",

49

 "Relevance"

50

 ],

51

 "enum": [

52

 "price_desc",

53

 "price_asc",

54

 "orders_desc",

55

 "name_asc",

56

 "name_desc",

57

 "release_desc",

58

 "discount_desc",

59

 "score_desc"

60

 ]

61

 }

62

 }

63

 },

64

 "signInButton": {

65

 "title": "Sign In Button",

66

 "type": "object",

67

 "properties": {

68

 "icon": {

69

 "title": "Icon",

70

 "type": "object",

71

 "properties": {

72

 "icon": {

73

 "title": "Icon",

74

 "type": "string",

75

 "enumNames": ["User"],

76

 "enum": ["User"],

77

 "default": "User"

78

 },

79

 "alt": {

80

 "title": "Alternative Label",

81

 "type": "string",

82

 "default": "User"

83

 }

84

 }

85

 },

86

 "label": {

87

 "title": "Call to Action",

88

 "type": "string",

89

 "default": "Sign In"

90

 },

91

 "myAccountLabel": {

92

 "title": "My Account Label",

93

 "type": "string",

94

 "default": "My Account"

95

 }

96

 }

97

 },

98

 "cartIcon": {

99

 "title": "Cart Icon",

100

 "type": "object",

101

 "properties": {

102

 "icon": {

103

 "title": "Icon",

104

 "type": "string",

105

 "enumNames": ["Shopping Cart"],

106

 "enum": ["ShoppingCart"],

107

 "default": "ShoppingCart"

108

 },

109

 "alt": {

110

 "title": "Alternative Label",

111

 "type": "string",

112

 "default": "Shopping Cart"

113

 }

114

 }

115

 },

116

 "navigation": {

117

 "title": "Navigation",

118

 "type": "object",

119

 "properties": {

120

 "regionalization": {

121

 "type": "object",

122

 "title": "Regionalization",

123

 "properties": {

124

 "enabled": {

125

 "type": "boolean",

126

 "title": "Use Regionalization?",

127

 "default": true

128

 },

129

 "icon": {

130

 "title": "Icon",

131

 "type": "object",

132

 "properties": {

133

 "icon": {

134

 "title": "Icon",

135

 "type": "string",

136

 "enumNames": ["Map Pin"],

137

 "enum": ["MapPin"],

138

 "default": "MapPin"

139

 },

140

 "alt": {

141

 "title": "Alternative Label",

142

 "type": "string",

143

 "default": "MapPin"

144

 }

145

 }

146

 },

147

 "label": {

148

 "title": "Call to Action",

149

 "type": "string",

150

 "default": "Set Location"

151

 }

152

 }

153

 },

154

 "pageLinks": {

155

 "title": "Links",

156

 "type": "array",

157

 "maxItems": 8,

158

 "items": {

159

 "title": "Link",

160

 "type": "object",

161

 "required": ["text", "url"],

162

 "properties": {

163

 "text": { "title": "Link Text", "type": "string" },

164

 "url": { "title": "Link URL", "type": "string" }

165

 }

166

 }

167

 },

168

 "menu": {

169

 "type": "object",

170

 "title": "Menu",

171

 "properties": {

172

 "icon": {

173

 "title": "Icon",

174

 "type": "object",

175

 "properties": {

176

 "icon": {

177

 "title": "Icon",

178

 "type": "string",

179

 "enumNames": ["List"],

180

 "enum": ["List"],

181

 "default": "List"

182

 },

183

 "alt": {

184

 "title": "Alternative Label",

185

 "type": "string",

186

 "default": "List"

187

 }

188

 }

189

 }

190

 }

191

 },

192

 "home": {

193

 "title": "Home",

194

 "type": "object",

195

 "properties": {

196

 "label": {

197

 "title": "Go to Home Label",

198

 "type": "string",

199

 "default": "Go to Home"

200

 }

201

 }

202

 }

203

 }

204

 }

205

 }

206

 }

207

 }

`

---

### Newsletter

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

**Newsletter - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["title"],

9

 "properties": {

10

 "icon": {

11

 "title": "Icon",

12

 "type": "object",

13

 "properties": {

14

 "icon": {

15

 "title": "Icon",

16

 "type": "string",

17

 "enumNames": ["Envelope"],

18

 "enum": ["Envelope"],

19

 "default": "Envelope"

20

 },

21

 "alt": {

22

 "type": "string",

23

 "title": "Alternative Label",

24

 "default": "Envelope"

25

 }

26

 }

27

 },

28

 "title": {

29

 "title": "Title",

30

 "type": "string",

31

 "default": "Get News and Special Offers!"

32

 },

33

 "description": {

34

 "title": "Description",

35

 "type": "string",

36

 "default": "Receive our news and promotions in advance"

37

 },

38

 "privacyPolicy": {

39

 "title": "Privacy Policy Disclaimer",

40

 "type": "string",

41

 "widget": { "ui:widget": "draftjs-rich-text" }

42

 },

43

 "emailInputLabel": {

44

 "title": "Email input label",

45

 "type": "string",

46

 "default": "Your Email"

47

 },

48

 "displayNameInput": {

49

 "title": "Request name?",

50

 "type": "boolean",

51

 "default": true

52

 },

53

 "nameInputLabel": {

54

 "title": "Name input label",

55

 "type": "string",

56

 "default": "Your Name"

57

 },

58

 "subscribeButtonLabel": {

59

 "title": "Subscribe button label",

60

 "type": "string",

61

 "default": "Subscribe"

62

 },

63

 "subscribeButtonLoadingLabel": {

64

 "title": "Subscribe button loading label",

65

 "type": "string",

66

 "default": "Loading..."

67

 },

68

 "card": {

69

 "title": "Newsletter should be in card format?",

70

 "type": "boolean",

71

 "default": false

72

 },

73

 "colorVariant": {

74

 "title": "Color variant",

75

 "type": "string",

76

 "enumNames": ["Main", "Light", "Accent"],

77

 "enum": ["main", "light", "accent"],

78

 "default": "main"

79

 },

80

 "toastSubscribe": {

81

 "title": "Toast Subscribe",

82

 "type": "object",

83

 "properties": {

84

 "title": {

85

 "title": "Title",

86

 "description": "Message Title",

87

 "type": "string",

88

 "default": "Hooray!"

89

 },

90

 "message": {

91

 "title": "Message",

92

 "description": "Message",

93

 "type": "string",

94

 "default": "Thank for your subscription."

95

 },

96

 "icon": {

97

 "title": "Icon",

98

 "type": "string",

99

 "enumNames": ["CircleWavyCheck"],

100

 "enum": ["CircleWavyCheck"],

101

 "default": "CircleWavyCheck"

102

 }

103

 }

104

 },

105

 "toastSubscribeError": {

106

 "title": "Toast Subscribe Error",

107

 "type": "object",

108

 "properties": {

109

 "title": {

110

 "title": "Title",

111

 "description": "Message Title",

112

 "type": "string",

113

 "default": "Oops."

114

 },

115

 "message": {

116

 "title": "Message",

117

 "description": "Message",

118

 "type": "string",

119

 "default": "Something went wrong. Please Try again."

120

 },

121

 "icon": {

122

 "title": "Icon",

123

 "type": "string",

124

 "enumNames": ["CircleWavyWarning"],

125

 "enum": ["CircleWavyWarning"],

126

 "default": "CircleWavyWarning"

127

 }

128

 }

129

 }

130

 }

131

 }

132

 }

`

---

### ProductDetails

| Type                              | Availability                                                                                |
| --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [ProductTitle](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-product-title)[DiscountBadge](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-discount-badge)[BuyButton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-buy-button)[Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon)[QuantitySelector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-quantity-selector)[SkuSelector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-sku-selector)[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation)[ImageGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-image-gallery)[ImageGalleryViewer](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-image-gallery) \_\_experimentalImageGalleryImage \_\_experimentalImageGallery \_\_experimentalShippingSimulation \_\_experimentalProductDetailsSettings |
| Headless CMS: props customization | ProductTitle: showDiscountBadge, discountBadgeSize, showReferenceNumberBuyButton: Icon                                                                                |

**Product Details - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": ["pdp"],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "properties": {

9

 "productTitle": {

10

 "title": "Product Title",

11

 "type": "object",

12

 "properties": {

13

 "discountBadge": {

14

 "title": "Discount Badge",

15

 "type": "object",

16

 "properties": {

17

 "showDiscountBadge": {

18

 "title": "Show Discount Badge?",

19

 "type": "boolean",

20

 "default": false

21

 },

22

 "size": {

23

 "title": "Size",

24

 "type": "string",

25

 "enumNames": ["Big", "Small"],

26

 "enum": ["big", "small"]

27

 }

28

 }

29

 },

30

 "refNumber": {

31

 "title": "Show Reference Number?",

32

 "type": "boolean",

33

 "default": false

34

 }

35

 }

36

 },

37

 "buyButton": {

38

 "title": "Buy Button",

39

 "type": "object",

40

 "properties": {

41

 "title": {

42

 "title": "Title",

43

 "type": "string",

44

 "default": "Add to Cart"

45

 },

46

 "icon": {

47

 "title": "Icon",

48

 "type": "object",

49

 "properties": {

50

 "icon": {

51

 "title": "Icon",

52

 "type": "string",

53

 "enumNames": ["Shopping Cart"],

54

 "enum": ["ShoppingCart"]

55

 },

56

 "alt": {

57

 "type": "string",

58

 "title": "Alternative Label",

59

 "default": "Shopping Cart"

60

 }

61

 }

62

 }

63

 }

64

 },

65

 "notAvailableButton": {

66

 "title": "Not Available Button",

67

 "description": "Shown when a SKU is not available",

68

 "type": "object",

69

 "properties": {

70

 "title": {

71

 "title": "Title",

72

 "type": "string",

73

 "default": "Not Available"

74

 }

75

 }

76

 },

77

 "shippingSimulator": {

78

 "title": "Shipping Simulation",

79

 "type": "object",

80

 "properties": {

81

 "title": {

82

 "title": "Title",

83

 "type": "string",

84

 "default": "Shipping"

85

 },

86

 "inputLabel": {

87

 "title": "Input Label",

88

 "type": "string",

89

 "default": "Postal Code"

90

 },

91

 "link": {

92

 "title": "Postal Code Discovery",

93

 "type": "object",

94

 "properties": {

95

 "text": {

96

 "title": "Link Text",

97

 "type": "string",

98

 "default": "I don't know my Postal Code"

99

 },

100

 "to": { "title": "URL", "type": "string" }

101

 }

102

 },

103

 "shippingOptionsTableTitle": {

104

 "title": "Shipping Options Table Header",

105

 "type": "string"

106

 }

107

 }

108

 },

109

 "productDescription": {

110

 "title": "Product Description",

111

 "type": "object",

112

 "properties": {

113

 "initiallyExpanded": {

114

 "type": "string",

115

 "title": "Initially Expanded?",

116

 "enumNames": ["First", "All", "None"],

117

 "enum": ["first", "all", "none"]

118

 },

119

 "displayDescription": {

120

 "title": "Should display description?",

121

 "type": "boolean",

122

 "default": true

123

 },

124

 "title": {

125

 "title": "Description section title",

126

 "type": "string",

127

 "default": "Description"

128

 }

129

 }

130

 }

131

 }

132

 }

133

 }

`

---

### ProductGallery

| Type                              | Availability                                                                                |
| --------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Documentation                     | [FastStore UI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/components)                                                                                |
| Overridable components            | MobileFilterButton [(Button)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-button) FilterIcon [(Icon)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon) PrevIcon [(Icon)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon) ResultsCountSkeleton [(Skeleton)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-skeleton) SortSkeleton [(Skeleton)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-skeleton) FilterButtonSkeleton [(Skeleton)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-skeleton) LinkButtonPrev [(LinkButton)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-link-button) LinkButtonNext [(LinkButton)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-link-button) \_\_experimentalFilterDesktop \_\_experimentalFilterSlider \_\_experimentalProductCard \_\_experimentalEmptyGallery |
| Headless CMS: props customization | Previous Page Button: IconMobile Filter Button: IconProduct Card Configuration: showDiscountBadge, bordered                                                                                |

**Product Gallery - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": ["plp", "search"],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["filter"],

9

 "properties": {

10

 "searchTermLabel": {

11

 "title": "Search page term label",

12

 "type": "string",

13

 "default": "Showing results for:"

14

 },

15

 "totalCountLabel": {

16

 "title": "Total count label",

17

 "type": "string",

18

 "default": "Results"

19

 },

20

 "previousPageButton": {

21

 "title": "Previous page button",

22

 "type": "object",

23

 "required": ["icon", "label"],

24

 "properties": {

25

 "icon": {

26

 "title": "Icon",

27

 "type": "object",

28

 "properties": {

29

 "icon": {

30

 "title": "Icon",

31

 "type": "string",

32

 "enumNames": ["ArrowLeft"],

33

 "enum": ["ArrowLeft"],

34

 "default": "ArrowLeft"

35

 },

36

 "alt": {

37

 "title": "Alternative label",

38

 "type": "string",

39

 "default": "Arrow Left icon"

40

 }

41

 }

42

 },

43

 "label": {

44

 "title": "Previous page button",

45

 "type": "string",

46

 "default": "Previous Page"

47

 }

48

 }

49

 },

50

 "loadMorePageButton": {

51

 "title": "Load more products Button",

52

 "type": "object",

53

 "required": ["label"],

54

 "properties": {

55

 "label": {

56

 "title": "Load more products label",

57

 "type": "string",

58

 "default": "Load more products"

59

 }

60

 }

61

 },

62

 "filter": {

63

 "title": "Filter",

64

 "type": "object",

65

 "required": ["title", "mobileOnly"],

66

 "properties": {

67

 "title": {

68

 "title": "Filter title",

69

 "type": "string",

70

 "default": "Filters"

71

 },

72

 "mobileOnly": {

73

 "title": "Mobile Only",

74

 "type": "object",

75

 "required": [

76

 "filterButton",

77

 "clearButtonLabel",

78

 "applyButtonLabel"

79

 ],

80

 "properties": {

81

 "filterButton": {

82

 "title": "Show filter button",

83

 "type": "object",

84

 "required": ["label", "icon"],

85

 "properties": {

86

 "label": {

87

 "title": "Label",

88

 "type": "string",

89

 "default": "Filters"

90

 },

91

 "icon": {

92

 "title": "Icon",

93

 "type": "object",

94

 "required": ["icon", "alt"],

95

 "properties": {

96

 "icon": {

97

 "title": "Icon",

98

 "type": "string",

99

 "enumNames": ["FadersHorizontal"],

100

 "enum": ["FadersHorizontal"],

101

 "default": "FadersHorizontal"

102

 },

103

 "alt": {

104

 "title": "Alternative label",

105

 "type": "string",

106

 "default": "Open Filters"

107

 }

108

 }

109

 }

110

 }

111

 },

112

 "clearButtonLabel": {

113

 "title": "Clear button label",

114

 "type": "string",

115

 "default": "Clear All"

116

 },

117

 "applyButtonLabel": {

118

 "title": "Apply button label",

119

 "type": "string",

120

 "default": "Apply"

121

 }

122

 }

123

 }

124

 }

125

 },

126

 "productCard": {

127

 "title": "Product Card Configuration",

128

 "type": "object",

129

 "properties": {

130

 "showDiscountBadge": {

131

 "title": "Show discount badge?",

132

 "type": "boolean",

133

 "default": true

134

 },

135

 "bordered": {

136

 "title": "Cards should be bordered?",

137

 "type": "boolean",

138

 "default": true

139

 }

140

 }

141

 },

142

 "emptyGallery": {

143

 "title": "Empty Gallery",

144

 "type": "object",

145

 "properties": {

146

 "title": {

147

 "title": "Title",

148

 "type": "string",

149

 "default": "Nothing matches with your search"

150

 },

151

 "firstButton": {

152

 "title": "First Button",

153

 "type": "object",

154

 "properties": {

155

 "label": {

156

 "type": "string",

157

 "title": "Label",

158

 "default": "Browse Offers"

159

 },

160

 "url": {

161

 "type": "string",

162

 "title": "URL",

163

 "default": "/office"

164

 },

165

 "icon": {

166

 "title": "Icon",

167

 "type": "string",

168

 "default": "CircleWavyWarning"

169

 }

170

 }

171

 },

172

 "secondButton": {

173

 "title": "Second Button",

174

 "type": "object",

175

 "properties": {

176

 "label": {

177

 "type": "string",

178

 "title": "Label",

179

 "default": "Just Arrived"

180

 },

181

 "url": {

182

 "type": "string",

183

 "title": "URL",

184

 "default": "/technology"

185

 },

186

 "icon": {

187

 "title": "Icon",

188

 "type": "string",

189

 "default": "RocketLaunch"

190

 }

191

 }

192

 }

193

 }

194

 }

195

 }

196

 }

197

 }

`

---

### ProductShelf

| Type                              | Availability                                                                                |
| --------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-product-shelf) \_\_experimentalCarousel \_\_experimentalProductCard |
| Headless CMS: props customization | Product Card Configuration: showDiscountBadge, bordered                                                                                |

**Product Shelf - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

{

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["title", "numberOfItems", "after", "sort"],

9

 "properties": {

10

 "title": { "type": "string", "title": "Title" },

11

 "numberOfItems": {

12

 "type": "integer",

13

 "title": "Total number of items",

14

 "default": 5,

15

 "description": "Total number of items. The quantity may be smaller if the query returns fewer products."

16

 },

17

 "itemsPerPage": {

18

 "type": "integer",

19

 "title": "Number of items per page",

20

 "default": 5,

21

 "description": "Number of items to display per page in carousel"

22

 },

23

 "after": {

24

 "type": "integer",

25

 "title": "After",

26

 "default": "0",

27

 "description": "Initial pagination item"

28

 },

29

 "sort": {

30

 "title": "Sort",

31

 "description": "Items order",

32

 "default": "score_desc",

33

 "enum": [

34

 "discount_desc",

35

 "name_asc",

36

 "name_desc",

37

 "orders_desc",

38

 "price_asc",

39

 "price_desc",

40

 "release_desc",

41

 "score_desc"

42

 ],

43

 "enumNames": [

44

 "Discount: higher to lower",

45

 "Name: A-Z",

46

 "Name: Z-A",

47

 "Orders: higher to lower",

48

 "Price: lower to higher",

49

 "Price: higher to lower",

50

 "Release date: newer to older",

51

 "Relevance: higher to lower"

52

 ]

53

 },

54

 "term": { "type": "string", "title": "Search term" },

55

 "selectedFacets": {

56

 "title": "Facets",

57

 "type": "array",

58

 "items": {

59

 "title": "Facet",

60

 "type": "object",

61

 "required": ["key", "value"],

62

 "properties": {

63

 "key": {

64

 "title": "Key",

65

 "description": "For collections use: productClusterIds",

66

 "type": "string",

67

 "default": "productClusterIds"

68

 },

69

 "value": {

70

 "title": "Value",

71

 "description": "E.g. For 'Most Wanted' collection, use: 140. To consult your collection ids go to Collections page",

72

 "type": "string",

73

 "default": "140"

74

 }

75

 }

76

 }

77

 },

78

 "productCardConfiguration": {

79

 "title": "Product Card Configuration",

80

 "type": "object",

81

 "properties": {

82

 "showDiscountBadge": {

83

 "title": "Show discount badge?",

84

 "type": "boolean",

85

 "default": true

86

 },

87

 "bordered": {

88

 "title": "Cards should be bordered?",

89

 "type": "boolean",

90

 "default": true

91

 }

92

 }

93

 }

94

 }

95

 }

96

 }

`

---

### RegionBar

| Type                              | Availability                                                                                |
| --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Overridable components            | [RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-region-bar) LocationIcon [(Icon)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon) ButtonIcon [(Icon)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon) |
| Headless CMS: props customization | LocationIcon: IconButtonIcon: Icon                                                                                |

**Region Bar - Available schema**

Check the available Headless CMS schema that you can customize for this component:

`1

 {

2

 "name": "NewSectionName",

3

 "requiredScopes": [],

4

 "schema": {

5

 "title": "Add the Section name",

6

 "description": "Short description for the the section's purpose",

7

 "type": "object",

8

 "required": ["label"],

9

 "properties": {

10

 "icon": {

11

 "title": "Location Icon",

12

 "type": "object",

13

 "properties": {

14

 "icon": {

15

 "title": "Icon",

16

 "type": "string",

17

 "enumNames": ["Map Pin"],

18

 "enum": ["MapPin"],

19

 "default": "MapPin"

20

 },

21

 "alt": {

22

 "title": "Alternative Label",

23

 "type": "string",

24

 "default": "Map Pin icon"

25

 }

26

 }

27

 },

28

 "label": {

29

 "title": "Location label",

30

 "type": "string",

31

 "default": "Set your location"

32

 },

33

 "editLabel": {

34

 "title": "Location edit label",

35

 "type": "string",

36

 "default": "Edit"

37

 },

38

 "buttonIcon": {

39

 "title": "Button Icon",

40

 "type": "object",

41

 "properties": {

42

 "icon": {

43

 "title": "Icon",

44

 "type": "string",

45

 "enumNames": ["Caret Right"],

46

 "enum": ["CaretRight"],

47

 "default": "CaretRight"

48

 },

49

 "alt": {

50

 "title": "Alternative Label",

51

 "type": "string",

52

 "default": "Caret Right icon"

53

 }

54

 }

55

 }

56

 }

57

 }

58

 }

`

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/docs/developing-and-overriding-components/list-of-native-sections.mdx)

[Creating a new section« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-creating-a-new-section)[Experimental exports - Hooks and ComponentsNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-experimental-exports-hooks-and-components)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

ON THIS PAGE

[Considerations while customizing default components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23considerations-while-customizing-default-components)

[\_\_experimentalProductCard](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23experimentalproductcard)[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23searchinput)

[FastStore Native Sections](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23faststore-native-sections)

[Alert](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23alert)[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23bannertext)[Breadcrumb](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23breadcrumb)[CrossSellingShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23crosssellingshelf)[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23emptystate)[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23hero)[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23navbar)[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23newsletter)[ProductDetails](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productdetails)[ProductGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productgallery)[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productshelf)[RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23regionbar)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/docs/developing-and-overriding-components/list-of-native-sections.mdx)

Copy page

On this page

ON THIS PAGE

[Considerations while customizing default components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23considerations-while-customizing-default-components)

[\_\_experimentalProductCard](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23experimentalproductcard)[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23searchinput)

[FastStore Native Sections](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23faststore-native-sections)

[Alert](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23alert)[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23bannertext)[Breadcrumb](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23breadcrumb)[CrossSellingShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23crosssellingshelf)[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23emptystate)[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23hero)[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23navbar)[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23newsletter)[ProductDetails](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productdetails)[ProductGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productgallery)[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23productshelf)[RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/building-sections-list-of-native-sections/docs/guides/faststore/developing-and-overriding-components-list-of-native-sections%23regionbar)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides faststore storefront features implementing regionalization features in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/components-index)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-overview)

[Adding third-party scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-handling-third-party-scripts)

[Building navigation menus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-building-navigation-menus)

[Displaying content for authenticated users](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-displaying-content-for-authenticated-users)

[Implementing regionalization features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features)

[Implementing search features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-search-features)

[Managing product images in specific contexts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-managing-product-images-in-specific-contexts)

[Implementing Delivery Promise](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/delivery-promise-implementation)

[Implementing Live Shopping for FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-live-shopping-for-faststore)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/developing-and-overriding-components-overview)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/components-index)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-overview)

[Adding third-party scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-handling-third-party-scripts)

[Building navigation menus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-building-navigation-menus)

[Displaying content for authenticated users](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-displaying-content-for-authenticated-users)

[Implementing regionalization features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features)

[Implementing search features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-search-features)

[Managing product images in specific contexts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-managing-product-images-in-specific-contexts)

[Implementing Delivery Promise](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/delivery-promise-implementation)

[Implementing Live Shopping for FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-live-shopping-for-faststore)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/developing-and-overriding-components-overview)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/storefront-best-practices)

---

[Storefront development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/storefront-development)

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-overview)

Implementing regionalization features

This feature enables customers to set a location using a valid Postal Code.

Regionalization is a feature of [VTEX Intelligent Search](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/vtex-intelligent-search--19wrbB7nEQcmwzDPl1l4Cb/3qgT47zY08biLP3d5os3DG) that optimizes search results according to the availability of sellers in the customer's region.

Regionalization uses a behavior from VTEX Intelligent Search called [Availability](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/vtex-intelligent-search--19wrbB7nEQcmwzDPl1l4Cb/7LMQbWK5nElIkXo0NK8Kux). It searches for products available in the inventory of sellers that serve a particular region.

Stores that have more than one registered white-label seller usually have specific inventories for each region. This is the case for supermarkets, for example.

With the Regionalization feature enabled, if a customer enters their Postal Code while browsing the store (before checkout), only products available in the corresponding region will be displayed in the search results.

---

## Usage

1. Intentionally, a user sets its location using a postal code.
2. Updates product catalog.
3. Gets notified if there's a product conflict at Minicart.

---

## Components

* Region Bar
The RegionBar is a custom Button, usually used on mobile devices only. It should trigger the RegionModal.
[See more ](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/molecules-region-bar)
* Open Region Modal
Region Modal
A modal with region configurations.
[See more ](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/organisms-region-modal)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/components/storefront-features/implementing-regionalization-features.mdx)

[Displaying content for authenticated users« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-displaying-content-for-authenticated-users)[Implementing search featuresNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-search-features)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features%23usage)

[Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features%23components)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/components/storefront-features/implementing-regionalization-features.mdx)

Copy page

On this page

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features%23usage)

[Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/storefront-features-implementing-regionalization-features/docs/guides/faststore/storefront-features-implementing-regionalization-features%23components)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)