This article applies to Contextual Commerce. (Looking for Classic Commerce documentation?)
Choosing a Storefront
Store Builder Library must be "initialized" with a specific Storefront. This Storefront will be used when the customer is ready to "check out", and products associated with the Storefront will be available in the data returned by the FastSpring back-end to the Store Builder Library.
You can use either a Web Storefront or a Popup Storefront with the Store Builder Library, depending on the preferred checkout experience. There is no difference in the behavior of the two types of Storefronts in regard to the Store Builder Library and available data.
If you are planning to use a Popup Storefront, you will need to get in touch with FastSpring support to "whitelist" domains where the Popup Storefront will be shown. All of your domains (including those you will use for testing and development) need to be whitelisted.
Selecting Products that will be Accessible with the Library
If you would like to display dynamic, localized product pricing and descriptions to your customers, you need to log on to the FastSpring Dashboard and explicitly choose products which will be delivered to your page. To do this:
For Web Storefronts
- Select Storefronts → Web Storefronts.
- For the Web Storefront you have chosen to use with the Library, click HOMEPAGE. The Homepage Products dialog will appear.
For Popup Storefronts
- Select Storefronts → Popup Storefronts.
- For the Popup Storefront you have chosen to use with the Library, click PRODUCTS. The Homepage Products dialog will appear.
Using the Homepage Products Dialog
In the Main Products field, begin typing the name of the first product you want to add. As you type each character, a list of matching products will be filtered dynamically. To select the product from the list, you can use the arrow keys and press Enter / Return, or just click the desired product. Then, repeat this process to add any additional products that you want to make available to the Library. If you make a mistake, click the red Remove command to the left of the product that you do not want to include in the Storefront.
Note about Web Storefronts
Initializing the Library
After choosing the Storefront and selecting available products, you can insert the Library in all pages where its features will be used.
To Get the Latest Library Code
Navigate to the Storefront of your choice. Then:
- For Web Storefronts, click the LINKS command; the code in the Advanced Links section of the resulting dialog will reference the Storefront and the latest version of the Library.
- For Popup Storefronts, click PLACE ON YOUR WEBSITE. The code in the resulting dialog will reference the Storefront and the latest version of the Library.
The code provided will be limited to a simple reference, but to use advanced features you will need to provide additional data and register callbacks:
Full Code Reference
- id – Required, do not change value, must be "fsc-api".
- data-storefront – Required, the Storefront that the API initializes. Use the Storefront's usual Domain URL without "https://". For example, "vendor.test.onfastspring.com" or "vendor.test.onfastspring.com/holiday". This Storefront will be used when redirecting the customer to checkout. You can use both Test and Live Storefronts here. Test Storefronts might not respond as quickly as Live Storefronts.
- data-access-key – Required for making requests with the secure payload. Please refer to Passing sensitive data with Secure Requests for more information.
- data-debug – The default is "false". When set to "true", the Library provides extensive logging and other information to the browser console.