Customize theme: Checkout setting
The style of your checkout pages on your online store can be customized using the Theme editor. Add your company logo, change the colors, or select a new font to personalize the checkout. In this article, we'll show you how to use our Theme editor to customize the style of your checkout page.
A. Customize the style of your checkout page
B. Layout & user interface
C. Account & forms
D. Legal & payments
E. Custom scripts
From your ShopBase admin, go to Online Store > Themes. Select the theme you want to edit and choose Customize.
Select Checkout page from the dropdown menu.
On the Checkout page, you can customize the following sections:
Layout & user interface.
Account & forms (only available for ShopBase and PrintBase stores).
Legal & Payments (only available for ShopBase stores).
Custom Scripts (only available for ShopBase stores).
We have conducted extensive research for PrintBase and PlusBase stores, so that some settings are pre-configured and do not require further customization in order to ensure the most optimized conversion rate and customer experience on your store.
For more information on how to customize each section, please refer to the instructions down below.
From the Checkout page in the Theme editor, select Layout & user interface section.
Layout: Select One page checkout or 3-step checkout. Please refer to this article for more information on these 2 layouts for your checkout page.
Banner: Upload background image displayed at the top of the page.
Logo: Add logo to your store.
Trust badges image: Add trust badge images to the checkout page.
Main content area: Add background image into the content area.
Order summary: Add background image or change color into the order summary area.
Footer: Select to show or hide your store's footer during checkout.
Typography: Change fonts of texts on the checkout page.
Color: Change the colors of accents, buttons, and error messages.
For PrintBase and PlusBase stores, you can only customize the store's logo in the checkout page.
Click Save once finished.
This section is only available for ShopBase and PrintBase stores.
From the Checkout page in the Theme editor, select Account & forms section.
In Customer account, select between:
Accounts are disabled: Customers will only be able to check out as guests.
Accounts are optional: Customers will be able to checkout if they have a customer account or as a guest.
You can choose Accounts are optional if you want to remind customers to log in or sign up for accounts when they are making payment and convert them to loyal customers.
In Form Option, customize the checkout form according to your preference.
In Billing address, select to allow customers to use the shipping address as the billing address by default.
In Shipping method, choose how you want the customers to select a shipping method by showing all available shipping methods at once or only showing the default shipping method with option to change.
This option is only applicable for one page checkout layout.
In Checkout note, enable Allow customer to leave a note so that a text box will be displayed on the checkout page for customers to leave a note during checkout.
In Tipping, set up tipping options for your customers during checkout. Please refer to this article for more details on how to set up tipping option for your orders.
Click Save once finished.
For PrintBase store, you can only set up Tipping in the Account & forms section.
This section is only available for ShopBase stores.
From the Checkout page in the Theme editor, select Legal & payments section.
In Terms agreement, you can choose whether your customer must confirm the terms of service before placing an order. Please refer to this article for further details on how to show legal agreement on the checkout page.
In Marketing consent, select your customers' email and SMS marketing preferences, including whether or not they can sign up for marketing emails and SMSs at checkout and whether or not these options are pre-selected.
In Payments, select to Show PayPal Express checkout at the top of the checkout page.
Click Save once finished.
This section is only available for ShopBase stores.
From the Checkout page in the Theme editor, select Custom scripts section.
Here, you can make some changes their checkout summary page's appearance by adding scripts (CSS, Javascript, HTML).
You can add Power Up Script such as scripts using JavaScript or CSS code into your Checkout Page. Please visit this article on how to add power up scripts to optimize your store.
Click Save once finished.
Overview of Checkout
Disable the "Add to cart" button
How to customize cart page?
Switch between "3-step Checkout" and "One Page Checkout"
Optimize checkout page for better conversion rate
Set up Order Processing Bar and Delivery Policy on Thank-you page
How to get your customers updated of their order status tracking?
Set up tipping option for your orders
Show legal agreement on the checkout page
In this article
A. Customize the style of your checkout page
B. Layout & user interface
C. Account & forms
D. Legal & payments
E. Custom scripts
A. Customize the style of your checkout page
From your ShopBase admin, go to Online Store > Themes. Select the theme you want to edit and choose Customize.
Select Checkout page from the dropdown menu.
On the Checkout page, you can customize the following sections:
Layout & user interface.
Account & forms (only available for ShopBase and PrintBase stores).
Legal & Payments (only available for ShopBase stores).
Custom Scripts (only available for ShopBase stores).
We have conducted extensive research for PrintBase and PlusBase stores, so that some settings are pre-configured and do not require further customization in order to ensure the most optimized conversion rate and customer experience on your store.
For more information on how to customize each section, please refer to the instructions down below.
B. Layout & user interface
From the Checkout page in the Theme editor, select Layout & user interface section.
Layout: Select One page checkout or 3-step checkout. Please refer to this article for more information on these 2 layouts for your checkout page.
Banner: Upload background image displayed at the top of the page.
Logo: Add logo to your store.
Trust badges image: Add trust badge images to the checkout page.
Main content area: Add background image into the content area.
Order summary: Add background image or change color into the order summary area.
Footer: Select to show or hide your store's footer during checkout.
Typography: Change fonts of texts on the checkout page.
Color: Change the colors of accents, buttons, and error messages.
For PrintBase and PlusBase stores, you can only customize the store's logo in the checkout page.
Click Save once finished.
C. Account & forms
This section is only available for ShopBase and PrintBase stores.
From the Checkout page in the Theme editor, select Account & forms section.
In Customer account, select between:
Accounts are disabled: Customers will only be able to check out as guests.
Accounts are optional: Customers will be able to checkout if they have a customer account or as a guest.
You can choose Accounts are optional if you want to remind customers to log in or sign up for accounts when they are making payment and convert them to loyal customers.
In Form Option, customize the checkout form according to your preference.
In Billing address, select to allow customers to use the shipping address as the billing address by default.
In Shipping method, choose how you want the customers to select a shipping method by showing all available shipping methods at once or only showing the default shipping method with option to change.
This option is only applicable for one page checkout layout.
In Checkout note, enable Allow customer to leave a note so that a text box will be displayed on the checkout page for customers to leave a note during checkout.
In Tipping, set up tipping options for your customers during checkout. Please refer to this article for more details on how to set up tipping option for your orders.
Click Save once finished.
For PrintBase store, you can only set up Tipping in the Account & forms section.
D. Legal & payments
This section is only available for ShopBase stores.
From the Checkout page in the Theme editor, select Legal & payments section.
In Terms agreement, you can choose whether your customer must confirm the terms of service before placing an order. Please refer to this article for further details on how to show legal agreement on the checkout page.
In Marketing consent, select your customers' email and SMS marketing preferences, including whether or not they can sign up for marketing emails and SMSs at checkout and whether or not these options are pre-selected.
In Payments, select to Show PayPal Express checkout at the top of the checkout page.
Click Save once finished.
E. Custom scripts
This section is only available for ShopBase stores.
From the Checkout page in the Theme editor, select Custom scripts section.
Here, you can make some changes their checkout summary page's appearance by adding scripts (CSS, Javascript, HTML).
You can add Power Up Script such as scripts using JavaScript or CSS code into your Checkout Page. Please visit this article on how to add power up scripts to optimize your store.
Click Save once finished.
Related articles
Overview of Checkout
Disable the "Add to cart" button
How to customize cart page?
Switch between "3-step Checkout" and "One Page Checkout"
Optimize checkout page for better conversion rate
Set up Order Processing Bar and Delivery Policy on Thank-you page
How to get your customers updated of their order status tracking?
Set up tipping option for your orders
Show legal agreement on the checkout page
Updated on: 26/10/2022
Thank you!