Installing Paazls extension for SFCC SFRA

This article explains how to install Paazl's extension in your Salesforce CC SFRA implementation.

Step 1. Install LINK cartridge

Install the int_paazl_sfra and int_paazl_core cartridges in Commerce Cloud UX-studio.

Step 2. Install sgmf-scripts

Salesforce CC has published an NPM node named sgmf-scripts that has tools to compile the CSS and JS scripts for your storefront site. To install and then compile the scripts, execute the following instructions from the command line:

1. npm install sgmf-scripts
2. npm run compile:js && npm run compile:scss && npm run compile:fonts

Normally, you only have to compile the fonts once.

Step 3. Import metadata

To add Paazl configuration functionality to Business Manager, import Paazl's predefined metadata as follows:

1. Download the Paazl LINK installation package from https://github.com/SalesforceCommerceCloud/link_paazl
2. Open the link_paazl-master/site_import/sites/ folder
3. Rename the yourSiteId folder to your site's ID in Salesforce CC Business Manager
4. Zip the site_import folder
5. Import the zipped file into Business Manager (Administration > Site Development > Site Import & Export).

After the import, the following changes will have been made to Business Manager.

Paazl attributes will have been added to:

• Administration > Site Development > System Object Types > Site Preferences > Attribute Definitions
• Administration > Site Development > System Object Types > Order > Attribute Definitions
• Administration > Site Development > System Object Types > Shipment > Attribute Definitions
• Administration > Site Development > System Object Types > Basket > Attribute Definitions

The following services will have been added to Administration > Operations > Services:

• service.paazl.rest.gettoken
• service.paazl.rest.getSelectedOption

The paazl shipping method will have been added to [yourSiteId] > Merchant Tools > Ordering > Shipping Methods.

Step 4. Compile JS and CSS

The Paazl JS and CSS files are part of the int_paazl_core cartridge.

1. Compile the JS and CSS code of the app_storefront_base cartridge as explained in SFRA README.md.
2. Compile the JS and CSS code of the int_paazl_corecartridge.
   1. Go to the top level of your project (just above the cartridges folder).
   2. Make sure that you are using the package.json and webpack.config.js files in the link_paazl repository in GitHub.
   3. Execute the following command:
      

      npm install

   4. Execute the following commands:
      

      npm run compile:js && npm run compile:scss