How to display two collection images per row in mobile view?

Topic summary

Issue: On mobile, the collections list displays one image per row; the request is to show two per row in the Envy theme.

Solution provided:

  • Navigate in Shopify Admin: Online Store > Themes > Actions > Edit Code.
  • Open theme.liquid, search for the closing tag, and paste the provided code right above it.
  • A screenshot guide was included to illustrate where to place the code. The exact code content is not shown here but is central to achieving the two-per-row layout.

Outcome: The original poster confirmed the code worked and thanked the responder.

Status: Resolved; no further questions or disagreements.

Notes: The fix relies on adding a snippet in theme.liquid. Image and code guidance are key to understanding and applying the solution.

Summarized with AI on January 25. AI used: gpt-5.

Hello Everyone. In the desktop view, you can see that collection images are normal. When I switch to mobile view, it gets one collection image per raw.

Would anyone be able to give me code to make these collections list two collections per row.

Store build using Envy theme
Store URL: https://jhirna-1541.myshopify.com/

Any assistance you can provide would be greatly appreciated

@Digital_Imran

  1. In your Shopify Admin go to online store > themes > actions > edit code

  2. In your theme.liquid file, find the **(press CTRL + F or command + F on Mac)

  3. paste this code right above the tag:


If it helps you please click on the “like” button and mark this answer as a solution!

Thank you.

Kind regards,
Diego

1 Like

Thank you so much @diego_ezfy The code works. :slightly_smiling_face:
Have a great day