Can you auto resize a metafield image for mobile?

Store Design
,

Topic summary

Users are seeking a method to automatically resize metafield images differently for desktop and mobile devices.

Current Challenge:

  • One user wants larger images on desktop that automatically scale down for mobile
  • Another user shared their current code implementation using Liquid markup to display a metafield image
  • The existing code maintains the original image size across both desktop and mobile without responsive resizing

Desired Outcome:

  • Fixed pixel dimensions on desktop (e.g., 350px length)
  • Automatic downscaling to fit mobile screens
  • Responsive behavior that adapts to different viewport sizes

Status: The discussion remains open with no solution provided yet. Both users are actively looking for implementation guidance on making metafield images responsive across devices.

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

Hi all, there’s a way to auto resize the metafield image for mobile? I would like to use a bigger image for desktop and automatically resize it for mobile.

Sense 2.0 8.0.0

www.danicoffeeshop.com

1 Like
2

I’m looking for a solution here as well. currently using:

{% assign image_url = product.metafields.custom.hypergalactic_size_charts %}
{% if image_url != blank %} 
 
{% endif %}

But this does not resize for mobile and keeps the original size for both desktop and mobile. would like to have it at a fixed size i.e. 350px length and then downsize on mobile to fit screen.