Customize widgets on Checkout page
Last updated
Last updated
Please note that Checkout customization features are available only on the Shopify Plus plan.
For more information, you can refer to this .
After enabling the Salemate Block, you can start adding widgets to the Checkout page based on your requirements.
For step-by-step instructions on enabling the Checkout Block, refer to this .
Widget position
Customize where you want to place the widgets. There are 10 positions, including:
Above Order Summary block
Below Order Summary block
Below Apply Discount block
Below button Pay Now block
Bellow Wallets block
Above Customer information block
Below Customer information block
Below Shipping block
Below Payment block
Below Remember block
This section will only appear after you enable a Salemate block. Its functionality and settings may differ from each block, so be sure to configure it accordingly.
The position will apply to all widgets customized in that block
To encourage customers to reach a specific goal (e.g., a required item count) before receiving a reward. It visually displays progress and updates dynamically based on the customer's order.
Reward Basis: Choose how the reward progress is calculated. You can set it based on:
Item count: The reward bar tracks the number of items in the cart, called Item count.
Cart total: The reward bar tracks the total value of the order in the cart, called Minimum amount.
Text Before Achieving: Write a text to encourages customers to add more items to their cart to receive the reward (e.g., "Just a little more to go!").
Text After Achieving: Confirms success once the requirement is met (e.g., "You did it!!!").
Bar Foreground Color: Choose a color for the filled portion of the progress bar.
Bar Background Color: Select a color for the unfilled portion.
Item count/Cart total: Adjust the slider to preview how the progress bar will fill when the number of items or the total cart value changes. This helps you visualize the customer’s progress toward unlocking the reward.
Click Save to apply the settings.
Help build customer confidence by reassuring them that their payment and personal information are secure. Displaying trust badges on the checkout page can reduce cart abandonment and increase conversions by reinforcing the credibility of your store.
Click the Create badge button to start building the badge you are looking for.
Title: Name your badge.
Description: Describe its purpose.
Select icon: Pick an icon that fits the badge.
Select icon color: Choose a suitable color.
Layout Direction: Choose to display the description text vertically or horizontally.
Select icon or image size: Adjust the slider to change the size of the badge icon.
If you have more than one badge showing up, you are able to switch the badge positions if you want :)
Displaying testimonials on the checkout page helps build trust, reduce purchase hesitation, and reassure customers by showcasing positive experiences from others.
Customer Name: Display the name of that customer.
Review Text: Putting the kind words your customer gives to you there.
Number of stars: Adjust the slider to choose the preferred number of stars.
Display a checkbox with notes that gives customers additional information on the checkout page, such as a special gift or discount code, noted by the store owner or the customers themselves.
Checkbox title: Enter the text that will appear next to the checkbox.
Show text box when selected: Enable this option to display a text box when the customer ticks the checkbox.
Text box placeholder: Enter the default message or code that customers will see in the text box.
Showcase a custom image or accepted payment methods on the checkout page.
Choose image: Decide to display either of the options below:
Payment image: Includes eight payment methods accepted by Shopify checkout (e.g., Apple Pay, Google Pay, PayPal, Visa, Mastercard).
Custom image: Upload a customized image from your device to showcase it at checkout. Only .gif, .jpg, and .png types are approved to upload.
Image width: Adjust the size of the payment icons using the slider.
Add a custom text and adjust:
Select type
Banner: Display the text on a banner with the outstanding light green background.
Plain text: Texts would be displayed as normal as other elements on the checkout page.
Spacing: Adjust the spacing between the heading text and body text
None
Base
Extra tight
Tight
Loose
Extra loose
Heading Text: Customize the header.
Body Text: Customize the body
Header text size: Decide the size of the header.
Body text size: Decide the size of the body.
Notes:
A widget can be added multiple times to the page without any limitations.
Widgets can be freely repositioned by dragging and dropping them within the control panel.
If you have any difficulties or need any further help from our team, please do not hesitate to let us know via the Live Char or our email here: support@tek-labs.app. We are all ears!!
