Empire Mobile theme add to cart below text need to fix

Topic summary

A Shopify store owner using the Empire Mobile theme reports a layout issue on their wine shop website. On mobile devices, critical purchase elements (Size selector, Quantity picker, and Add to Cart button) appear below the product description text at the bottom of the page, causing customers to miss them and not complete purchases.

Current situation:

  • Desktop view displays correctly with purchase controls visible
  • Mobile view pushes these elements far down the page

Goal: Make the mobile product page layout match the desktop version

Proposed solution:
One respondent suggests using a tabbed layout for the product description that remains closed by default on mobile. This would prevent the description from pushing the Add to Cart button down the page.

The discussion remains open regarding specific code changes needed to implement this fix.

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

Hi,

I need some technical help.

Our website https://www.wineshop.co.uk/ looks fine on desktop but I see that on mobile the following-

  • Size
  • Quantity
  • Add to cart button

Sit below the main text at the bottom of the page so many customers miss this and do not checkout.

I want the page to look like desktop for product pages

What code needs to be changed to achieve this fix for mobile view.

Anyones help would be much appreciated

Thanks

Akiko

1 Like

Hello @wineshopuk

Yes, you can use the product description in a tab so that it remains closed by default on mobile view, preventing the “Add to Cart” button from being pushed too far down.