# Salesforce Commerce Cloud Get started with our Salesforce Commerce Cloud (SFCC) integration, from installing the LINK cartridges to making your first test payment. > **Information** > > You can use our LINK cartridges with Storefront Reference Architecture (SFRA) or controller-based SiteGenesis. --- ## Supported features - Manual capture, void, and refund from the [Dashboard](https://dashboard.checkout.com) and the SFCC Business Manager - Multiple partial captures via the Business Manager - Multiple partial refunds via the Business Manager - Embedded payment form using our [Full card details API](https://www.checkout.com/docs/payments/accept-payments/request-a-payment.md#Using_full_card_details) - [Saved cards (stored credit cards)](https://www.checkout.com/docs/payments/store-and-manage-credentials/store-credentials.md) - Invoice generation - [3D Secure 2.0](https://www.checkout.com/docs/risk-management/3d-secure.md) - Webhooks for up-to-date payment statuses - Gift certificates on SiteGenesis - Support for payments in the Kingdom of Saudi Arabia (KSA) region - Support for [Risk.js](https://www.checkout.com/docs/developer-resources/sdks/risk-sdks/risk-js-sdk.md) SDK --- ## Before you start ### Get your API keys To set up our SFCC integration, you'll need 3 API keys: a secret key, a public key, and an authorization header key. You can create your [secret and public keys](https://www.checkout.com/docs/resources/api-authentication/api-keys.md) in the Dashboard. The authorization header key is generated when you create a webhook for your business. ### Create a webhook Webhooks are notifications that we send when an event occurs on your account (for example, when a payment is captured). These are used by the SFCC plugin to update the status of an order. See [Receive webhooks](https://www.checkout.com/docs/developer-resources/event-notifications/receive-webhooks.md). 1. Sign in to the [Dashboard](https://dashboard.checkout.com). 2. Select _Developers_ in the left navigation bar and open the _Webhooks_ tab. 3. Select _New webhook_. 4. Give the new webhook a name to make it easier to identify in the future. 5. Enter a webhook URL that starts with either `https://` or `http://`. 6. Enter an authorization key. To validate that the webhook is genuine, this will be in the header of every webhook we send you. 7. Enter a signature key. Checkout.com generates a hash-based message authentication code (HMAC) from the webhook payload, using the key provided in your workflow's webhook action. The HMAC will be in every notification you receive. 8. You can configure HTTP headers which will be included in each webhook. You can use this feature to configure a key that you want to provide in your webhook's Authorization HTTP header, allowing you to authenticate requests with your server. 9. Select the events you want to receive webhooks for. There is no limit to the number of events you can select per endpoint. 10. Webhooks are set up at a client level, which means you will receive notifications for all entities and processing channels. However, you can filter the updates to specific entities and processing channels. 11. Select _Create webhook_ to publish your endpoint. It will be live from this point onwards. --- ## Install the LINK cartridges ### Before you start * Contact your account manager or [request support](https://dashboard.checkout.com/support/new?topic=case_account_management_and_access&issue=issue_account_changes) to get access to our installation package containing: - The front-end cartridges for SFRA (`int_checkoutcom_sfra`) and SiteGenesis (`int_checkoutcom`) - The back-end cartridge (`bm_checkoutcom`), which is compatible with both SFRA and SiteGenesis ### Upload the cartridges 1. Upload the relevant cartridges to your server, using a tool like UX Studio: - If you're using SFRA, install `int_checkoutcom_sfra` and `bm_checkoutcom`. - If you're using SiteGenesis, install `int_checkoutcom` and `bm_checkoutcom`. 2. Sign in to your Business Manager account, and go to _Administration_ > _Sites_ > _Manage Sites_ > \[your site\] > _Settings_. 3. In the _Cartridges_ field, add one of the following to the front of the cartridge path and select _Apply_: - For SFRA, add `int_checkoutcom_sfra:`. - For SiteGenesis, add `int_checkoutcom:`. 4. In the Business Manager, go to _Administration_ > _Sites_ > _Manage Sites_. 5. Go to the _Business Manager Site_ section and select _Business Manager_. 6. Add `bm_checkoutcom:` to the front of the cartridge path and select _Apply_. ### Import the metadata 1. In a file browser, open the `metadata` folder in the installation package you downloaded earlier, then go into the `sites` subfolder. 2. Rename the default named folder to the name of the site for which you want to import the cartridge: - For SFRA, rename the `RefArchGlobal` folder to the name of your site. - For SiteGenesis, rename the `SiteGenesisGlobal` folder to the name of your site. 3. Navigate back to the package's root folder, and zip the `metadata` folder. 4. Next, log in to Business Manager and go to _Administration > Site Development > Site Import & Export_. 5. Under _Upload Archive_, select _Local_ and then _Choose file_. 6. Find the `metadata.zip` you just created, select _Open_ and then _Upload_. ![Site Import & Export screen in Salesforce Commerce Cloud](https://www.checkout.com/docs/Integrate/Salesforce/sfcc-site_import_export.png) ### Edit the template file (SiteGenesis only) > **Note** > > The Checkout.com credit card form is not compatible with the default SiteGenesis credit card form. Please disable the default credit card form if using the Checkout.com credit card form, and vice versa. If you use SiteGenesis, you also need to edit the payment methods template in order to show the Checkout.com payment option on the billing page. To do so, add the following code snippet to the `/app_storefront_core/cartridge/templates/default/checkout/billing/paymentmethods.isml` file: ```html Checkout.com - Integration example Add this code to your paymentmethods.isml file -------------------------------------------------------------- Site Genesis - Default Credit card block Add the default SiteGenesis credit card form code here. -------------------------------------------------------------- ``` This will display the Checkout.com credit card form if enabled in the custom preferences, and display the default Site Genesis credit card form if not. > **Information** > > If your site is also using the default SiteGenesis credit card form, place the code of the form (found in the core `paymentmethods.isml` template file) after the `` block in the snippet. --- ## Configure the cartridges 1. Sign in to Business Manager, and go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [1] Sandbox Keys_. 2. Set _ABC or NAS Enabled_ to _NAS_. 3. Enter the public key and secret key from your sandbox Dashboard account, prefixed with `Bearer`. For example, `Bearer pk_sbox_xxxxxx`. 4. Enter the authorization header key from your sandbox Dashboard account, and select _Save_. 5. Go back to the custom site preferences page and select _CKO [4] Payment Settings_. 6. Make sure _Enable_ is set to _Yes_, to enable the Checkout.com card payment form. 7. Set _Mode_ to _Sandbox_, so you can start testing card payments. 8. If you'd like to log gateway requests in the request log, set _Enable debug mode_ to _Yes_. 9. Choose whether or not you want to _Auto capture_ your payment. Set this field to _Yes_ if you want payments to be captured immediately after being authorized. Set it to _No_ if you want to capture payments manually. 10. If you set _Auto capture_ to _Yes_, you can specify the delay (in minutes) before the payment is captured. The default is `0`. 11. Go back to the custom site preferences page and select _CKO [3] Business Details_. 12. Enter your business name (the name of your shop), and fill in the business address, city and country fields. 13. Select _Save_. That's it! You're ready to start testing card payments. --- ## Test your integration 1. Go to your storefront and add a product to your cart. 2. Go to your cart and proceed to the checkout. 3. Enter the required billing details. You can put anything here, though we recommend using a real email address so you can receive the order confirmation. 4. Select the _Pay by Card with Checkout.com_ method. 5. Enter [test card details](https://www.checkout.com/docs/testing/test-cards.md) (you can use any future expiry date). 6. Select _Place order_, and you will be redirected to the order confirmation page. If you entered a real email address in the billing details, you'll also receive an order confirmation email. 7. Sign in to Business Manager. 8. Go to _Merchant Tools > Ordering > Orders_ and select _Find_ to show your orders. Your test order is displayed with a `New` status. The status indicates that the payment has been successfully authorized and captured. The transaction also appears in the _Payments_ > _Processing_ > _All Payments_ section of your Test Dashboard. You can now either [go live](#Go_live) as-is or [extend your configuration](#Extend_your_configuration). For test cards and a range of possible scenarios, see [Testing](https://www.checkout.com/docs/developer-resources/testing.md). > **Note** > > If this test does not work, first check you have configured your webhooks correctly. For the plugin to work, they must be formatted correctly. If you have configured them properly, check your server: if it's password-protected or it restricts unfamiliar IP addresses, it may be blocking webhook notifications. If you need help, you can [request support](https://dashboard.checkout.com/support/new?topic=case_account_management_and_access&issue=issue_account_changes). --- ## Go live If you're happy with the outcome of your testing and want to start taking payments right away, please [contact our Sales team](https://www.checkout.com/contact-sales) in order to move to a live account. > **Note** > > Before you go live, remember to: > > - Switch the cartridge _Mode_ from _Sandbox_ to _Live_ in Business Manager. > - Enter your live public, secret and authorization header API keys in the Checkout.com _Live API_ section of _Custom Site Preferences_. > - Configure the webhook URLs in your live Dashboard account. --- ## Extend your configuration You can extend your Salesforce Commerce Cloud integration in multiple ways to suit all your business needs. In this section, you'll learn how to: - [Add more payment methods](#Add_more_payment_methods) - [Enable 3D Secure payments](#Enable_3D_Secure_payments) - [Enable Mada card payments](#Enable_Mada_card_payments) - [Set a billing descriptor](#Set_a_billing_descriptor) - [Manually capture, void and refund payments](#Manually_capture,_void_and_refund_payments) ### Add more payment methods > **Note** > > To start accepting an alternative payment method, we first need to enable it on your account. Contact your account manager or our [Sales team](https://checkout.com/contact-sales) to get started. We support the following payment methods on SFCC: - [Apple Pay](https://www.checkout.com/docs/payments/add-payment-methods/apple-pay.md) - [Google Pay](https://www.checkout.com/docs/payments/add-payment-methods/google-pay.md) - [Bancontact](https://www.checkout.com/docs/payments/add-payment-methods/bancontact.md) - [Cartes Bancaires](https://www.checkout.com/docs/payments/add-payment-methods/cartes-bancaires.md) - [EPS](https://www.checkout.com/docs/payments/add-payment-methods/electronic-payment-standard-eps.md) - [iDEAL](https://www.checkout.com/docs/payments/add-payment-methods/ideal.md) - [Klarna](https://www.checkout.com/docs/payments/add-payment-methods/klarna-payments.md) - [Klarna Debit Risk](https://www.checkout.com/docs/payments/add-payment-methods/klarna-debit-risk.md) - [KNET](https://www.checkout.com/docs/payments/add-payment-methods/knet.md) - [Mada](https://www.checkout.com/docs/payments/add-payment-methods/mada.md) - [Multibanco](https://www.checkout.com/docs/payments/add-payment-methods/multibanco.md) - [PayPal](https://www.checkout.com/docs/payments/add-payment-methods/paypal.md) - [Przelewy24](https://www.checkout.com/docs/payments/add-payment-methods/przelewy24.md) Check the individual payment method pages to see which ones you can support. It will depend on your location, as well as the currency and billing address of your customer. #### Enable alternative payments 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [5] APM Settings_. 3. Set the payment methods you want to support to _Yes_. 4. Select _Save_. #### Apple Pay > **Information** > > Before going through these steps, you need to [set up and configure Apple Pay](https://www.checkout.com/docs/payments/payment-methods/apple-pay/set-up-apple-pay.md). 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Ordering > Payment Methods_. 3. Set _Enable_ to _Yes for CHECKOUTCOM_APPLE_PAY_ and save the changes. 4. Go to _Merchant Tools > Site Preferences > Apple Pay_. 5. Choose in which environment you want to run Apple Pay: Test or Production. 6. Toggle the _Apple Pay Enabled?_ option. 7. Enter your Apple Merchant ID and Apple Merchant Name. You'll find these in your Apple Developer account. 8. Enter the [two-letter ISO 3166 country code](https://www.checkout.com/docs/resources/codes/country-codes.md) for your site's locale. 9. Check the _3DS_ option in _Merchant Capabilities_, leaving the other options unchecked. 10. Select _Supported Networks_. 11. Select the _Required Shipping Address_ fields. 12. Select _Name_ and _Postal Address_ for the Required Billing Address fields. 13. Select whether to place the Apple Pay button on the cart and/or mini-cart pages. 14. Select whether to enable the automatic redirect of product detail pages to HTTPS. > **Information** > > Pages where the Apple Pay button appears must be served via HTTPS, so you might need to redirect certain pages on your site. 15. Select _Submit_. A domain name should appear in the Registration section. If you do not have an alias registered for your site, you'll see a domain similar like `staging-merchant.demandware.net` or `production-merchant.demandware.net`. If you do have an alias registered, the domain will be something like `mystore.com`. 16. Register your site with the Apple sandbox or production server. You only need one merchant ID to register with both servers. If your domain is registered with Apple sandbox, only devices signed in to an [iCloud Sandbox Tester Account](https://developer.apple.com/support/app-store-connect/) can make payments on that site. If your domain is registered with the Apple production server, any regular iCloud account can pay on that site. #### Google Pay > **Information** > > See our [Google Pay documentation](https://www.checkout.com/docs/payments/payment-methods/google-pay.md) for more information. 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [6] Google Pay Settings_. 3. Set _Enable Google Pay_ to _Yes_. 4. Choose in which environment you want to run Google Pay: _Test_ or _Production_. 5. Enter your Google Pay merchant ID. You can find this in your Google payments profile. 6. Select the appearance of the Google Pay button with the _Button Style_ option. See the [Google Pay documentation](https://developers.google.com/pay/api/web/guides/brand-guidelines) for more detail. ### Enable 3D Secure payments Activate this feature if you want your transactions to be [3D Secure (3DS) authenticated](https://www.checkout.com/docs/risk-management/3d-secure.md). Our SFCC plugin supports 3DS2, the new authentication standard. > **Note** > > If you enable this feature, every transaction will trigger a 3DS check. If you only want to trigger it for certain transactions, contact your account manager. 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [4] Payment Settings_. 3. Set _3D Secure_ to _Yes_. 4. Select whether or not you want to _Attempt Non 3D Secure transactions_. If you select _Yes_, any cards that do not support 3DS will go through without a 3DS check. If you select _No_, cards that do not support 3DS will be blocked. 5. Select _Save_. ### Enable Mada card payments Mada is a local card scheme in Saudi Arabia. If you are going to be processing Mada cards, you should enable this setting. 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [4] Payment Settings_. 3. Set _Enable MADA Payment Cards_ to _Yes_. 4. Configure BINs for Mada cards. 5. Select _Save_. ### Set a billing descriptor The billing descriptor is an extra field you can send to the issuer, appearing on the customer's bank statement as an additional description of the payment. 1. Sign in to Business Manager. 2. Go to _Merchant Tools > Site Preferences > Custom Preferences > CKO [3] Business Details_. 3. Enter _Billing Descriptor Line1_. This is usually the name of your shop. 4. Enter _Billing Descriptor Line2_. This is usually the city of your merchant address. 5. Select _Save_. ### Manually capture, void and refund payments As well as doing so through the Dashboard, you can also manually capture, void and refund payments from Business Manager. These actions will show in both Business Manager and the Dashboard. 1. Sign in to Business Manager, and go to _Merchant Tools > Checkout.com Manager > Checkout.com Transactions_. 2. To capture a payment, find the payment you want to capture (must be type `AUTH`), select _Capture_ in the _Actions_ column and then select _Submit_. 3. To void a payment, find the payment you want to void (must be type `AUTH`), select _Void_ in the _Actions_ column and then select _Submit_. 4. To refund a payment, find the payment you want to refund (must be type `CAPTURE`), select _Refund_ in the _Actions_ column and then select _Submit_.