User experience

Overview

The User experience theme settings offer essential controls for interactive behaviors and visual feedback across your entire storefront. These settings define navigation flow and key transitions, and encourage higher levels of engagement and conversion. Adjusting these options builds a consistent, intuitive environment, supporting both easy browsing and streamlined purchasing.

⚠️ Important: Changes in User experience settings apply site-wide by default unless specifically overridden elsewhere. Fine-tuning these controls is critical for a storefront that feels friendly, fluid, and easy to use.

Key components and functionality

Add to cart style

This option determines how your store responds when a customer adds a product to their cart. It directly shapes the shopping experience and the type of feedback provided.

1. Show mini-cart (default)

   1. Opens a mini-cart overlay or drawer so customers can review cart contents while remaining on the current page.

2. Redirect to cart

   1. Sends customers directly to the cart page, focusing attention on checkout.

3. Update icon only

   1. Updates the cart icon visually, with no overlays or navigation changes.

💡 Tip: Selecting Show mini-cart helps shoppers review selections and continue browsing, while a minimal approach makes shopping quicker for repeat or returning customers.

Enable overlay blur effect

Enabling this setting adds a blur to the background when overlays or pop-up elements appear. The effect helps draw the user's eye to interactive content like modals and mini-cart drawers.

If disabled, the background remains sharp, maintaining a simpler, less layered look.

📝 Note: Overlay blur enhances modal visibility and ensures overlays do not blend in with the main content.

Gallery zoom style

Gallery zoom style controls how customers interact with product gallery images, letting them view product details more closely.

1. Open in lightbox (default)

   1. Clicking a product image opens it in a larger, focused overlay for detailed examination.

2. None

   1. Product images stay in place with no added zoom or overlay features.

Usage notes

1. Test all interactive and animation effects on a variety of devices to ensure smooth, accessible performance.

   1. Pay attention to mobile devices and cross-browser support.

2. Support accessibility by ensuring visual cues such as hover effects do not interfere with usability for keyboard or assistive technology users.

3. Use overlay blur and mini-cart features in balance, considering performance on slower connections or older hardware.

🚧 Caution:User experience settings apply everywhere unless specifically overridden. After adjustments, review your shop experience to maintain a smooth journey for all customers.

Resources