BSS Product Labels & Badges
  • About app
  • How to create a Label?
  • How to create a Badge?
  • How to create a Label Group?
  • Integration
    • LAI Product Review Integration Guide
  • FAQs
    • How to Provide Your Store's Collaborator Code
    • How to Approve Our Collaborator Request
    • How to create a text label/badge with custom style?
    • How to redirect customers after clicking on label/badge
    • What to do when some of the labels are appearing in places they should not?
    • Why are the changes of labels not applied on my products?
    • How to convert the language in the label or badge on your on your multilingual site?
    • How to add 2 labels at the same time on certain products?
    • How to show labels beautifully on the desktop and mobile?
    • How to change colors of the label?
    • How to exclude the label from unexpected page(s) or block(s)?
    • How to remove leftover code of the Product Labels Pro app?
    • How to show badges out of product images?
    • How to show label/badge when product quantity = 0?
    • How to add the Sold Out label automatically?
    • Why doesn’t the label/badge appear when the product is out of stock?
    • Why can't I see the badge on the product image?
    • Why doesn't the app work?
    • Why are the labels/badges not visible constantly on the page(s)?
    • Why is the label/badge duplicated?
    • How to remove label automatically?
    • How to apply Labels/Badges based on Product/Customer tags?
    • How to show text hover effect on label/badge?
    • How to create labels for product variants?
    • Why after changing theme, labels/badges aren't displayed anymore.
    • Can I add multiple badges on a product?
    • What is Inventory Badge?
    • Can I exclude specific customers from seeing my badge?
    • Can I choose who can see my badge?
    • Can I set the badge below the Buy it now button?
    • How to change the effect the labels/badges show up in the online store?
    • How can I customize the position of badges?
    • How to Display Labels/Badges Only on Mobile Devices
    • How to display your inventory quantity on text labels?
    • Countdown Timer for Label/Badge
    • How to Use Product Metafields to Customize Label/Badge Display?
    • How to Create Product Metafields in Shopify: A Step-by-Step Guide
    • How to Use Variant Metafields to Customize Label/Badge Display
    • How to Create a Label or Badge that Shows Product Metafield Content Automatically
    • Using a List of Values Metafield to Display Labels/Badges
    • Display a Badge Next to the Product Price
  • General
    • How to enable app embed block?
    • Can I have a trial for BSS Product Labels & Badges app?
    • How to translate the app interface into other languages?
Powered by GitBook
On this page
  1. FAQs

How to Customize the Position of Your Sales Pop-up

Last updated 9 months ago

In this setup guide, we will walk you through the steps to adjust the position of your sales pop-up using the BSS: Product Labels & Badges app. By following these instructions, you can easily customize the placement of the pop-up on both desktop and mobile devices to suit your store's design and user experience.

Step 1: Access the Configuration Tab

  1. Go to the BSS: Product Labels & Badges app.

  2. Select the sales pop-up as you want

  3. Click on the "Configuration" tab to access the configuration settings.

Step 2: Adjust Pop-up Position on Desktop Devices

  1. Scroll down to locate the "Pop-up position" section.

  2. In the "Position on Desktop" dropdown, select either "Bottom Left" or "Bottom Right" as the desired position for your sales pop-up.

  3. Choose the animation effect that best suits your preference from the available options: "Slide from the bottom," "Slide from the left," or "Fade in/out."

  4. Optionally, you can set up the "Margin Top/Bottom" and "Margin Left/Right" values to fine-tune the positioning of the pop-up.

Step 3: Configure Pop-up Position on Mobile Devices

  1. In the "Display on Mobile" section, toggle the switch to enable or disable the pop-up on mobile devices.

  2. If enabled, select either "Top" or "Bottom" as the desired position for the sales pop-up on mobile devices.

  3. Choose the animation effect that best fits your requirements: "Slide from top" or "Slide from bottom" for a dynamic effect, or "Fade in/out" for a smooth transition.

  4. Optionally, adjust the "Margin Top/Bottom" value to control the spacing between the pop-up and the screen edges.

Step 4: Save your changes.

Step 5: Preview

  1. Visit your online store on both desktop and mobile devices to see how the sales pop-up appears in the configured positions.

  1. If necessary, go back to the configuration settings and make further adjustments to achieve the desired positioning and visual impact.

By following these straightforward steps, you can easily customize the position of your sales pop-up on both desktop and mobile devices. Experiment with different positions, animations, and margins to find the perfect balance between visibility and user experience. Regularly review and refine these settings to align with your store's aesthetics and customer preferences.