--- schema_version: "1" id: 8ad14c417646e103e0cfe9e692f2ec5013e07e2792952eab10bebafcfe2105cf title: Buy Now and Pay Now Checkout Methods for B2C Commerce collection: admin version: current locale: en-us portal_url: https://docs.salesforce.com/admin/current/en-us/cc/264-0-0/b2c_buy_now_pay_now_checkout_methods.md canonical_url: https://help.salesforce.com/s/articleView?id=cc.b2c_buy_now_pay_now_checkout_methods.htm&release=264.0.0&type=5 source_site: help.salesforce.com content_type: documentation content_hash: 9b2a6f110d719cd34b3c99ad3da7e822d75adc3a526140b428ff0bd4de9a5b78 description: "Salesforce Payments has two express checkout experiences: Pay Now and Buy Now. Pay Now requires a current shopper basket while Buy Now ignores the current basket." products: - Commerce - B2C Commerce release: "264" --- # Buy Now and Pay Now Checkout Methods for B2C Commerce Salesforce Payments has two express checkout experiences: Pay Now and Buy Now. Pay Now requires a current shopper basket while Buy Now ignores the current basket. Both Pay Now and Buy Now are included in your site when you use `plugin_commercepayments` with a compatible Salesforce Reference Architecture (SFRA) version. You can add either or both because they’re independent of one another. If you customize the checkout methods for your site, each one has its own requirements. With Buy Now, the shopper sees a button to buy a specific product. Clicking the button prepares a basket that contains only that product. It completes checkout using the browser payment app appropriate for the shopper’s device and browser, such as Apple Pay or Google Pay. With Pay Now, the shopper sees a button to complete checkout using a browser payment app for whatever is in their basket. ## Buy Now The `plugin_commercepayments` cartridge adds a Buy Now express checkout button to the product details page. See the following templates: - `product/productDetails` includes - `product/components/addToCartProduct` includes - `product/components/addToCartButtonExtension` includes - `_commercepayments/components/product/buyNowButtons` All but the buyNowButton template is part of the SFRA `app_storefront_base` cartridge. The `plugin_commercepayments` cartridge contains `buyNowButtons` and overrides `addToCartButtonExtension` to include it. If you aren’t using the latest version of SFRA, adjust your `addToCartProduct` or equivalent to include `buyNowButtons`. The `buyNowButtons` template depends on data in the view model. If the data isn’t present, the button doesn’t work as expected. The `addToCartButtonExtension` template sets a page variable named `buynowproduct` to the product model object for products bought through express checkout. If you include `buyNowButtons` directly, you must first set a compatible object at `buynowproduct`. The Product-Show controller adds the data to the view model. The SFRA base controller adds some information about product inventory and availability and uses it to determine if the product can be purchased. If the product can’t be ordered the Buy Now button is hidden. The `plugin_commercepayments` cartridge also appends code to this controller to add a `dw.extensions.payments.SalesforcePaymentRequest` object containing configuration and other information necessary to inject express checkout code. Review the template, controllers, and API documentation for more details. Because Buy Now doesn’t require an existing shopper basket, and ignores one if it exists, all the data supplied to the browser payment app to complete checkout must be calculated independently of a basket. If your product details page is cached, the data is cached as well. The data must match the product price and other site configurations, such as for taxes, shipping, and promotions. When the data matches, the resulting basket matches what the shopper sees in the payment app. The shopper completes the purchase without further interaction with the B2C Digital platform or your custom code, so the amounts must be correct. The `plugin_commercepayments`cartridge provides the `paymentHelpers` script function getBuyNowData to calculate the data for a product model object. It in turn uses the `checkoutHelpers` script function `calculateBuyNowData` to calculate the data for a specific SKU, price, quantity, and options. These functions can work for your site out of the box. To support your site needs, you can customize specific products, prices, shipping methods, promotions, and tax calculations. If your product details page is cached, make sure that the output of your custom calculations can also be cached. Anytime the shopper changes something that affects the total line items, or other data to be shown in the browser payment app, update the Buy Now button. The aim is to make sure that when the shopper uses the button the payment app shows data matching the resulting basket. The `plugin_commercepayments` cartridge recalculates the data in code appended to the `Product-Variation` controller. It includes the data in the response, and updates the Buy Now button using a Salesforce Payments client-side JS API. SFRA calls that controller for changes to the variation attributes and for changes to the quantity, product options, and so on. Call this controller or follow a similar pattern to update use cases like this on your site. ## Pay Now The `plugin_commercepayments` cartridge adds Pay Now express checkout buttons in three places. - In the mini cart below the Checkout button - On the cart page below the Checkout button - At the top of the checkout page above the Customer, Shipping, and Payment Method cards The buttons are implemented using these templates. - `checkout/cart/miniCart` includes - `_commercepayments/cart/checkoutButtons` includes - `_commercepayments/components/product/paymentRequestButtons` - `cart/cart` includes - `_commercepayments/cart/checkoutButtons` includes - `_commercepayments/components/product/paymentRequestButtons` - `_commercepayments/checkout/checkout` includes - `_commercepayments/components/product/paymentRequestButtons` The `miniCart` template is part of the SFRA base and renders in an AJAX controller response. The `cart` template is also part of the SFRA base and is the cart page. The `plugin_commercepayments` cartridge overrides the SFRA base `checkoutButtons` template used in both and includes `paymentRequestButtons`. The `plugin_commercepayments` cartridge also overrides the entire SFRA base checkout template, and includes `paymentRequestButtons` directly. The `buyNowButtons` template depends on the property `paymentRequestData` in the view model. The `plugin_commercepayments` cartridge provides a `paymentHelpers` script function `createPaymentRequestData` to calculate it. Because it’s possible that multiple Pay Now buttons can appear on the same browser page, each call returns data for a unique button. If you reuse the same `paymentRequestData` to create multiple buttons, they can fail to work as expected. The `createPaymentRequestData` function uses the current shopper basket to calculate the data to show in the browser payment app for a Pay Now button. Call this function after modifying the basket and recalculating it using your site basket calculation script that applies promotions, computes shipping and tax, and updates totals. If you call the function before then, the data might not reflect the resulting state of the shopper basket. The cart and checkout pages aren’t often cached. If your site caches those pages in any way, be sure that the data is always updated when the basket changes. The `plugin_commercepayments` cartridge recalculates the data when the basket is changed on a page with a Pay Now button. The data includes quantity and line item changes in the mini cart or cart, changing the shipping method on the cart or checkout pages, applying a coupon, and so on. In each case code is appended to a controller to add the recalculated data to the response. Event handlers on the client side update the Pay Now button using the same Salesforce Payments client-side JS API as for Buy Now. Follow a similar pattern to update for other use cases on your site.