[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 delivery promise components 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/delivery-promise-components/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/updates/release-notes)

Storefront Development

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

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/headless-cms-overview)

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

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/styling-overview)

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

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

[Adding third-party scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/storefront-features-implementing-regionalization-features)

[Implementing search features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/delivery-promise-implementation)

[Understanding Delivery Promise operation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-overview)

[Working with Delivery Promise components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components)

[Implementing Live Shopping for FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

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

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/app-development)

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

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/updates/release-notes)

Storefront Development

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

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/headless-cms-overview)

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

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/styling-overview)

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

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

[Adding third-party scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/storefront-features-implementing-regionalization-features)

[Implementing search features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/delivery-promise-implementation)

[Understanding Delivery Promise operation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-overview)

[Working with Delivery Promise components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components)

[Implementing Live Shopping for FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/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/delivery-promise-components/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

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

---

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

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore)

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

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

Working with Delivery Promise components

Explore the core components of the Delivery Promise feature in FastStore, their functions, and how they integrate into your store.

This guide explains the components of the [Delivery Promise](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-overview) feature for FastStore. You will understand the purpose of each component, how they function, and where they are located in the FastStore architecture. This knowledge will help you effectively implement and customize the Delivery Promise feature in your store.

> To learn how to implement Delivery Promise in your store, see the guide [Implementing Delivery Promise](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-implementation).

## Components

Delivery Promise introduces modular components and hooks organized within the `@faststore/core` and `@faststore/ui` packages.

This guide focuses on the core components provided by the `@faststore/core` package, which are included by default in FastStore projects. Learn more about the packages in [Understanding the project structure](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/project-structure-overview%23packagejson).

Below are the core components related to the Delivery Promise feature in FastStore.

### RegionButton

`RegionButton` is a desktop-only component integrated into the `NavBar` section, under the [Global Sections content type](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/headless-cms-overview%23content-types) in the Headless CMS.

Its behavior is context-dependent. If a shopper doesn’t enter a postal code, a `Popover` is displayed, and the button label changes depending on whether a default postal code is set. When a shopper enters a postal code, the button displays the location and suppresses the `Popover`. Additionally, if a shopper sets their location, the [RegionModal](#regionmodal) component is triggered.

![{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAIAAAB2XpiaAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAFklEQVR4nGNQkJE9cuTI69evz1+8BAAo6QfZ9nsBRAAAAABJRU5ErkJggg==","img":{"src":"https://vtexhelp.vtexassets.com/assets/docs/src/region-button___ccb03f5e9e36d837a4b03aae6a0a58ff.png","width":1440,"height":212,"type":"png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/region-button___ccb03f5e9e36d837a4b03aae6a0a58ff.png)

If you have customized the `NavBar`, you must also customize the `RegionButton` component to use Delivery Promise. However, depending on your customization, you may need to implement your own version of `RegionButton`.

This component leverages the following:

* **UI Components:** [Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-button) and [Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon).
* **Hooks:** `useSession`

### RegionModal

`RegionModal` is a component that serves as a section under the Global Sections content type in the Headless CMS. It contains logic to enforce required location input if specified in the `discovery.config.js` file, which means the modal can't be closed without providing a location. It checks for valid postal codes and verifies product availability for the given location.

![{"base64":"  ","img":{"width":1440,"height":752,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":269961,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/region-modal___6352f280eeb8eb77ee4674a5caf4f328.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/region-modal___6352f280eeb8eb77ee4674a5caf4f328.png)

If you have customized the `NavBar`, you must also customize the `RegionModal` component to use Delivery Promise.

This component leverages the following:

* **UI Components:** [RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-region-modal)
* **Hooks:** `useRegion`

### RegionBar

`RegionBar` is a mobile-only component that acts as a section under the Global Sections content type in the Headless CMS.

Its behavior is context-dependent. If a shopper doesn’t enter a postal code, a `Popover` is displayed, and the button label changes depending on whether a default postal code is set. When a shopper enters a postal code, the button displays the location and suppresses the `Popover`. Additionally, if a shopper sets their location, the [RegionModal](#regionmodal) component is triggered.

![{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAIAAADwyuo0AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAJUlEQVR4nAEaAOX/AEpHSiAcHffy83d4gQDEwsLs6+zc2dr38vOmrw/3SGqdcQAAAABJRU5ErkJggg==","img":{"src":"https://vtexhelp.vtexassets.com/assets/docs/src/regionbar80___52615261c9d206fd8e305d92751c00b5.png","width":662,"height":261,"type":"png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/regionbar80___52615261c9d206fd8e305d92751c00b5.png)

Even if you have customized the `NavBar`, you can still utilize the native `RegionBar` component to use Delivery Promise.

This component leverages the following:

* **UI Components**: [RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-region-bar)
* **Hooks:** `useSession`

### RegionPopover

`RegionPopover` is a component that serves as a section under the Global Sections content type in the Headless CMS. When a default postal code is set in the `discovery.config.js` file, the location data (city and postal code) is displayed in a `Popover`.

![{"base64":"  ","img":{"width":2851,"height":1135,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":1097984,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/regionpopover___dedb0aad756657e71d4c8d40cb2ef5e7.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/regionpopover___dedb0aad756657e71d4c8d40cb2ef5e7.png)

If you have customized `RegionBar` or `RegionButton`, you can still use the native `RegionPopover` by integrating it into your custom components. However, depending on your customization, you may need to implement your own version of `RegionPopover`.

This component leverages the following:

* **UI Components**: [Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon), [InputField](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-input-field), [Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-link), and [Popover](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/molecules-popover).
* **Hooks:** `useSession`, `useRegion`

### RegionSlider

The `RegionSlider` component enables shoppers to manage their delivery-related location settings and pickup point filters in the Product Listing Pages (PLPs) or search pages. This component is implemented as a Global Section, making it available throughout the store on mobile and desktop browsers.

It includes three interaction types: Setting a new location (no postal code set), changing an existing location (postal code set), and selecting a pickup point (pickup point filter) for more precise delivery options.

* **No postal code set:** The user clicks the "Set location" button, then the `RegionSlider` opens, allowing them to set a postal code.

![{"base64":"  ","img":{"width":1622,"height":822,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":404407,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/set-location___8887a7be647d76a0584e1b977233a672.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/set-location___8887a7be647d76a0584e1b977233a672.png)

* **Postal code set:** The user clicks the postal code link, then the `RegionSlider` opens, allowing them to change the location.

![{"base64":"  ","img":{"width":1617,"height":824,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":423329,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/change-location___ada68e0df1bac1e8a20abc9040dbf82f.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/change-location___ada68e0df1bac1e8a20abc9040dbf82f.png)

* **Pickup point filter:** The user applies or clears filters related to pickup points. When filters are cleared, the `RegionSlider` resets its state and removes selected pickup points without closing the component.

![{"base64":"  ","img":{"width":1266,"height":790,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":418580,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/change-pickup-point___458c47c2a06d40385e47058bcbfeaac2.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/change-pickup-point___458c47c2a06d40385e47058bcbfeaac2.png)

This component leverages the following:

* **UI Components:** [SlideOver](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-slide-over)
* **Hooks:** `useRegion` and `useDeliveryPromise`

### FilterDesktop

`FilterDesktop` is a desktop-only component integrated into the `ProductGallery` section, under the Global Sections content type in the Headless CMS. It adds a delivery-based filter option that combines all search and PLP filters.

![{"base64":"  ","img":{"width":389,"height":737,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":40881,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/filter-desktop___b7c358c72f742ab91467621e4d19839a.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/filter-desktop___b7c358c72f742ab91467621e4d19839a.png)

### FilterSlider

`FilterSlider` is a mobile-only component integrated into the `ProductGallery` section under the Global Sections content type in the Headless CMS. It adds a delivery-based filter option that combines all search and PLP filters.

![{"base64":"  ","img":{"width":478,"height":942,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":64551,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/filter-slider___f885f64836ae3bf247ab7b849575230d.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/filter-slider___f885f64836ae3bf247ab7b849575230d.png)

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/_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/features/delivery-promise/components.mdx)

[Understanding Delivery Promise operation« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-overview)[Implementing Live Shopping for FastStoreNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/storefront-features-implementing-live-shopping-for-faststore)

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/_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

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

[RegionButton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionbutton)[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionmodal)[RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionbar)[RegionPopover](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionpopover)[RegionSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionslider)[FilterDesktop](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23filterdesktop)[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23filterslider)

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/features/delivery-promise/components.mdx)

Copy page

On this page

ON THIS PAGE

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

[RegionButton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionbutton)[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionmodal)[RegionBar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionbar)[RegionPopover](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionpopover)[RegionSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23regionslider)[FilterDesktop](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23filterdesktop)[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/delivery-promise-components/docs/guides/faststore/delivery-promise-components%23filterslider)

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 store architecture 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/store-architecture/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/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/store-architecture/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/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/store-architecture/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/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/store-architecture/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/vtex-platform-overview)

[Cloud infrastructure](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/cloud-infrastructure)

[Security](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/security)

[Data privacy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/data-privacy)

[Composability](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/composability)

[Extensibility](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/extensibility)

[Store architecture](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture)

[Understanding VTEX reference architectures](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/understanding-vtex-reference-architectures)

[Developer experience](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/developer-experience)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/getting-started)

---

Integration Guides

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/app-development)

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

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/vtex-platform-overview)

[Cloud infrastructure](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/cloud-infrastructure)

[Security](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/security)

[Data privacy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/data-privacy)

[Composability](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/composability)

[Extensibility](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/extensibility)

[Store architecture](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture)

[Understanding VTEX reference architectures](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/understanding-vtex-reference-architectures)

[Developer experience](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/developer-experience)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/getting-started)

---

Integration Guides

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides)

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/vtex-platform-overview)

[Store architecture](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture)

Store architecture

Learn how our store architecture models are tailored to meet different business needs.

Store architecture diagrams represent the fundamental structure of a particular project, providing a unified vision for all stakeholders and translating business needs into software components and project requirements. In this guide, we present an overview of basic store architecture models on VTEX.

There are different types and levels of architecture, which are generally used as a reference for both technical and business teams. Additionally, store architectures define the roles and responsibilities among all stakeholders and explain how different systems interoperate and how data is transmitted between them.

To demonstrate how VTEX integrates with the ecosystem, we've created reference architecture models based on common digital commerce strategies. These blueprints illustrate interactions between VTEX modules and the business, serving as a starting point for projects. Learn more about the structure of these models in [Understanding VTEX reference architectures](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/understanding-vtex-reference-architectures).

These are the main use cases:

* [Business-to-customer (B2C)](#business-to-customer-b2c)
* [Business-to-business (B2B) with B2B Suite](#business-to-business-b2b-with-b2b-suite)
* [Franchise accounts (omnichannel)](#franchise-accounts-omnichannel)
* [Multi-language and multi-currency](#multi-language-and-multi-currency)
   * [Single account, multi-binding](#single-account-multi-binding)
   * [Multi-account](#multi-account)
         * [Multi-account, shared back-office](#multi-account-shared-back-office-systems)
         * [Multi-account, independent back-office](#multi-account-independent-back-office-systems)

> Except for the [Headless](#headless) architecture, the following diagrams consider [Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework) as the storefront solution.

## Business-to-customer (B2C)

Business-to-customer (B2C) is the most common business model among VTEX clients and serves as a foundation for other models.

The diagram below illustrates the main components of a B2C commerce implementation. Components highlighted in pink are offered out-of-the-box (OOTB) by VTEX. However, the diagram also includes other parts that may be integrated from the client's internal back-office systems or third-party providers.

![{"base64":"  ","img":{"width":1323,"height":755,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":346194,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2c.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2c.png)

Below is an integration flow diagram in a B2C architecture, where asynchronous calls (not in real time) are represented by black arrows, and synchronous calls (in real time) are represented by blue arrows.

![{"base64":"  ","img":{"width":2078,"height":1082,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":411986,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/b2c-integration-flow.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/b2c-integration-flow.png)

An example of an asynchronous call is the stock update, represented by a black arrow pointing from the ERP to the Inventory module. A real-time update of payment rates is represented by a blue arrow, indicating information exchange between the blocks. This last scenario is synchronous because it occurs in a critical stage of the customer purchase flow.

The architecture suggested here extends beyond B2C, as you will see in the following sections.

## Business-to-business (B2B) with B2B Suite

The main characteristic of a [business-to-business (B2B)](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/b2b-overview--5vb9SNXhX2bZnkpAh7ADdC) model is that transactions occur between two or more legal entities.

The diagram below presents an example of a B2B business model using [B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.b2b-suite), represented within the **B2B core modules**. In this architecture, the main account acts as a marketplace for other VTEX sellers.

![{"base64":"  ","img":{"width":1470,"height":679,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":454815,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2b.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2b.png)

B2B Suite is a set of VTEX IO apps tailored to streamline B2B store management. This collection of apps enables the store to manage organizations (the companies enabled to make purchases in the store) and other functions and permissions for storefront and checkout. For instance, the store can offer specific price tables, collections, and custom payment methods for organizations. Additionally, clients can have different user roles within organizations, among other features.

The main account has access to more modules than the sellers, sharing only some of them, such as [Order Management System (OMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/orders-overview) and [Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/catalog-overview), as you can see in the diagram below.

![{"base64":"  ","img":{"width":1649,"height":1364,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":870503,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2b-suite.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/basic-b2b-suite.png)

Declaring these modules in the architecture not only makes the process clearer, but also makes it easier to understand the responsibilities of each player. In this case, for example, [Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/master-data) remains with the sellers because customer approvals are handled at the seller level.

In B2B scenarios, real-time communication between the B2B Suite and sellers is common, as the information is always up-to-date. This is also crucial for surcharge and tax calculations at checkout to ensure a smooth purchasing experience for the end customer.

In the diagram above, you can see the synchronous communication between the [Organizations](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.b2b-organizations) component in the main account and the sellers.

### Why choose this architecture?

* **Streamlined organization management**: Manage multiple [organizations](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.b2b-organizations) from a centralized platform by grouping storefront users into organizations and dividing them into cost centers.
* **Customized user experience**: Tailor the user experience for each [organization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.b2b-organizations), providing personalized pricing, payment methods, and product catalogs to meet specific business needs.
* **Enhanced security and control**: Assign roles and permissions to B2B clients, ensuring appropriate access levels and maintaining control over sensitive information and transactions. Learn more in the [Storefront Permissions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.storefront-permissions) and [Storefront Permissions UI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.storefront-permissions-ui) app documentation.
* **Optimized quoting system**: Facilitate [quote requests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-b2b-quotes) and management, enhancing negotiations and ensuring accurate pricing by integrating the quote-to-order process.
* **Efficient order processing**: Simplify the [checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.b2b-checkout-settings) process with shared shipping addresses for cost centers, reducing errors and streamlining order fulfillment.

### Learn more

* [B2B Suite - Overview](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/b2b-suite-overview--5eG6UfveWrai7looK0kVG3)

## Franchise accounts (omnichannel)

This is a very common architecture model that integrates physical stores with online stores as [franchise accounts](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/what-is-a-franchise-account--kWQC6RkFSCUFGgY5gSjdl) on VTEX.

A franchise account is linked to a main account and has the following characteristics:

* **No separate website**: Franchise accounts have no dedicated website. Instead, they operate within the main account's ecommerce site as part of a larger [marketplace](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/what-is-a-marketplace--680lLJTnmEAmekcC0MIea8).
* **Customer data storage**: Customer data is stored in the main account's [Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/master-data).
* **Seller type**: Each franchise account automatically operates as a [white-label seller](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/seller-white-label--5orlGHyDHGAYciQ64oEgKa) within the main account.
* **Catalog**: Franchise accounts inherit their [catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/catalog-overview) from the main account.
* **Logistics and OMS**: Each franchise account has its own [logistics](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/fulfillment) settings and does its own [order management](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/orders-overview).
* **Prices and payments**: Each franchise can have its own [pricing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/pricing-overview) and [payment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/payments-overview) methods, or it can inherit them from the main account.
* **Promotions**: [Promotions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/promotions-overview) can be created for each franchise account and for the main account.

![{"base64":"  ","img":{"width":1242,"height":690,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":287077,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/franchises-omni.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/franchises-omni.png)

This architecture model works well for brands with multiple physical stores, franchises, or representatives. In these cases, each physical store/franchise/representative can have a franchise account on VTEX integrated with the brand's main account. This allows it to deliver the products sold through the brand's ecommerce site from an omnichannel perspective.

### Why choose this architecture?

* Potential to reduce the percentage of out-of-stock items.
* More shipping options, potentially reducing logistics costs.
* Physical stores can be configured as [pickup points](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/unified-commerce-strategies--3WGDRRhc3vf1MJb9zGncnv/4hXfgqXxS1lwAfnxgja3xW).
* Physical stores can operate as small warehouses, using the [ship-from-store](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/unified-commerce-strategies--3WGDRRhc3vf1MJb9zGncnv/50GAmxxFsJoLWqcnMysWdl) strategy.
* Possible inventory reduction through the implementation of the [Endless Aisle](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/unified-commerce-strategies--3WGDRRhc3vf1MJb9zGncnv/40KMlmGI5tN0r0KPCDWgGn) strategy through [VTEX Sales App](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/instore-getting-started-and-setting-up--zav76TFEZlAjnyBVL5tRc/7fnnVlG3Kv1Tay9iagc5yf).

> VTEX Sales App is available in Brazil and some LATAM countries. To check if it's available in your country, open a ticket with [VTEX Support](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/opening-tickets-to-vtex-support--16yOEqpO32UQYygSmMSSAM).

## Multi-language and multi-currency

Some of our clients operate in multiple countries and want each local store to run on VTEX. We provide a multi-language and multi-currency architecture for this scenario, which is explained in the following sections.

### Single account, multi-binding

In this architecture, a single VTEX account is configured to support multiple languages and currencies using a [multi-domain](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/vtex-store-overview--eSDNk26pdvemF3XKM0nK9/4yPqZQyj0t675QpcG7H6yl%23multistore) approach.

The reference architecture below highlights its main characteristics:

* **Separate website**: A single account, but each store with its own domain, bound to different [trade policies](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/vtex-store-overview--eSDNk26pdvemF3XKM0nK9/4EPwTXx5oFdSG1dA3zIchz%23trade-policy) by [bindings](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/what-is-binding--4NcN3NJd0IeYccgWCI8O2W).
* **Search**: Same [search settings](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/search-overview) for all websites.
* **CMS**: Shared access to the [Content Management System (CMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-cms) across websites.
* **Customer data storage**: A single [Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/master-data) for all stores.
* **Catalog**: A single catalog segmented by trade policies.
* **Logistics**: Each store manages its logistics through different warehouses in the same logistics panel.
* **Order Management System (OMS)**: A unified OMS panel for all stores.
* **Payments**: Shared payment settings across all stores.
* **Prices and promotions**: Different prices and promotions can be configured for each store, segmented by trade policy. However, prices and promotions for all stores are managed in the same panel.
* **Message Center**: A single [Message Center](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/understanding-the-message-center--tutorials%5F84) for all stores.

![{"base64":"  ","img":{"width":1441,"height":693,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":270012,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/multi-currency-language-single-account.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/multi-currency-language-single-account.png)

This model is easier to set up, integrate, and maintain compared to the [multi-account](#multi-account) approach, but it may not be efficient for large and complex operations. This architecture is recommended for operations across multiple countries that require configuring different languages and currencies but don't require data segregation, as all core services are shared. Therefore, it may work well for operations managed by a single, centralized team.

#### Why choose this architecture?

* Supports [multi-currency](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-internationalizing-product-prices) natively.
* Supports multi-language with [Messages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/storefront-content-internationalization) and the [Catalog translation app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/catalog-internationalization).

> Product names aren't translated on the [Checkout](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/checkout-vtex-overview--7wcprkM7yZUflOqbzAN5SI) and [My Account](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/how-my-account-works--2BQ3GiqhqGJTXsWVuio3Xh) pages. These modules call the Catalog API directly to retrieve product data, so the information doesn't go through the Messages API.

### Multi-account

In a multi-account architecture, a brand operates multiple VTEX accounts, typically one per country or market, so that each can be localized and managed independently. This architecture is recommended for businesses operating in multiple countries that need to configure different languages and currencies, with different teams managing each localized store.

There are two architectural variants, depending on how back-office systems like ERP, PIM, and WMS are integrated:

* [Shared back-office systems](#multi-account-shared-back-office-systems)
* [Independent back-office systems](#multi-account-independent-back-office-systems)

#### Why choose this architecture?

* Supports both single-fulfillment (all items shipped from one account) and multi-fulfillment (items shipped from different accounts within the same purchase), optimizing logistics based on item availability and proximity to the customer.
* Facilitates multi-language and multi-currency operations by designating the seller (main account) as the catalog owner and using the accounts for each country as marketplaces, allowing each store to manage its language and currency locally within its own environment.
* Supports independent catalog translations, eliminating the need to rely on [Messages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/storefront-content-internationalization) or the [Catalog translation app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/catalog-internationalization), unlike the [single account, multi-binding](#single-account-multi-binding) model.

#### Multi-account, shared back-office systems

In this model, a main account acts as a [seller](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/what-is-a-seller--5FkLvhZ3Few4CWWIuYOK2w) in secondary accounts that act as [marketplaces](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/configuring-the-marketplace-between-vtex-stores--tutorials%5F6520).

The reference architecture below highlights its main characteristics:

* **Separate VTEX account**: Each store operates with its own VTEX account.
* **Separate website**: Each store has its own website and can customize a different frontend style.
* **Customer data storage**: Customer data is segregated by marketplace account. Customer information isn't stored within the main account's [Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/master-data).
* **Promotions**: Promotions from the main account have limited capabilities because the main account can't access customer data from the marketplace. For example, creating promotions for a customer cluster in the main account doesn't work because the account doesn't have access to Master Data of the marketplace. Additionally, promotions configured in the marketplace based on a seller's [payment methods](https://read.calvincode.net/reader?url=https://newhelp.vtex.com/en/docs/tutorials/difference-between-payment-methods-and-payment-conditions) don't work. Learn more in [Configuring promotions for marketplaces](https://read.calvincode.net/reader?url=https://newhelp.vtex.com/en/docs/tutorials/configuring-promotions-for-marketplaces).
* **Checkout, Order Management System (OMS), Payments, and Message Center**: Each store manages these modules independently in its own Admin, without relying on the main account.
* **Catalog, Pricing, and Logistics**: The main account is the source of truth for these [VTEX core services](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/getting-started%23vtex-core-services), but management is independent, as each account has its own Admin. The product assortment can vary between accounts, but it's always based on the main account's catalog, as the main account is the owner.
* **Localization**: The catalog can be translated in the marketplace after the seller sends the item.

> [Assembly options](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/assembly-options-app) and [services](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/what-is-a-service--46Ha8CEEQoC6Y40i6akG0y) aren't supported. [Attachments](https://read.calvincode.net/reader?url=https://help.vtex.com/tutorial/what-is-an-attachment--aGICk0RVbqKg6GYmQcWUm) only work if configured in the seller account.

![{"base64":"  ","img":{"width":1398,"height":714,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":326503,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/multi-currency-language-multi-account.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/multi-currency-language-multi-account.png)

#### Multi-account, independent back-office systems

In this model, each country or region operates with its own back-office, resulting in greater operational and integration autonomy.

The reference architecture below highlights its main characteristics:

* **Separate VTEX account**: Each store operates with its own VTEX account.
* **Separate website**: Each store has its own website and can customize a different frontend style.
* **Customer data storage**: Customer data is segregated by account. Customer information isn't shared between accounts, as each has its own [Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/master-data).
* **Promotions**: Different promotions can be configured for each store. If any individual account runs a [marketplace with external sellers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/external-seller-integration-architecture), the seller-marketplace limitations are applied within that specific relationship, but that is separate from the cross-country independence model. Learn more about these restrictions in [Configuring promotions for marketplaces](https://read.calvincode.net/reader?url=https://newhelp.vtex.com/en/docs/tutorials/configuring-promotions-for-marketplaces).
* **Checkout, Order Management System (OMS), Payments, and Message Center**: Each store manages these modules independently in its own Admin.
* **Catalog, Pricing, and Logistics**: Each store manages these [VTEX core services](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/getting-started%23vtex-core-services) independently. Integrations aren't shared between accounts.

![{"base64":"  ","img":{"width":1612,"height":871,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":131572,"url":"https://vtexhelp.vtexassets.com/assets/docs/src/multi-account-independent-back-office___09c2a122cc7fe7178540c9a9275570bb.png"}}](https://read.calvincode.net/reader?url=https://vtexhelp.vtexassets.com/assets/docs/src/multi-account-independent-back-office___09c2a122cc7fe7178540c9a9275570bb.png)

#### Learn more

* [Accounts and architecture](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tracks/vtex-store-overview--eSDNk26pdvemF3XKM0nK9/4yPqZQyj0t675QpcG7H6yl)
* [Choosing between a multi-store architecture or an additional environment](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/choosing-between-a-multi-store-architecture-or-an-additional-environment--4HRNpa1OCKZ5YzP8yiilBL)

## Headless

In a headless architecture, the frontend (or "head") is decoupled from the backend. This allows the user interface to be built with any technology while the backend supplies the data and functionality, providing greater flexibility and scalability.

The frontend layer includes font type, colors, styles, images, buttons, etc. The backend manages the ecommerce functionality, such as pricing, infrastructure, security, checkout. This architecture allows stores to fully control the user experience on the storefront while customizing the backend to meet their specific needs.

![{"base64":"  ","img":{"width":1324,"height":741,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":273908,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/headless.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/VTEX-Platform-Overview/store-architecture/headless.png)

The diagram above represents an account implemented with [FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore), the VTEX-native solution that allows developers to build headless storefronts. It outlines the main components of a headless implementation, providing an overview that can be expanded to address specific business needs.

> If your store uses a third-party CMS instead of VTEX storefront solutions, you can leverage VTEX APIs to build a headless shopping experience. Learn more in the [Headless Commerce](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/headless-commerce) guide and the Pragmatic Composability section in the [Composability](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/composability%23pragmatic-composability) guide.

### Why choose this architecture?

* **Flexibility:** A headless approach allows complete ownership of website architecture.
* **Faster websites:** A headless ecommerce platform houses content centrally and can deliver it anywhere via APIs, allowing faster delivery compared to traditional ecommerce architecture.
* **Personalized experiences:** Stores can create customizable experiences and adapt them to achieve the desired look and feel.
* **Low-risk experimentation:** Decoupling the backend from the frontend makes it simpler and less risky to make changes to the frontend, knowing that it won't impact the site's underlying backend architecture.
* **Seamless integration:** Stores can integrate their existing systems (ERP, PIM, OMS, etc.) to build a cohesive shopping experience using any programming language.

### Learn more

* [Headless CMS - Overview](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/headless-cms-overview--3U5gvhHdQL0jczYH8gjX09)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F77292838%3Fv%3D4%26w=64%26q=75)](https://github.com/julia-rabello)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/VTEX-Platform-Overview/store-architecture/store-architecture.md)

[Extensibility« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture//docs/guides/extensibility)[Understanding VTEX reference architecturesNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture//docs/guides/understanding-vtex-reference-architectures)

See also

[Understanding VTEX reference architecturesGuides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/understanding-vtex-reference-architectures)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F77292838%3Fv%3D4%26w=64%26q=75)](https://github.com/julia-rabello)

ON THIS PAGE

[Business-to-customer (B2C)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23business-to-customer-b2c)

[Business-to-business (B2B) with B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23business-to-business-b2b-with-b2b-suite)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)[Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23learn-more)

[Franchise accounts (omnichannel)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23franchise-accounts-omnichannel)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)

[Multi-language and multi-currency](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23multi-language-and-multi-currency)

[Single account, multi-binding](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23single-account-multi-binding)[Multi-account](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23multi-account)

[Headless](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23headless)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)[Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23learn-more)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/VTEX-Platform-Overview/store-architecture/store-architecture.md)

Copy page

On this page

ON THIS PAGE

[Business-to-customer (B2C)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23business-to-customer-b2c)

[Business-to-business (B2B) with B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23business-to-business-b2b-with-b2b-suite)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)[Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23learn-more)

[Franchise accounts (omnichannel)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23franchise-accounts-omnichannel)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)

[Multi-language and multi-currency](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23multi-language-and-multi-currency)

[Single account, multi-binding](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23single-account-multi-binding)[Multi-account](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23multi-account)

[Headless](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23headless)

[Why choose this architecture?](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23why-choose-this-architecture)[Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-architecture/docs/guides/store-architecture%23learn-more)

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=)