Custom Banner

Custom Banner

This feature is to create a delivery announcement at Checkout page.

1. General settings


  1. Banner Style: Choose style and color for the banner.
  2. Title: Enter your content here to announce customer about their cart. The title will be bold and different from Message content. If you want to add a countdown timer on the banner, you can also add the {timer} param and set up countdown duration below.
  3. Message: This label is not required. You can add your message or leave it blank.
  4. Enable close button: Enable this option so that your customers can close the banner.
  5. Enable collapse button: This option will be only available when you add message to the banner. You can enable this button to collapse the message by default.

2. Countdown Settings




  1. Countdown duration: Set up the countdown timer in minutes type
  2. Action after the timer expired: 
    1. Do nothing: Banner just stays there and do nothing.
    2. Repeat time: The timer will reset and countdown again.
    3. Hide Banner: The banner will disappear after the time ends.
    4. Change content: Change the title and message of the banner after the time ends.

3. Display Conditions

Add the condition to display the Banner. The Custom Banner will only show up if it meets all conditions (all rules pass) or one of the conditions (any rule passes).



4. Preview

Before previewing the Custom Banner, you will need to add it to your Checkout page in Checkout editor. Please go to the your theme customization and follow our steps to add Custom Banner.
  1. Step 1: After creating a banner, you will see the Banner ID. Please copy it.

  1. Step 2: Go to your theme customization > Choose Checkout page > Choose the page you want to add > Add app block.

  1. Step 3: On the left page, choose the Extra Widget.

  1. Step 4: Click on "Select an option" > choose Custom Banner > Paste the Banner ID to the label below. You can change the position of this Custom Banner by holding the item and dragging it to the place you want.






If you need any assistance with this feature, please contact our support team or reach out through the live chat in the app portal.


    • Related Articles

    • Custom Branding

      To make your Checkout Page have more brand color, Checkout Branding would help you re-style it easily. A. Design System 1. Color 1.1. Canvas This color setting applies to the body background (Mostly affects top of checkout page). For example when ...

    • Custom Plan Explanation

      Our custom plan is designed to meet the specific needs of merchants who have unique requirements for their Checkout customization. We offer a variety of options to choose from, so you can select a plan that perfectly suits your needs and budget. ...

    • Custom Cart

      Normally, Shopify does not allow users to change the product quantity and variant when they're on the Checkout page. So customers have to turn back to the Cart page just to adjust it, which wastes too much time and may cause them to feel too ...

    • Custom Field

      Our Custom Fields extension helps to collect more information of your customers on the checkout page, such as Delivery instructions, Customer surveys, etc. Let's explore the features of Custom Fields extension. 1. Template You can create more ...

    • How to set up multiple Custom Fields?

      You can create multiple Custom Fields forms in our Checkout Plus app. However, you only can use up to 5 Custom Fields forms in your checkout page. Each form you created will have an unique ID. You can find this Form ID after creating the form ...