How to use a Custom position for a Banner?
Last updated
Last updated
BSS: Banner & Pop-up application allows you to customize the position of banners on your theme using App Block.
Follow the steps below to set a custom position for your banner:
Step 1: Create a banner in the BSS: Banner & Pop-up app.
For more details, see the article: How to Create a Banner?
Step 2: Choose Custom Position.
Go to the Position section and select Custom Position.
Copy the Banner ID (Note: If the Banner ID is not available, click Save to save the banner. The Banner ID will be generated automatically after saving).
Step 3: Click Save to save the banner.
Step 1: Go to Online Store.
Step 2: Click Customize to access the Theme Editor.
Step 3: Add an App Block.
On the page where you want to display the banner, select Add Section.
Choose the section for BSS: Banner & Pop-up app.
In the section you've added, select the app block for BSS: Banner & Pop-up. Enter the Banner ID you copied earlier from Step 2 of Phase 1.
If you want the banner to display in full width, select the App Section and uncheck the option Make section margins the same as theme.
Step 4: Click Save and check the result in the Theme Editor and Storefront.
Additionally, you can set a custom position for the banner by copying the code snippet from the app and pasting it into your theme’s code.
Watch the following video to learn more about custom positioning: