Using the Mobile Cartridge

The Commerce Cloud Mobile: Mobile Web Storefront cartridge (called Mobile) is available as a down load form the Salesforce B2C Commerce code repository. It contains sample code, from which you can develop your mobile application. This cartridge is designed to be stand-alone, loaded into the same site as the standard storefront cartridge.

When a customer enters the site, the mobile device's user agent will call the appropriate pipelines, templates and scripts based on cartridge-specific naming conventions. Though this is the strategy we used to develop our mobile application, you can also customize your application to support a single-cartridge implementation.

We implemented a mobile-specific naming convention so that B2C Commerce can easily distinguish between SiteGenesis and Mobile eCommerce elements such as pipelines, templates and scripts.

While developing your storefront, and working on a development or staging instance, you can access Storefront Toolkit capabilities through tabs at the top of the browser.

See Storefront Toolkit.

  1. Open the mobile cartridge in Studio and take an inventory of its development elements:
    Option Description
    Forms These did not change for the mobile application.
    Pipelines Pipelines are prefixed with 'm' (for example, mCart).
    Scripts The scripts directory is mobile.
    CSS Status/default/css contains mobile.css and print.css
    Images static/default//images/mobile/images contains the mobile application's images.
    js static/default/js contains the mobile application's js file, mobileapp.js.
    Templates The base directory is templates/default/mobile. The page template is default/mobile/util/pt_mobile.isml.
    Content slot template Content slots templates are under default/slots. There is one content slot template: html/htmlslotcontainer.isml
    Resources These did not change for the mobile application.
  2. Determine how you have modified your application relative to SiteGenesis.
  3. Add the MobileApp cartridge to the SiteGenesis cartridge path and remove all other cartridges. See Implementing a Mobile Web Storefront.
X Privacy Update: We use cookies to make interactions with our websites and services easy and meaningful, to better understand how they are used and to tailor advertising. By continuing to use this site you are giving us your consent to do this.