đź“Ť Bolt Help / Platforms / Salesforce Commerce Cloud / SFCC V1 - Managed Checkout / Set Up SSO Commerce for SFCC V1
Set Up SSO Commerce for SFCC V1
Learn how to set up SSO Commerce buttons and stylings on your SFCC V1 SFRA storefront.

Before You Start

  • You have upgraded to the latest plugin version
  • You have requested from Salesforce that SetCustomer be enabled for your SFRA storefront
  • You have contacted Bolt to request SSO Commerce and begin shopper Account Activation.

How to Set Up SSO Buttons and Scripts

Step 1: Replace all Log in and Track My Order buttons

  1. Navigate to your storefront’s theme files.
  2. Make a copy the active theme.
  3. Replace all login buttons with the Bolt SSO button using the following:
<div class="bolt-account-sso navUser-action" data-logged-in="false" style="justify-content: center;">&nbsp;</div>

Step 2: Customize Button Styling

Use the following styles to override the button’s font and icon color:

<style>
    --bolt-account-sso-color: #fff;
    --bolt-account-sso-font: 'Verdana';
    --bolt-account-sso-font-size: 16px;
    --bolt-account-sso-font-weight: 700;
</style>

You can also add classes to the bolt-account-sso div as necessary to customize the style further.

WARNING

Do not replace icon-only buttons. Instead, add class=”bolt-sso-custom" data-logged-in="true/false". This enables the icon button to trigger Bolt SSO instead of redirecting to the platform login page.

Step 3: Install Required Scripts

Ensure the following account script is loaded whenever the button is created, using one of the following script URLs for {{bolt-script-url}}:

  • Sandbox: https://connect-sandbox.bolt.com/account.js
  • Production: https://connect.bolt.com/account.js
<script id="bolt-account" type="text/javascript" src="{{bolt-script-url}}" data-publishable-key=$KEY></script>

Step 4: Hide PII on Order Confirmation Page

To protect account security, Bolt SSO Commerce does not log shoppers into newly created and unauthenticated storefront accounts.

To support an unauthenticated post-checkout experience, complete the following:

  • Ensure your storefront supports guest checkout (B2B Commerce for Visualforce Winter ‘21/version 4.13, or later)
  • Set Display Guest Confirmation Information to false to hide PII on the order confirmation page

For more information, refer to the Salesforce documentation “Show Order Confirmation Details and Send Order Emails.”

If you use a B2B Commerce version earlier than 4.13 that does not support guest checkout, you must replace the default order confirmation page with a custom page in order to hide PII details.

Step 5: Define Redirects (Optional)

You can specify where a link or button redirects to after successful login, using the following html attribute: data-destination-on-success=”{{urls.accounts.example.all}}”

For example, you can redirect to a wishlist when a non-logged in user selects a wishlist link. This would present the SSO Commerce modal for authentication before redirecting the shopper to their wishlist page.

data-destination-on-success=”{{urls.accounts.wishlists.all}}”

Step 6: Contact Bolt

Once you have completed setup, contact Bolt so that our team can:

  • Re-run necessary Account Activation steps to capture any newly added accounts.
  • Enable all imported accounts.

Testing

TIP

Bolt recommends setting up a sandbox environment first before making any changes in production. Preview mode does not work for testing Bolt SSO Commerce.

  1. Test the Login/Register button. This action should populate the SSO Modal. Try going all the way through the login flow with your own Bolt account.
  2. Test any Icons or Elements with the id=”bolt-sso-custom” attribute. This action should populate the SSO modal.
Filter by Section
Filter by Topic