GoToTheme Docs

Straight-to-the-point how-tos for every Shopify theme.

How to Change Products Per Row in Shopify Motion Theme

Motion lets you set the grid density separately for desktop and mobile, so a layout that looks right on a laptop doesn't end up cramped on a phone.

Steps

  1. In your Shopify admin, go to Online Store > Themes and click Customize on Motion.
  2. Switch to a Collection template using the page picker.
  3. Select the Product grid section.
  4. Adjust Products per row on desktop and Products per row on mobile independently.
  5. Click Save.

Since Motion is built mobile-first, it's worth double-checking the mobile column count on an actual phone rather than just the editor's preview — two columns is the common default, and it tends to give product photography more room to carry the visual weight Motion is designed around.

← How to Add Collection Page Navigation in Shopify Motion ThemeHow to Enable Quick View in Shopify Motion Theme →