[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 vtex io documentation adding custom headers to your store framework store 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/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides)

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

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

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

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-routing)

[Adding custom headers to your Store Framework store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store)

[Best practices for associating a custom page with a content type](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-best-practices-for-associating-a-custom-page-with-a-content-type)

[Customizing your 404 page](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-customizing-your-404-page)

[Enabling 404 pages for invalid single-segment paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-enabling-404-pages-for-invalid-single-segment-paths)

[Managing URL redirects](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-managing-url-redirects)

[Using several service workers in your store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-using-several-service-workers-in-your-store)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-routing)

[Adding custom headers to your Store Framework store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store)

[Best practices for associating a custom page with a content type](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-best-practices-for-associating-a-custom-page-with-a-content-type)

[Customizing your 404 page](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-customizing-your-404-page)

[Enabling 404 pages for invalid single-segment paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-enabling-404-pages-for-invalid-single-segment-paths)

[Managing URL redirects](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-managing-url-redirects)

[Using several service workers in your store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-using-several-service-workers-in-your-store)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/storefront-best-practices)

---

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/storefront-development)

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/store-framework-routing)

[Adding custom headers to your Store Framework store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store)

Adding custom headers to your Store Framework store

Discover how to configure custom headers in your store

In this guide, you'll learn how to configure custom response headers in your Store Framework store. HTTP headers play a key role in communication between the user's browser and the server, providing additional information about the request in progress. There are two main types of headers:

* **Request Headers:** Sent by the client to the server. They contain information about the request made, such as the type of HTTP method used, the type of accepted content, cookies, among others.
* **Response Headers:** Sent by the server to the client. They provide information about the sent response, such as the response status, type of returned content, cookies, among others.

> For more information, check the MDN guide [HTTP](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP) and the related documentation.

## Security Response Headers

Here are the headers that accept editing:

* [**X-Frame-Options**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options): Allows the control of how websites can be incorporated into other ones through the use of frames. This header is a security measure to protect users against [click-jacking](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/Security/Types%5Fof%5Fattacks%23click-jacking) attacks, which occur when an attacker tricks users into clicking something on a web page without their consent.
* [**X-Content-Type-Options**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Content-Type-Options): Protects against [MIME](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics%5Fof%5FHTTP/MIME%5Ftypes) vulnerabilities, which can occur when a website allows users to upload content.
* [**Content-Security-Policy (CSP)**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy): Allows to control the resources a user agent can load on a given page, preventing [cross-site scripting](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Glossary/Cross-site%5Fscripting) attacks.
* [**Strict-Transport-Security (HSTS)**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Strict-Transport-Security): Informs browsers that the site should only be accessed using HTTPS.
* [**X-XSS-Protection**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-XSS-Protection): Instructs browsers on how to handle cross-site scripting (XSS) attacks, activating the integrated filter to block malicious scripts from executing in the user's browser.
* [**Referrer-Policy**](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referrer-Policy): Determines which origin page information is shared with the destination page in HTTP requests, essential to protect user privacy and website security.

## Instructions

You can configure a custom header, a value that is not standardized and is tailored to the specific requirements or features of your store. To add a custom heading, follow the instructions below:

1. In the VTEX Admin, go to **Store Settings > Storefront > Store**.
2. Click the Advanced tab.
3. Scroll down to the **Custom Header** section.
4. Click **Add**.

![{"base64":"  ","img":{"width":1240,"height":566,"type":"gif","mime":"image/gif","wUnits":"px","hUnits":"px","length":4300149,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/vtex-io/Storefront-Guides/images/custom-header-flow-en.gif"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/vtex-io/Storefront-Guides/images/custom-header-flow-en.gif)

1. Complete the fields based on the [Security Response Headers](#security-response-headers) and the following guidelines:
   * **Header ID:** ID that identifies your custom header.
   * **Key:** Header key, following HTTP standards.
   * **Value:** Header value, following HTTP standards.
> For more information on HTTP headers, see the MDN documentation on [headers](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers).

See the example below:

![{"base64":"  ","img":{"width":985,"height":375,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":35735,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/vtex-io/Storefront-Guides/images/custom-header-setup.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/guides/vtex-io/Storefront-Guides/images/custom-header-setup.png)

In the example above, the value `max-age=31536000; includeSubdomains` in the `Strict-Transport-Security` (HSTS) header defines the maximum duration in seconds that the HSTS policy should be applied by the browser for a specific domain and its subdomains. The `preload` directive indicates that the domain should be included in the HSTS preload list, which ensures that compliant browsers will only connect via HTTPS, even for the initial request.

1. Click **Apply** to apply the settings. The update can take up to a day to reflect due to caching.

### Best practices

* When adding new headers to your account, always check the [official MDN documentation](https://read.calvincode.net/reader?url=https://developer.mozilla.org/en-US/docs/Web/HTTP).
* When using the `frame-ancestors` header, remember to add the `self` parameter, which indicates that the page can only be embedded in iframes on the domain itself. Without this setting, the Site Editor content may be blocked, as iframes can be used to load and display parts of the store.
* When using the `X-Frame-Options` header, remember to add the `SAMEORIGIN` parameter, which allows the page to be loaded in iframes only when the origin (domain) of the iframe is the same as the main page. Without this setting, the Site Editor content may be blocked, as the header restricts the site display within any iframe.
* Always run tests in a [development workspace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-creating-a-development-workspace) before making the configuration available in production stores.

Contributors

1

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

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-io/Storefront-Guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store.md)

[Routing« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store//docs/guides/store-framework-routing)[Best practices for associating a custom page with a content typeNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store//docs/guides/vtex-io-documentation-best-practices-for-associating-a-custom-page-with-a-content-type)

Contributors

1

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

ON THIS PAGE

[Security Response Headers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23security-response-headers)

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23instructions)

[Best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23best-practices)

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-io/Storefront-Guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store.md)

Copy page

On this page

ON THIS PAGE

[Security Response Headers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23security-response-headers)

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23instructions)

[Best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store/docs/guides/vtex-io-documentation-adding-custom-headers-to-your-store-framework-store%23best-practices)

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 vtex io documentation running io scripts in non io vtex stores 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/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides)

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

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

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

App Development

[What is VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-what-is-vtex-io)

---

[What is a VTEX App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-what-is-a-vtex-app)

---

[Governance and shared security in VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/governance-and-shared-security-in-vtex-io-apps)

---

[Code samples and templates](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/code-samples)

---

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-getting-started)

---

Project structure

---

[VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference)

---

[Workspace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-workspace)

---

Managing apps

---

Development guides

[Managing application logs](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-managing-application-logs)

[Running IO scripts in non-IO VTEX stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores)

[Creating an interface for your app settings](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-creating-an-interface-for-your-app-settings)

---

[Node apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/app-development-guides)

---

[GraphQL in VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/graphql-in-vtex-io)

---

[Policies and permissions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-policies)

---

[A/B tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/ab-tests)

---

[Deployment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available)

---

[VTEX App Store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-app-store)

---

[Edition Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/managing-edition-apps)

---

[Frequently asked questions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-frequently-asked-questions)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/updates/release-notes)

App Development

[What is VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-what-is-vtex-io)

---

[What is a VTEX App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-what-is-a-vtex-app)

---

[Governance and shared security in VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/governance-and-shared-security-in-vtex-io-apps)

---

[Code samples and templates](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/code-samples)

---

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-getting-started)

---

Project structure

---

[VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference)

---

[Workspace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-workspace)

---

Managing apps

---

Development guides

[Managing application logs](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-managing-application-logs)

[Running IO scripts in non-IO VTEX stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores)

[Creating an interface for your app settings](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-creating-an-interface-for-your-app-settings)

---

[Node apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/app-development-guides)

---

[GraphQL in VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/graphql-in-vtex-io)

---

[Policies and permissions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-policies)

---

[A/B tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/ab-tests)

---

[Deployment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available)

---

[VTEX App Store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-app-store)

---

[Edition Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/managing-edition-apps)

---

[Frequently asked questions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-frequently-asked-questions)

---

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/app-development)

Development guides

[Running IO scripts in non-IO VTEX stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores)

Running IO scripts in non-IO VTEX stores

Execute VTEX IO scripts in non-IO VTEX stores using a custom Scripts app.

To make it possible to run VTEX IO scripts in non-IO VTEX stores, you must develop and release your own _Scripts app_.

A _Scripts app_ is an application that allows the usage of pre-defined VTEX IO scripts in pages external to the VTEX IO. That means that any VTEX store that installs your new _Scripts app_, even the ones that don't use the VTEX IO, can take advantage of running the VTEX IO scripts defined within your application in its website pages.

Notice that nothing keeps an account from having multiple _Scripts apps_ installed. Hence, we recommend that, when building a _Scripts app_, you define a clear goal and offer a suite of coherent functionalities.

In the following sections, we'll teach you how to develop and implement your own _Scripts app_.

## Before you begin

Before proceeding with the steps outlined in this document, ensure that you have the [VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install) installed on your machine.

## Instructions

### Step 1 - Clone the boilerplate repository

1. Using your terminal, clone the _Scripts app_ boilerplate repository to your local files by running:
`1
git clone https://github.com/vtex-apps/app-scripts-example
`
2. Then, using any code editor of your choice, open the boilerplate repository's directory.

### Step 2 - Update the manifest metadata

1. Open the `manifest.json` file and update its metadata, according to your scenario. It's essential that you update the following fields:
   * `vendor` \- The app owner. That is, the VTEX account responsible for the app development, maintenance, and distribution.
   * `name` \- The app name. It should concisely express the app's purpose. They must be comprised of lowercase letters separated by hyphens. Special characters, such as `*` and `@`, and numbers at the beginning of the name are not recommended.
   * `title` \- The app distribution name. This name is the one used in the Apps section from the Administrative Panel and in the VTEX App Store.
   * `description` \- A brief description explaining the app's purpose. This description will be publicly available in the App Store, providing context for whoever wants to install your app.

### Step 3 - Customize your script

1. In the `/scripts` folder, replace the example files with your own `.ts` script files.
2. In the `/scripts` folder, open the `loader.json` file and declare which scripts should be executed on which page. Each entry in the `loader` `JSON` object must have a `RegExp` key indicating the page path, and a corresponding array of strings. Each string in the array points to the script files that need to be loaded on a page when the `RegExp` key matches the URL path of that page .

Take the following example:

`1

{

2

 ".*": ["script1"],

3

 ".*/b$": ["script2"],

4

 ".*/p$": ["script2", "script3"]

5

}

`

In this example, the `script1` will be loaded and executed in all pages (`.*`) of the application.

For brand pages, expressed by URLs ending in `/b`, besides the `script1`, the `script2` will also be loaded.

Finally, for product pages, expressed by URLs ending in `/p`, besides the `script1`, the `script2` and the `script3` will also be loaded.

> Note that, by default, the scripts are located in the `scripts` folder. Hence, the complete path can be omitted. Also, as the scripts builder only looks for `.ts` files, it's not necessary to indicate file extensions.

Although a single `RegExp` can have multiple corresponding scripts and multiple `RegExp` can match a single URL path, each script is loaded and executed only one time per page, independently of how many occurrences it has in matched `RegExps`.

### Step 4 - Link your app

1. Open the Admin of the account you are using to develop your app, and follow the instructions provided in the [Importing scripts](#importing-scripts) section, considering a development workspace.
2. Once your app is set up, use the terminal and the [VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference/) to log in to the VTEX account that you are using to develop your VTEX IO _Scripts App_.
> Remember to replace the values between the curly brackets according to your scenario.
`1
vtex login {accountName}
`
3. Change to development workspace.
`1
vtex use {workspace}
`
4. Go to the local app directory and [link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-linking-an-app) the app to your development workspace.
`1
cd app-scripts-example
2
vtex link
`

### Step 5 - Test and deploy

1. Check the pages for which you implemented your scripts.
2. Make your new app version publicly available by following [this guide](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available/).

### Step 6 - Implement your app

Now that you finished developing your _Scripts_ app, you follow these steps to implement it in your desired VTEX account:

1. Using the VTEX IO CLI or the App Store, install the app you just developed in the desired account.
2. Follow the instructions provided in the [Importing scripts](#importing-scripts) section, considering a production workspace.

## Importing scripts

1. Considering the workspace in which you're currently working, open the Admin of the desired account and workspace.
2. Go to **Storefront > Layout**.
3. Open the desired page template.
4. Before the `body` closure, place a single HTML `script` tag to import the `load.js` file, as in the following examples:

### Development

`1

<script

2

 src="https://{devWorkspace}--{account}.myvtex.com/_v/public/vtex.scripts-server/v1/load.js"

3

 type="text/javascript"

4

></script>

`

where:

* `devWorkspace`\- the development workspace of the account used to develop your _Scripts app._
* `account`\- the name of the account used to develop your _Scripts app._

### Production

`1

<script

2

 src="/api/io/_v/public/vtex.scripts-server/v1/load.js?workspace={productionWorkspace}"

3

 type="text/javascript"

4

></script>

`

where:

* `productionWorkspace` \- the production workspace of the account you are implementing the _Scripts app._

The `src` value from the `script` tag is the same for all pages in which you want to load your app's scripts.

According to the definitions from the `loader.json` file, the script server will load and execute only the appropriate scripts for that page: the ones whose the URL matches the `RegExps` from the `loader.json` file against the page path.

## App behavior

All scripts available in a _Scripts app_ are saved in its `/scripts` folder along with a `loader.json` file, which indicates in which page each script must be executed.

The scrips builder, set in the `manifest.json` file, is responsible for parsing each script declared in the `loader.json` file and for making them available to the `/load.js` route of the VTEX IO script server.

Hence, once you install a _Scripts app_ in a VTEX account, you can import the script server's route (`/load.js`) to your pages by using the `script` HTML tag.

Finally, according to the definitions from the `loader.json` file, the appropriate scripts for each page will be loaded and executed instantly.

Contributors

1

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

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-io/App-Guides/configuring-workspaces/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores.md)

[Managing application logs« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores//docs/guides/vtex-io-documentation-managing-application-logs)[Creating an interface for your app settingsNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores//docs/guides/vtex-io-documentation-creating-an-interface-for-your-app-settings)

Contributors

1

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

ON THIS PAGE

[Before you begin](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23before-you-begin)

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23instructions)

[Step 1 - Clone the boilerplate repository](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-1-clone-the-boilerplate-repository)[Step 2 - Update the manifest metadata](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-2-update-the-manifest-metadata)[Step 3 - Customize your script](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-3-customize-your-script)[Step 4 - Link your app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-4-link-your-app)[Step 5 - Test and deploy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-5-test-and-deploy)[Step 6 - Implement your app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-6-implement-your-app)

[Importing scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23importing-scripts)

[Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23development)[Production](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23production)

[App behavior](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23app-behavior)

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-io/App-Guides/configuring-workspaces/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores.md)

Copy page

On this page

ON THIS PAGE

[Before you begin](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23before-you-begin)

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23instructions)

[Step 1 - Clone the boilerplate repository](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-1-clone-the-boilerplate-repository)[Step 2 - Update the manifest metadata](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-2-update-the-manifest-metadata)[Step 3 - Customize your script](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-3-customize-your-script)[Step 4 - Link your app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-4-link-your-app)[Step 5 - Test and deploy](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-5-test-and-deploy)[Step 6 - Implement your app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23step-6-implement-your-app)

[Importing scripts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23importing-scripts)

[Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23development)[Production](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23production)

[App behavior](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores/docs/guides/vtex-io-documentation-running-io-scripts-in-non-io-vtex-stores%23app-behavior)

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] How do I use the VTEX store components availabilitysubscriber app? Provide documentation and configuration details.

[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/apps/vtex.store-components/availabilitysubscriber/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/vtex-io-apps)

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

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/basic-components)

---

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

[Autocomplete Result List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/autocompleteresults)

[Availability Subscriber](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber)

[Back To Top Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/backtotopbutton)

[Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/image)

[Info Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/infocard)

[Logo](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/logo)

[Notification](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/notification)

[Product Brand](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productbrand)

[Product Description](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productdescription)

[Product Images](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productimages)

[Product Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productname)

[Product SKU Attributes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productskuattributes)

[Search Bar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/searchbar)

[Share](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/share)

[Shipping Simulator](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/shippingsimulator)

[SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/skuselector)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/functional-apps)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.my-account)

---

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

---

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

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

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

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

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

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

---

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

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/basic-components)

---

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

[Autocomplete Result List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/autocompleteresults)

[Availability Subscriber](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber)

[Back To Top Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/backtotopbutton)

[Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/image)

[Info Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/infocard)

[Logo](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/logo)

[Notification](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/notification)

[Product Brand](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productbrand)

[Product Description](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productdescription)

[Product Images](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productimages)

[Product Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productname)

[Product SKU Attributes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/productskuattributes)

[Search Bar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/searchbar)

[Share](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/share)

[Shipping Simulator](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/shippingsimulator)

[SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/skuselector)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/functional-apps)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.my-account)

---

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

---

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

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

Availability Subscriber

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

Version: 3.178.5

Latest version: 3.178.5

The `availability-subscriber` component shows the availability subscriber form displayed when a product isn't available. This component can be imported and used by any VTEX App.

![{"base64":"  ","img":{"width":1650,"height":612,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":220954,"url":"https://user-images.githubusercontent.com/67270558/147770983-16f37aea-ea98-476c-a9aa-a01e1fca24f8.png"}}](https://read.calvincode.net/reader?url=https://user-images.githubusercontent.com/67270558/147770983-16f37aea-ea98-476c-a9aa-a01e1fca24f8.png)

This component only collects the emails of the customers that subscribed to receive updates about a specific out-of-stock product. It does not email shoppers automatically when the product gets back in stock.

> Info
>
> Alternatively, check the [Availability Notify component](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-developer-docs/docs/vtex-availability-notify), which renders a subscription form when a product is unavailable and also emails the shopper when the requested product is back in stock.

## Before you start

Before configuring the Availability Subscriber component in your theme, make sure you've already configured a **JSON schema in Master Data** to collect the emails correctly. Otherwise, the subscriber form won't be properly saved with the shoppers' emails. Please refer to the [Creating a product availability form](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-developer-docs/docs/vtex-io-documentation-creating-a-product-availability-form) guide for more information.

## Configuration

1. Import the `vtex.store-components` app to your theme's dependencies in the `manifest.json` file as in the following example:

`1

 "dependencies": {

2

 "vtex.store-components": "3.x"

3

 }

`

1. Add the `availability-subscriber` block as a child of the `store.product` template (Product Details Page template). For example:

`1

 "store.product": {

2

 "children": [

3

+ "availability-subscriber”

4

 ]

5

 }

`

The Availability Subscriber component does not have any props. Hence, once added to your Product Details Page template, the Availability Subscriber component is ready for use.

### Blocks API

When implementing this component as a block, various inner blocks may be available. The following interface lists the blocks available within `AvailabilitySubscriber` and describes if they are mandatory or optional.

`1

 "availability-subscriber": {

2

 "component": "AvailabilitySubscriber"

3

 }

`

For now this block does not have any mandatory or optional blocks.

## Customization

To apply CSS customizations in this and other blocks, follow the [Using CSS handles for store customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-developer-docs/docs/vtex-io-documentation-using-css-handles-for-store-customization) guide.

| CSS Handles         |
| ------------------- |
| content             |
| error               |
| form                |
| input               |
| inputEmail          |
| inputName           |
| submit              |
| subscriberContainer |
| subscribeLabel      |
| success             |
| title               |

[Autocomplete Result List« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/autocompleteresults)[Back To Top ButtonNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/backtotopbutton)

See also

[Vtex.store ComponentsVTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components)[VTEX App StoreVTEX IO Apps](https://read.calvincode.net/reader?url=https://apps.vtex.com/)

ON THIS PAGE

[Before you start](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber%23before-you-start)

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber%23configuration)

[Blocks API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber%23blocks-api)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.store-components/availabilitysubscriber/docs/apps/vtex.store-components/availabilitysubscriber%23customization)

Was this helpful?

[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] Explain troubleshooting i cant complete a purchase on a faststore website 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/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/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/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/updates/release-notes)

Troubleshooting

API

---

Development

---

Store performance

[I can't complete a purchase on a FastStore website](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website)

[My store is slow or unavailable](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-is-slow-or-unavailable)

[Google Analytics 4 is tracking inconsistent data from my store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/google-analytics-4-is-tracking-inconsistent-data-from-my-store)

[UTMs are not being applied to the cart at Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/utms-are-not-being-applied-to-the-cart-at-checkout)

[My routes are not behaving as expected](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-routes-are-not-behaving-as-expected)

[My store is presenting price inconsistencies](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-is-presenting-price-inconsistencies)

[My store translation is not behaving as expected](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-translation-is-not-behaving-as-expected)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/updates/release-notes)

Troubleshooting

API

---

Development

---

Store performance

[I can't complete a purchase on a FastStore website](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website)

[My store is slow or unavailable](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-is-slow-or-unavailable)

[Google Analytics 4 is tracking inconsistent data from my store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/google-analytics-4-is-tracking-inconsistent-data-from-my-store)

[UTMs are not being applied to the cart at Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/utms-are-not-being-applied-to-the-cart-at-checkout)

[My routes are not behaving as expected](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-routes-are-not-behaving-as-expected)

[My store is presenting price inconsistencies](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-is-presenting-price-inconsistencies)

[My store translation is not behaving as expected](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-translation-is-not-behaving-as-expected)

---

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting)

Store performance

I can't complete a purchase on a FastStore website

While trying to checkout on a FastStore website, you might see a 'This Connection Is Not Private' error.

**Keywords:** FastStore | Checkout | DNS | SSL

When trying to complete a purchase on your FastStore website, you may receive the following error message: `This Connection Is Not Private`

![{"base64":"  ","img":{"width":734,"height":468,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":169984,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/troubleshooting/store-performance/not-secure-faststore.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/troubleshooting/store-performance/not-secure-faststore.png)

This error occurs when your browser cannot verify whether a website is safe to visit. It usually happens when the browser notices a problem while creating an SSL connection or cannot verify the certificate.

## Solution

To solve this problem, there are two troubleshooting checks and instructions you can follow:

* [Configuring an external DNS](#step-1---configuring-an-external-dns): Ensure your FastStore website is accessible via a custom domain and that the checkout works properly.
* [Check the secure subdomain pointing](#step-2---check-the-secure-subdomain-pointing): If the error persists after configuring an external DNS, check if the `secure` subdomain is pointing to VTEX.

### Step 1 - Configuring an external DNS

Configure an external DNS to allow customers to access your FastStore website through your chosen domain and enable features like VTEX Checkout. See the [Configuring external DNS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/go-live-1-configuring-external-dns) guide for more information.

### Step 2 - Check the `secure` subdomain pointing

If the error continues, check if your website's `secure` subdomain is pointing to `secure.{hostname}.cdn.vtex.com`, where `hostname` is the complete address of your store. To check, follow these steps:

1. Go to your preferred tool, such as the [DNS Checker](https://read.calvincode.net/reader?url=https://dnschecker.org/), to check DNS records for a given domain name.
2. Enter `secure.{hostname}` in the search bar.
3. Choose `CNAME` in the dropdown menu.
4. Check if the `secure` subdomain is pointing to the `secure.{hostname}.cdn.vtex.com`, as in the example below:
![{"base64":"  ","img":{"width":579,"height":191,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":21995,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/troubleshooting/store-performance/secure-hostname-2.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/docs/troubleshooting/store-performance/secure-hostname-2.png)

If the `secure` subdomain is pointing to `secure.{hostname}.cdn.vtex.com` but the problem continues, open a ticket with [VTEX Support](https://read.calvincode.net/reader?url=https://help.vtex.com/en/support).

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_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/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/troubleshooting/store-performance/i-cant-complete-a-purchase-on-a-faststore-website.md)

[I don't see my Store Theme changes« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-dont-see-my-store-theme-changes)[My store is slow or unavailableNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/my-store-is-slow-or-unavailable)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_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/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

ON THIS PAGE

[Solution](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23solution)

[Step 1 - Configuring an external DNS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23step-1-configuring-an-external-dns)[Step 2 - Check the secure subdomain pointing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23step-2-check-the-secure-subdomain-pointing)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/troubleshooting/store-performance/i-cant-complete-a-purchase-on-a-faststore-website.md)

Copy page

On this page

ON THIS PAGE

[Solution](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23solution)

[Step 1 - Configuring an external DNS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23step-1-configuring-an-external-dns)[Step 2 - Check the secure subdomain pointing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website/docs/troubleshooting/i-cant-complete-a-purchase-on-a-faststore-website%23step-2-check-the-secure-subdomain-pointing)

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