Checkout buttons
Store visitors can add products to the shopping cart by clicking the Add to Bag button on a product’s details page. After that they can continue shopping, add more items to the cart or proceed to checkout:
You can offer faster checkout options for your customers such as allowing them to add products to the cart earlier in your catalog and going straight to the cart.
Displaying Buy Now buttons on the product list
You can display Buy Now buttons on your store front page (and in any categories, if you use them). This way, your customers can quickly add products to the cart right from the product list and keep shopping in your store. This function is useful if you have many regular customers that are familiar with your catalog or in case you don’t have product descriptions.
To show Buy Now buttons in the catalog:
- From your Ecwid admin, go to Design.
- Scroll down to Product Card details and layout.
- For the Buy Now option select Show or Show on hover.
Forwarding customers to the cart
By default, after adding products to the cart, customers can continue shopping or proceed to checkout.
You can choose to forward your customers straight to the shopping cart as soon as they click the Buy Now or Add to Bag button. This function is useful if your products do not have detailed descriptions or you want to set up a fast shopping experience for your customers for some other reason.
To forward customers to the cart upon Buy Now (or Add to Cart) button click:
- From your Ecwid admin, go to the Settings → General, Cart & Checkout tab.
- Turn on the Open bag when "Add to bag" is clicked setting.
- Save the changes.
Styling the buttons
You can customize the look of the buttons in your Ecwid store such as change the buttons’ color and font and more. These changes require modifying your store theme through custom CSS codes. Learn more about adding CSS codes.
For example, to change the color or font of the purchase buttons in your store:
- From your Ecwid admin, go to the Design page.
- Click Create theme (or Edit theme if you’ve already changed the default store theme).
- Add the necessary CSS code to the theme. You can use ready codes from the Buttons section of Ecwid CSS Cookbook or create your own codes.
- Save the changes.
Related articles