How to create a Banner?

📌 What is a Banner?

A banner is an element displayed on a website to show notifications or promotional information.

Banner Demo

🛠️ Steps to Create a Banner

Step 1: Open the Banner navigation

From the app’s dashboard, go to the Banner module and click Create Banner.

Step 2: Choose a Banner Type

Select the type of banner you want to create. Click Select to proceed to the editor.


Step 3: Customize Banner Settings

Once you enter the banner editor, you’ll see a max modal setting:

You can use the Top Bar to rename, activate your campaign, change the preview mode or undo or redo the edit

Then you can start editing with the left Sidebar:

3.1 Template

Choose the predesigned template, eg sales occasions or styles to save design time

3.2 Components:

Click any part of the banner (text, button, background...) to open quick-edit settings. You can edit the content and the design in one place quickly

3.3 Styles:

Adjust layout, position, spacing, and apply custom CSS.

  • Position: Choose where the banner appears — top, bottom, or a specific custom position (e.g. under a button). → See this guide to learn how to place the banner in a custom location.

    • Enable Sticky banner if you want it to stay visible while scrolling.

  • Layout:

    • Drag and drop elements to change their order.

    • Adjust spacing such as padding and gap between elements to fine-tune the look.

  • Custom CSS:

    • Add your own CSS for advanced customization if needed.

3.4 Schedule & Trigger: Define when and how the banner appears to visitors.

→ See full guide

3.5 Targeting: Control who sees the banner based on customer group, device, page, etc.

→ See full guide

3.6 Translations: Create multilingual versions of your banner content.

→ See full guide

3.7 Integration: (for Email Signup campaigns) Connect to Shopify Customers to sync new subscribers.

→ See full guide


Step 4: Preview the Banner

Use the Preview Panel to see how the banner will appear on different devices. This ensures optimal display across desktop and mobile.


Step 5: Publish the Banner

Click Save to publish your banner. Make sure the status is Active

Your banner will appear in the campaign list. You can manage, edit, or delete your banner anytime from here.

Note: If the banner does not appear on your storefront, please check if the app is properly embedded in your theme. Go to Shopify Admin → Online Store → Themes → Customize → App Embeds → Enable TA Banner & Popup. Or contact our support for help.

➤ Learn how to configure components for each banner type:

📢 Announcement banner⏳ Countdown Timer banner📩 Email Signup banner🚚 Free shipping banner💰 Discount banner

💬 If you have any related questions, please contact us via Live chat or [email protected] for further assistance.

Last updated

Was this helpful?