SFCC V2 Checkout Installation Guide

Before You Start

• You must have a storefront with a base cartridge up and running.
• Ensure your store is using Storefront Reference Architecture version 5.3.0 and 21.2 compatibility mode.
• The Bolt integration requires OCAPI access to all of the following data elements:
  • • Baskets: GET, POST, PUT, PATCH
  • • Orders: GET, POST, PUT
  • • Customers: GET, POST
  • • Products: GET
• You must know the code version of your cartridge (Business Manager Administration > Site Development > Code Deployment).
• This integration requires System Object Extension to store payment-related information and Custom Object Extension to store basket related information.

Upload Cartridge to SFCC DigitalServer

1. Clone the Bolt cartridge from this GitHub Repository
2. Create a config file called dw.json in the root of the directory that contains the Bolt cartridges with the following information. Replace YOUR_HOST with your host name, USERNAME with your user name, PASSWORD with your password, and YOUR_CODE_VERSION with your site’s code version.

    {
    "hostname": "YOUR_HOST.demandware.net", //without http// or https://
    "username": "USERNAME",
    "password": "PASSWORD",
    "cartridge": ["cartridge A", "cartridge B"], //optional
    "code-version": "YOUR_CODE_VERSION"
    }
   
   

Upload

Via Visual Studio Code

1. Ensure dw.json from the step above is configured correctly.
2. Open Visual Studio Code.
3. Navigate to Extensions and search for Prophet Debugger by SqrTT and click Install.
4. In VSCode, open the folder containing your cartridges.
5. Navigate to File > Preferences > Settings
6. Search the settings for extension.prophet.upload.enabled.
7. Set this setting to true.
8. Restart VSCode.
9. Select the cloud icon then the ellipses next to CARTRIDGES.
10. In the drop-down list, select Prophet: Enable Upload.
11. In Business Manager navigate to Administration > Site Development > Code Deployment.
12. Choose the version of the code you specified in the dw.json file.

Configure Business Manager

You must make the following changes in Business Manager to complete the installation.

Activate the Bolt Cartridge

1. Navigate to Administration > Sites > Manage Sites.
2. Select the site name and navigate to the Settings tab.
3. Select the correct Instance Type from the dropdown.
4. In the Cartridges input field, add int_bolt_v2_sfra:int_bolt_v2 in front of the base cartridge path.
5. Select Apply.
6. If you have additional storefronts, repeat steps 2-5 for each.

Configure Open Commerce API Settings

1. Navigate to Administration > Site Development > Open Commerce API Settings.
2. Navigate to metadata/ocapi folder.
3. Copy the contents of OCAPIshop_v2.json within Shop Type > Open Commerce API Settings.
4. Replace «client_id» with your client_id.
5. Click Save.
6. Copy the content of OCAPIdata_v2.json within Data Type > Open Commerce API Settings.
7. Replace «client_id» with your client_id.
8. Click Save.

Import Metadata

You need to import the following metadata for the Bolt integration to work.

1. Open the cartridge bundle.
2. Navigate to the metadata/Bolt-meta-import/Sites/RefArch folder.
3. Rename the RefArch folder to be the same as the ID of your site. If you need to import metadata for multiple sites, take the following steps:
   • a. Copy and paste the RefArch folder to each site.
   • b. Rename those folders to be the same as the ID of corresponding sites.
4. Open the specific site folder and find the library folder.
5. Edit the library/library.xml file to change the library-id. If your site uses a private library, then remove the library-id attribute and its value. If your site uses a shared library, then replace the existing library-id ‘RefArchSharedLibrary’ in the XML with your shared library id.
6. Save the library.xml file.
7. In the cartridge bundle, navigate to the metadata folder and compress the Bolt-meta-import folder to generate the Bolt-meta-import.zip file.
8. Navigate to Business Manager > Administration > Site Development > Site Import & Export.
9. Under Import > Upload Archive, ensure that local is enabled.
10. Select Choose File and select the Bolt-meta-import.zip file.
11. Select Upload.
12. Once complete navigate to the Archives list and select the radio button corresponding to Bolt-meta-import.zip.
13. Select Import.
14. Select OK from the confirmation box.

Custom Site Preferences

1. Log into Business Manager.
2. Navigate to Merchant Tools > Site Preferences > Custom Preferences.
3. Ensure the preference group with the ID Bolt Payment Setting is available.
4. Select Bolt Payment Setting and edit the attributes according to your Bolt account data. For each site, set the values for your site preferences as follows below:

Customizing Code

You do not need to modify the base SFRA cartridge for the Bolt integration to work. The file int_bolt_v2_sfra /int_bolt_v2 follows best practices recommended by Salesforce Commerce Cloud.

Checkout Buttons

To replace checkout buttons with Bolt buttons:

1. Navigate to int_bolt_v2_sfra/cartridge/templates/default/cart/boltButton.isml
2. Find the checkout buttons in your code base and replace them with the file above.
3. Add the contents of /js/boltModalConfigure.js to the <isscript> where the button is located.
4. Add the following code snippet to page.isml

<input type="hidden" class="update-bolt-button" value="${URLUtils.https('BoltCheckoutButtonUpdate-GetUpdatedButton')}">