Lumin Theme Documentation
LuminThemesAll ThemesContact
  • Lumin Theme theme settings
  • Faq
    • How to change any text in Luminthme
    • How to update your Shopify theme without losing customization
    • How to setup Product Cards Scrolling Tags & Custom Badges
    • How to add Custom fonts
  • Header
    • Set up drop-down or mega menu menus in your online store
  • Lumintheme exclusive
    • Custom color and Image swatches
  • Cart Drawer
    • Enable free shipping bar and change target price
  • Product Page
    • Quantity Breaks Discount
    • Auto generate tabs with the product's content
    • Products Siblings
      • How to setup siblings
      • Step 2 - Collection for siblings
      • Add Siblings Picker block
  • Available page types
  • Sections available in Lumin Themes
  • Color schemes
  • Templates
  • Setting Up and Customizing the Announcement Bar
  • Quantity Breaks Discount on Lumin Theme
  • Adding a Size Chart to Lumin Theme
  • Cart Progress Bar on Lumin Themes
  • Sticky Add To Cart
  • Fancy Text Settings
  • Cart Drawer Settings
  • Lumin Slider
Powered by GitBook
On this page

Cart Progress Bar on Lumin Themes

Step-by-step guide to setting up the Cart Progress Bar on Lumin Themes

PreviousAdding a Size Chart to Lumin ThemeNextSticky Add To Cart

Last updated 4 months ago

Cart progress bars are a great way to encourage customers to reach specific spending thresholds by offering incentives like free shipping or discounts. With Lumin themes, this feature is native and simple to set up. Follow these steps to configure your cart progress bar.


Basic Cart Progress Bar Setup

Step 1: Enable the Cart Progress Bar

  1. Go to your Shopify Admin Panel.

  2. Navigate to Online Store > Themes.

  3. Click on Customize next to your active Lumin theme.

  4. In the theme editor, go to Theme Settings in the bottom left corner.

  5. Click on Cart Progress Bar.

Step 2: Configure the Goals

  1. Enable the Cart Progress Bar by toggling the setting to "On."

  1. Set Up Your First Goal:

    • Enable Goal 1 by toggling the option to "On."

    • Set the Amount you want the customer to reach (e.g., $50 for free shipping).

    • Set the Message you want to show before reaching Goal 1. Example: “You’re only [x] away from <strong>FREE SHIPPING</strong>.” (Use [x] to insert the dynamic remaining amount.)

    • Set the Post-Goal Message. Example: “You’ve earned free shipping!”

  1. Choose the Number of Goals:

    • You can set up 1, 2, or 3 goals, depending on your promotional strategy. Simply toggle additional goals on if desired.


Advanced Cart Progress Bar Setup (With Multiple Discounts and Icons)

Step 1: Enable the Advanced Settings

  1. Go to Theme Settings > Cart Progress Bar.

  2. Enable the Cart Progress Bar if not already done.

  3. Enable the “Show Progress Bar Icons” to display icons for each goal.

  4. Enable the “Use Items Subtotal for Progress Bar” if you want the subtotal of items in the cart to be the progress metric.

Step 2: Set Up Your Goals with Icons

  1. Set Goal Amounts for each goal (e.g., $50, $100, $150).

  2. Enable each Goal you want to use (Goal 1, Goal 2, Goal 3).

  3. Set the Message for each goal:

    • Pre-Goal Message: “You’re only [x] away from <strong>FREE SHIPPING</strong>.”

    • Post-Goal Message: “Congratulations! You’ve earned free shipping.”

  4. Set Icons for Each Goal:

    • Pre-Goal Icon: Choose an icon that will show before the goal is reached (e.g., a shopping cart or a shipping box).

    • Post-Goal Icon: Choose a different icon to appear once the goal is achieved (e.g., a checkmark or a gift box).

  5. Goal Descriptions: Add a description for each goal that will appear beneath the icon. For example: “Free Shipping”.

  6. Optional Placeholder: Use [goal] as a placeholder to display the goal amount in the message (e.g., "Free Shipping [goal]").

Final result will be like this:


Disclaimer

  • Free Shipping Amount: Ensure that you have configured the free shipping threshold in the Shopify settings to match the progress bar goal.

  • Discounts in Dashboard: Be sure to set up any discounts or promotions in the Shopify dashboard for them to sync with the progress bar goals.


This setup will help guide your customers toward their goals, making the shopping experience more interactive and motivating them to complete their purchase while benefiting from discounts or free shipping.