---
schema_version: "1"
id: 22efa24c0a51cb940340dc35457e1545e8cef55412c7a7b9fd2982ad93286b0e
title: Install the Agentforce Commerce Client on Storefront Next
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/commerce-cloud/b2c-commerce/guides/agentforce-commerce-client/install-on-sfnext.md
canonical_url: https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/install-on-sfnext.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 0dfd4438c821c79353a5647296c29889d78aea63839b58cfbc3c0764b7f5a3ff
products:
  - Composable Storefront
  - Salesforce APIs
---
# Install the Agentforce Commerce Client on Storefront Next

For Storefront Next, enable and configure Agentforce Commerce Client through a Managed Runtime environment variable, `PUBLIC__app__cimulateAgent`. The [storefront-next](https://github.com/SalesforceCommerceCloud/storefront-next-template) template reads that variable, selects the Commerce Client provider, and injects the widget for you.

## Prerequisites

The setup is covered in [B2C Shopper Agent Setup](https://help.salesforce.com/s/articleView?id=cc.b2c_shopper_agent_setup_intro.htm&type=5). In particular, these are the prerequisites:

- [Required Licenses for the B2C Shopper Agent](https://help.salesforce.com/s/articleView?id=cc.b2c_shopping_agent_licences.htm&language=en_US&type=5): Make sure your org has the required licenses provisioned for the B2C Shopper Agent.
- [Enable Agentic Commerce Search for the Shopper Agent](https://help.salesforce.com/s/articleView?id=cc.b2c_agentic_comm_search_enable.htm&language=en_US&type=5): Enable Agentic Commerce Search so that Shopper Agent can return relevant product results.
- [Create a B2C Shopper Agent Using the Automated Setup](https://help.salesforce.com/s/articleView?id=cc.b2c_shopper_agent_run_auto_setup.htm&type=5): Run the automated setup to provision and configure the B2C Shopper Agent on your Salesforce org. This includes setting up the Embedded Service deployment, obtaining the org ID, SCRT2 URL, and ES developer name, which are then supplied via the configuration below.

## Enable the Client

Set the `PUBLIC__app__cimulateAgent` environment variable on your Managed Runtime environment, or in your local `.env` file for local development.

To add an environment variable in Runtime Admin:

1. Log in to the Runtime Admin (`https://runtime.commercecloud.com/`).
2. Select your project, then the environment.
3. Under **Environment Variables**, add `PUBLIC__app__cimulateAgent` with this JSON value.

   ```json
   {
     "enabled": "true",
     "provider": "commerce-client",
     "commerceClientScriptSourceUrl": "https://cdn.search.cimulate.ai/copilot-widget/1.36.0/messaging.umd.js",
     "scrt2Url": "https://your-org.salesforce-scrt.com",
     "salesforceOrgId": "00Dxx0000000001",
     "esDeveloperName": "My_Embedded_Service",
     "headerText": "Commerce Assistant",
     "disclaimerMarkdown": "This is AI and can make mistakes.",
     "commerceClientDisplayMode": "panel",
     "commerceClientPanelWidth": "420px",
     "commerceClientMode": "messaging",
     "commerceClientLogoUrl": "https://cimulate.ai/logo.png"
   }
   ```

4. Replace fields in `PUBLIC__app__cimulateAgent` with valid values. In your Salesforce org, go to **Setup > Service > Embedded Service > Embedded Service Deployments**, and then open the deployment for the agent created in the automated setup (see [Create a B2C Shopper Agent Using the Automated Setup](https://help.salesforce.com/s/articleView?id=cc.b2c_shopper_agent_run_auto_setup.htm&type=5). Then click **Install Code Snippet**. Copy these values to the JSON value for `PUBLIC__app__cimulateAgent`:

   - Replace the `esDeveloperName` value with the copied `DeveloperName` value.
   - Replace the `scrt2Url` value with the copied `Url` value. The SCRT2 URL is the endpoint used by the embedded chat widget to communicate with the messaging service backend.
   - Replace the `salesforceOrgId` value with the copied `OrganizationId` value.
   - `commerceClientScriptSourceUrl` refers to the script of the Cimulate NPM package that powers search. We recommend you use the latest version in the URL, which is currently set to `/1.36.0/`. Get the latest version from https://www.npmjs.com/package/@cimulate/copilot-widget.

The Shopper Agent is now configured for your Storefront Next storefront.

## Roll Back Commerce Client

Because the widget is driven entirely by `PUBLIC__app__cimulateAgent`, disable it by setting `"enabled": "false"` or by removing the `PUBLIC__app__cimulateAgent` environment variable.

## Related resources

- [Shopper Agent for Storefront Next](https://developer.salesforce.com/docs/sfnext/guides/sfnext-shopping-agent.md)
- [Agentforce Commerce Client Overview](https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/agentforce-commerce-client-overview.md)
- [Configure the Agentforce Commerce Client](https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/configure-the-commerce-client.md)