Setting up the checkout page in your theme editor

The checkout page is an essential aspect of any online store, marking the point where customers finalize their purchases. This often-overlooked feature plays a significant role in the success of your e-commerce site, as it is the final interaction between your customers and their chosen products. A well-designed checkout page simplifies the buying process, enhances customer trust, increases conversion rates, and is an important factor in driving business growth. In this guide, you'll learn how to effectively set up the checkout page using your theme editor, ensuring a smooth and efficient checkout experience for your customers.

Steps

1. From your Shoplazza admin > Online Store > Themes, click Customize on your target theme.

2. Click on the Home page from the drop-down menu.

3. Choose Checkout to access the checkout page.

Checkout settings

Personalize the checkout page to reflect your brand's identity and make the shopping experience seamless for customers.

1. Click the Checkout section title to customize specific elements.

2. Banner settings:

• Choose images for Desktop and Mobile banners. This personalizes the top section of your checkout page.
• Adjust the image's Height and Focal point, and enable or disable options like Full-screen and Show below space according to your preferences.

3. Logo settings:

• Choose a Logo image from your Shoplazza admin or your computer.
• Adjust the Logo size and position to match your style.

4. Payment information background:

• Select an image for the payment information background or choose a Background color that complements your brand.
• Decide on the Input field background, either Transparent or White.

5. Order summary background:

• Pick an image for the order summary background or customize the Background color to your liking.

6. Order details area:

• Enable or disable the Collapse mobile order summary option to determine how the mobile page displays.

• You can add additional pages to your images from the drop-down menu, and then clicking on the image will take you to that page.

7. Location: Specify the location of the coupon box for the mobile discount text box during checkout.

8. Font: Customize the fonts for Headings, Text, and Buttons to align with your brand.

9. Color settings: Tailor the Button background, Button text, Error message, and Focus message color as needed.

Customizing the Footer

In this section, you are able to configure your custom settings for the footer. Here you can add useful links, and notes that keep your customers informed and build trust in your brand.

1. Switch to the Footer section to start customizing your settings.

2. Payment icons: Choose whether to display Payment icons in the footer or hide them.

3. Menu Customization

• Click on Add Menu, you can set up a maximum of 5 different menus.
• Within each menu, specify a Link name and select the Link page or Custom URL.
• If needed, remove a menu block by clicking Remove block.

By following the above steps, you can gain an overview of setting up the checkout page in your theme editor. This can help you create a more appealing checkout page to encourage your customers to finalize orders, improve your conversion rates, and drive overall business growth.