Introduction

Mobile users often miss important details such as charges, totals, or the discount code field in Shopify’s checkout. By default, the order summary is collapsed, which can lead to confusion and cart abandonment. This guide will show you how to expand the order summary by default for both Shopify Plus and regular Shopify merchants.

1. Why Expand the Order Summary by Default?

Expanding the order summary ensures customers can easily see:

• Order totals and breakdowns.
• Discount code fields.
• Shipping and tax information.

Making these elements visible can reduce abandoned carts and enhance user experience, particularly for mobile shoppers.

2. Methods to Expand the Order Summary

Depending on your Shopify plan, there are different ways to expand the order summary:

1. Shopify Plus merchants can customize checkout settings directly.
2. Regular merchants can use JavaScript snippets as a workaround.

3. Solution for Shopify Plus Merchants

If you’re on Shopify Plus, you can enable this feature through the admin settings:

1. Go to Settings > Checkout in your Shopify admin.
2. Click Customize next to your checkout configuration.
3. Select Order summary in the Sections sidebar.
4. Activate the Always show discount code field setting.
5. Click Save.

This will expand the order summary by default on mobile for a 3-page checkout layout.

4. Solution for Regular Shopify Merchants

For merchants not on Shopify Plus, you can use a JavaScript snippet to expand the order summary:

Step 1: Add the Script

1. Go to Online Store > Preferences in your Shopify admin.
2. Scroll to Additional Scripts and paste the following code:

Step 2: Save and Test

1. Click Save and navigate to your checkout page.
2. Ensure the order summary is expanded by default on mobile.

Note: This script may need adjustments for newer themes or 1-page checkout layouts.

5. FAQs

• Does this solution work for all Shopify plans?
  Shopify Plus merchants have built-in customization options, while regular merchants can use JavaScript snippets.
• What if the script doesn’t work?
  Ensure you’ve placed the script in the correct location. If using custom themes, consult a developer for compatibility.
• Will expanding the order summary increase conversions?
  Making order details and discount fields more visible can reduce confusion and improve checkout completion rates.