Tickets - Login

checkout buttons

  • How to Install the Checkout Button

    The Bolt Checkout Button initiates the shopper’s checkout experience and can be placed across multiple pages on your store.


  • Bolt Design Guidelines

    Always Available Button Design Guidelines How to display and customize the Always Available Button in your storefront. Buy Now Button Design Guidelines How to display and customize the Buy Now Button in your storefront. Checkout Button Design Guidelines Guidelines for displaying and customizing the Checkout Button in your storefront.


  • Always Available Button Design Guidelines

    The Always Available button is a floating express checkout that displays only when a shopper’s cart has items. This button includes an on-hover mini-cart and immediately launches the checkout modal when “Buy Now” selected.


  • Always Available Checkout Button

    Merchants can create an express-checkout experience for their shoppers by enabling the Always Available Checkout Button. The Always Available Checkout Button displays when an item is initially added to a shopping cart and floats with the shopper’s movement on and across all supported pages. Read how to enable this feature


  • Buy Now Button Design Guidelines

    The Buy Now button adds an item to the shopper’s cart and then immediately launches the Bolt Checkout modal.

    Merchants can either use Bolt’s default styling for greater cross-network shopper recognition or customize the Buy Now button to fit their own brand requirements using the guidelines in this article.


  • Checkout Button Design Guidelines

    The Checkout button loads the Bolt Checkout modal when selected. Shoppers can manage their credentials, payment methods, and shipping options from the modal.

    Merchants can either use Bolt’s default styling for greater cross-network shopper recognition or customize the Checkout button to fit their own brand requirements using the guidelines in this article.


  • Enable Checkout Buttons

    Enable Checkout via Link How to set up Checkout via Link for Shoppers. Enable the Always Available Checkout Button How to set up the Always Available Checkout Button. Enable the Product Page Checkout Button How to set up the Product Page Checkout Button. Enable the Standard Checkout Button Learn how to add scripts to your storefront and call Bolt Checkout.


  • Enable the Always Available Checkout Button

    Steps for enabling the Always Available Checkout Button vary depending on the cart platform used. Custom Cart Platform Custom carts must call BoltCheckout.configure() with parameters based on whether there are items in the cart and if an item was just added to cart. Option 1: Item is Added to Cart Use the following call to display the Always-Available Checkout Button when a Shopper adds the first item to their cart. This call also animates the mini-cart to signify an item was added.


  • Enable the Product Page Checkout Button

    Steps for enabling the Product Page Checkout Button vary depending on the cart platform used. BigCommerce Installation Log in to the BigCommerce Admin Console. Navigate to Manage > Edit theme. Open templates > components > products > add-to-cart.html. Add the following code: <script id="Bolt-connect" type="text/javascript" src="https://connect.Bolt.com/connect-bigcommerce.js" data-publishable-key="<publishable key>" data-shopping-cart-id="BigCommerce" data-storefront-api-token="{{settings.storefront_api.token}}"> </script> Add the following after the div.form-action element, along with any styling necessary. <div id="product-page-checkout-wrapper" "Bolt-button-wrapper" style="display:none"> <div "Bolt-product-checkout-button Bolt-multi-step-checkout"></div> </div> Since the element is automatically made visible on page load, it can be inconvenient for production testing.


  • Enable the Standard Checkout Button

    The Bolt Checkout Button initiates the shopper’s checkout experience and can be placed across multiple pages on your store.


  • Product Page Checkout Button

    product page checkout

    The Product Page Checkout button adds an express-checkout option to your product pages that forwards shoppers directly to Bolt Checkout to complete their purchase. Read how to enable the Product Page Checkout Button.