Discount Code Field, hidden by collapsable menu

Store Design

Topic summary

A user reports that the discount code field on mobile checkout is hidden inside a collapsible “Show order summary” menu, causing customers to miss it. Screenshots show the collapsed default view versus the expanded view they want displayed by default.

Root cause: This is Shopify’s standard mobile checkout design, which keeps the interface compact on small screens. Direct customization of this checkout layout is only available to Shopify Plus merchants.

Suggested workarounds:

  • Add a reminder message before checkout instructing customers to tap “Show order summary”
  • Use cart drawer or upsell apps that allow discount code entry before reaching checkout
  • For Shopify Plus users: modify the checkout template to keep the field expanded

Status: The issue remains unresolved for non-Plus merchants. One responder requested the store URL to investigate further solutions.

Summarized with AI on October 24. AI used: claude-sonnet-4-5-20250929.
1

Does anyone know how to fix this collapsable menu, so that it always shows the Discount Field?

If you visit the checkout page editor, then this is not visible, and it looks like a static section. But on an actual mobile device, this is collapsed, and is causing a ton of customers to not know where to input the discount codes.

Here’s what it looks like by default:

IMG_2428.PNG
IMG_2428.PNG1320×2868 358 KB

And here’s what it looks like if you click on it, to open it (This is how we want it to look like, by default):

IMG_2429
IMG_24291320×2868 284 KB

1 Like
2

Hi @Kasperh9 ,
This behavior is part of Shopify’s default mobile checkout design — the discount code field is hidden under a collapsible “Show order summary” section to keep the checkout compact on smaller screens.

Unfortunately, Shopify doesn’t currently allow direct customization of the checkout layout (including uncollapsing that section) unless you’re using Shopify Plus, which supports custom checkout via checkout.liquid or Checkout Extensibility.

Here are a few workarounds you can try:

  1. Add a reminder message before checkout:
    You can add a short note like “Tap ‘Show order summary’ to enter your discount code” in your cart or in a custom message block on the checkout page (via Checkout > Customizations in the admin).

  2. Use a pre-checkout cart drawer or upsell app:
    Apps like Slide Cart Drawer, Rebuy, or Cart Upsell allow customers to enter discount codes before reaching checkout.

  3. If you’re on Shopify Plus:
    You can modify your checkout template to keep the discount field expanded by default.

If this helps clarify the issue or gives you a usable workaround, don’t forget to mark this as an Accepted Solution so others can find it more easily!

3

Hi @Kasperh9

Welcome to the Shopify Community! Please share your store URL and password (if it’s password-protected), so I can check and provide you with the exact solution.