This article describes integration of Green Story cartridge with Salesforce Commerce (sfcc) cloud
Client specific inputs
Client Keys
- Client ID: XXXXXXXXXXXXXXXXXXXXXXXXXXX
- SHA-256 Shared Key: XXXXXXXXXXXXXXXXXXXXXXXXXX
Generic Inputs
greenstoryJS value:
- <script type="text/javascript" src="https://gsstatic.greenstory.ca/widgets/app/greenstoryinit.js"></script>
Email html
(only if per order carbon offsetting is enabled)
Summary
This cartridge provide solution that enables Salesforce Commerce Cloud Clients to export the products and orders to greenstory platform.
The cartridge provides the following main features: 1) Cartridge export the bulk products or recently created products and orders to green story platform.
Version: 1.0
Date: 19-Jan-2021
Component Overview
Limitations
- The cartridge operates within the Salesforce Commerce Cloud instance limitations, as allowed by the system.
- This cartridge only allows products and order to exported.
- This cartridge will only be able to export the products which are assigned to the master catalogue.
- For the products we are using ProductSearchModel, so all the products should be online and searchable.
- The Cartridge is using ProductSearchModel for exporting products, the ProductSearchModel require re-indexing and rebuild after product creation and updating any product config.
Compatibility
- The int_greenstory cartridge is compatible with Compatibility Mode 19.10.
- The int_greenstory cartridge is compatible with SFRA version: v5.1.0
Cartridge Installation
To integrate Salesforce Commerce Cloud with Greenstory, you will need to follow these steps:
Import Metadata
- To import Sitesdata, zip the folder “metadata”, name it metadata.zip and import the zip file into your instance (Meta Data, Jobs, Services and Custom Preferences).
- To Import and upload metadata.zip files, you will need to follow these steps:
- To import the metadata folder, go to Business Manager > Administration > Site Development > Site Import & Export as shown below:
- Upload metadata.zip archive
- Select metadata.zip folder and import it.
Assigning the Cartridge Path
Assigning the Site cartridge path for Controller
- Upload the following cartridge to your instance site active code using WebDAV: int_greenstory
- After uploading the cartridges, follow the instructions below for applying the cartridge path.
- Go to Business Manager -> Administration -> Sites -> Manages Sites, select SiteGenesisGlobal or current site id and visit the “Settings” tab.
- Go to Business Manager -> Administration -> Sites -> Manages Sites, select SiteGenesisGlobal and visit the “Settings” tab.
Cartridge Path: int_greenstory:Sitegenesis_storefront_controllers:Sitegenesis_storefront_core
Assigning the Site cartridge path for SFRA
- Upload the following cartridges to your instance site active code using WebDAV: int_greenstory
- After uploading the cartridges, follow the instructions below to specify the cartridge path.
- Go to Business Manager -> Administration -> Sites -> Manages Sites -> select RefArchGlobal or current site id and go to “Setting” tab.
- Assign the int_greenstory cartridge to your site’s cartridge path like this. It can be placed anywhere in the cartridge path.
Cartridge Path: int_greenstory:app_storefront_base
Site preferences configuration
The cartridge will make use of a set of site preferences, which are identified in the tables below.
Attribute ID | greenstoryClientID |
Attribute Display Name | Greenstory Client ID |
Type | String |
Description | Use to place Client ID that is given by greenstory |
Attribute ID | greenstoryJS |
Attribute Display Name | Greenstory Global JS |
Type | String |
Description | Use to include Greenstory’s js file |
Attribute ID | enableGreenstory |
Attribute Display Name | Enable Greenstory Widget |
Type | Boolean |
Description | Main switch activate/deactivate all Greenstory visuals |
Default Value | No |
Attribute ID | greenstorySHA-256SharedKey |
Attribute Display Name | Green Story SHA-256 Shared key |
Type | String |
Description | Use to place Greenstory SHA-256 Shared Key |
Mandatory | No |
Attribute ID | enableGsHomeWidget |
Attribute Display Name | Enable Greenstory Home Widget |
Type | Boolean |
Description | Use to enable Greenstory Footprint/Impact Counter widget on home page |
Default Value | Yes |
Attribute ID | enableGsHomeBrandWidget |
Attribute Display Name | Enable Greenstory Home-Brand Widget |
Type | Boolean |
Description | Use to enable Greenstory carbon offset summary widget on home page |
Default Value |
Attribute ID | enableGsProductWidget |
Attribute Display Name | Enable Greenstory Product Widget |
Type | Boolean |
Description | Use to enable Greenstory Footprint/Impact widget on product details page |
Default Value |
Attribute ID | enableGsProductCnWidget |
Attribute Display Name | Enable Greenstory Product Carbon Neutral Widget |
Type | Boolean |
Description | Use to enable Greenstory Carbon Neutral widget on product details page |
Default Value | Yes |
Attribute ID | enableGsCartWidget |
Attribute Display Name | Enable Greenstory Cart Widget |
Type | Boolean |
Description | Use to enable Greenstory Footprint/Impact widget on cart page |
Default Value | Yes |
Attribute ID | enableGsAccountWidget |
Attribute Display Name | Enable Greenstory Account Widget |
Type | Boolean |
Description | Use to enable Greenstory Footprint/Impact widget on customer account page |
Default Value | Yes |
Attribute ID | greenstoryEmailWidget |
Attribute Display Name | GreenStory Email Widget |
Type | boolean |
Description | Insert HTML code for carbon neutral email button |
Attribute ID | enableGsEmailTemplate |
Attribute Display Name | GreenStory Email Widget |
Type | HTML |
Description | Indicates email confirmation template |
Attribute ID | greenstoryBrandAttribute |
Attribute Display Name | GreenStory Fallback brand value |
Type | String |
Description | Indicates the fallback value for brand value |
Attribute ID | greenstoryLanguage |
Attribute Display Name | Greenstory Language |
Type | Enum of string |
Description | Set the fallback Language for widgets |
Attribute ID | greenstoryLocale |
Attribute Display Name | Greenstory Locale |
Type | Enum of string |
Description | Set locale for widgets (used to change number format) |
Attribute ID | greenstoryMaxProductsPerJSON |
Attribute Display Name | Greenstory Max Products Per JSON |
Type | integer |
Description | Indicates Maximum number of products per json for sync |
Site preferences group configuration
- The custom site preferences previously identified will be grouped into an attribute group as indicated in the table below. You can use Business Manager: Administration > Site Development > System Object Types > SitePreferences > Attribute Grouping to configure the grouping.
Attribute Group ID | Attribute Group Name |
Greenstory Configs | Greenstory Configurations |
Defining the site preferences
- To define the values of the created site preferences, use the Custom Site Preferences editor in Business Manager (Site > Site Preferences > Custom Preferences). Select “Greenstory Configurations” and set the values for the configuration attributes.
Service Framework configuration
- In order to make use of the Service Framework with The Cartridge, you need to configure the respective services. The necessary configuration is present in the metadata file “services.xml” that accompanies the cartridge. You can view these services from Business Manager > Administration > Operations > Services
- On the Services tab you should see 1 service configured (see image below).
- On the Profiles tab you should see 1 service profile configured (see image below).
- Every Service will have their Credentials configured. User can find Credentials under “Credentials” tab as shown in below screenshot.
- The URL will be provided by Greenstory.
Configuration of Jobs
- Most of the jobs are configured using predefined steps in steptypes.json. Please refer to steptypes.json below for each step configuration.
- For all jobs, the execution scope is related to a given site, and so it is necessary to assign the desired site.
- To Assign a Site to a job in the business manager:
- Go to Administration > Operation > Jobs
- Click or Select the job that you want to assign to a site.
- After selecting the job, go to the Job Steps tab, and you will see the Scope.
- Click on Scope and select the site that you want to assign to the job.
- At the time of job configuration, open the Greenstory-Product job, open Job-steps and you should see checkbox as shown in below image. If that checkbox is checked or ticked, then only recently created products will be exported to Greenstory and if checkbox is unchecked then all products in catalog will be exported.
- The other jobs execute support operations for the cartridge.
- The use of jobs allows the cartridge to operate within a greater value of timeout limit, as limited by the Salesforce Commerce Cloud platform.
- You can follow the status of each job’s execution in Administration > Job History.
Customized code
Module.isml template
- We Need to include module.isml template in all the widgets template. For that, we need below sysntax. So, when we are including any widgets at that time we need to include module.isml in template.
- <isinclude template="/components/gsModules" sf-toolkit="off" />
- By this we can include our Greenstory module file.
- File Path: int_greenstory\cartridge\templates\default\components\gsModules.isml
Homepage Counter Visual Widget
- Add the following tag wherever the total impact visual needs to appear.
- <isgsHomeWidget />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/content/home/homepage.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/home/homePage.isml
Homepage Brand Offset Visual Widget
- Add the following tag wherever the total impact visual needs to appear.
- <isgsHomeBrandWidget />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/content/home/homepage.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/home/homePage.isml
Product Impact Visual
- Add the following tag wherever the total impact visual needs to appear.
- For Controller:
- <isgsProductWidget productid="${pdict.Product.ID}" />
- For SFRA:
- <isgsProductWidget productid="${pdict.product.id}" />
- Note: In the above product widget need to pass product id. So user have to paste variable name
- that fetch the product id.
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/product/productdetail.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/product/productDetails.isml
Product Carbon Neutral Visual Widget
- Add the following tag wherever the total impact visual needs to appear.
- For Controller:
- <isgsProductCnWidget productid="${pdict.Product.ID}"/>
- For SFRA:
- <isgsProductCnWidget productid="${pdict.product.id}" />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/product/productdetail.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/product/productDetails.isml
Mini-cart Impact Visual
- Add the following tag wherever the total impact visual needs to appear.
- <isgsMiniCartWidget />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/checkout/components/minilineitems.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/checkout/cart/miniCart.isml
Cart Impact Visual
- Add the following tag wherever the total impact visual needs to appear.
- <isgsCartWidget />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/checkout/cart/cart.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/cart/cart.isml
Account Visual Widget
- Add the following tag wherever the total impact visual needs to appear.
- <isgsAccountWidget />
- File Path (Controller):
- Sitegenesis_storefront_core/cartridge/templates/default/account/accountoverview.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/account/dashboardProfileCards.isml
Email Template for the Order Confirmation email
- Add the following code into below file.
- <isinclude template="greenstory/gsEmailConfirmation" />
- File Path (Controller): Sitegenesis_storefront_core/cartridge/templates/default/checkout/confirmation/confirmation.isml
- File Path (SFRA):
- app_storefront_base/cartridge/templates/default/checkout/confirmation/confirmationEmail.isml
Note:
In order confirmation email template (int_greenstory/cartridge/templates/default/greenstory/gsAccountWidget.isml), change the line #8 as mentioned below according to existing framework (Controller or SFRA).
Pass the orderID as mentioned below. Refer the screenshot as well.
For Controller: pdict.Order.orderNo
For SFRA: pdict.order.orderNumber
For Controllers:
COPlaceOrder.js
- File Path: Sitegenesis_storefront_controllers\cartridge\controllers\COPlaceOrder.js
- Below code is added to COPlaceOrder-Start after the order is submitted.
- var orderJson = require('*/cartridge/scripts/greenstoryHelpers/gsOrder.js'); orderJson.exportOrder(order);
For SFRA :
Order.js
- File Path: app_storefront_base\cartridge\controllers\Order.js
- Below code is added to Order-Confirm after the order is submitted.
- var orderJson = require('*/cartridge/scripts/greenstoryHelpers/gsOrder.js');
orderJson.exportOrder(order);
For the buyer_accpets_marketing field in order json, the retailer need to add their own logic in the below created function in gsOrder.js file in int_greenstory cartridge.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article