Docs · Troubleshooting

How do I fix the progress bar display on mobile?

Spacing, width and crowded tiers on phones are set in the Design page, with its own mobile view. Taps that do nothing in the gift chooser come from the theme.

· Markdown versionEN · FR · ES · DE

Adjust spacing for mobile

The bar has separate margins and padding for phones.

  1. Open Design › Wrapper.
  2. Switch from Default to Mobile with the buttons at the top.
  3. Adjust Margin and Padding for the mobile view, then save.

Max width only applies on desktop. To check the result, open your store in your browser's device mode, or on a phone. See design.

The last tier is cut off on the right

Symptom: with several tiers in Full width or Proportional display, the price or name of the last tier is cut off on narrow screens, and markers go past the end of the bar.

This is fixed in the app. If you still see it, choose Symmetrical in Goals display (Design › Bar style), then write to support with your theme name and store URL.

Too many tiers on a small screen

On a phone, five or six tiers leave little room for each name. In Design › Bar style, turn on Limit displayed goals: the bar shows only the next tiers and the latest ones reached, and moves forward as tiers are unlocked. Set Goals displayed (max) and Unreached goals displayed (min) to taste.

The gift chooser title is too large

In Design › Gift interface, the Gift modal card has its own Title font size (mobile). The tab appears when a tier offers several gifts.

The gift chooser does not respond to taps

Symptom: on a phone, mostly with Safari on iOS, taps on the gift chooser do nothing, while the same chooser works with a mouse on a computer.

Cause: some themes trap focus and touch events inside their cart drawer, which blocks taps on the chooser. The app includes a general workaround. If it still happens on your store, write to support with the name of your theme, the phone model and the browser.

Still stuck?

Write to [email protected] with:

  • your store URL and the name of your theme;
  • the phone model and browser used;
  • the page and the steps to reproduce;
  • a screenshot or a short screen recording from the phone.

Something missing? Write to [email protected], or try it first in the demo.

Read next

Ready to try it on your store?

Install Yaco Progress Bar, set your first tier, and the bar shows up in your cart in minutes. No developer, no pop-up.

Try for free14-day free trial · free plan forever