Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hello!
I need help with making updates to the mobile version of my website (www.n-umorigins.co)- using the Atlantic theme.
Problem Statement: Whenever looking at the products page on mobile, there are small previews of additional pictures at the bottom, which in turn pushes down critical information like price/ratings etc ect. I would like for the mobile version to show one image for the product, with an option to slide thru other pictures AND the desktop version to remain as is.
Initial Solution. I updated my Product Gallery Snippet with the below code and now I can no longer see the additional previews (yay), BUT there is no option to swipe thru other pictures AND the website version is also now messed up. On the website, I can see the previews, but can't click on it. Any help would be much appreciated.
{% if product.media.size > 1 %}
<div class="hide-mobile-thumbs">
<div
class="product-gallery--navigation"
data-product-gallery-navigation
>
{% for media in product.media %}
<button
class="
product-gallery--media-thumbnail
product-gallery--{{ media.media_type }}-thumbnail
"
type="button"
tab-index="0"
aria-label="{{ media.alt }} {{ 'general.accessibility.nav_product_thumbnail' | t }}"
data-product-gallery-thumbnail="{{ forloop.index0 }}"
data-product-gallery-selected="{%- if selected_media.id == media.id -%}true{%- else -%}false{%- endif -%}"
data-media="{{ media.id }}"
data-media-type="{{ media.media_type }}"
>
{%
render 'rimg'
img: media.preview_image,
size: '100x100',
%}
{% case media.media_type %}
{% when 'model' %}
{% render 'icon' with 'model-thumb' %}
{% when 'video' %}
{% render 'icon' with 'play-thumb' %}
{% when 'external_video' %}
{% render 'icon' with 'play-thumb' %}
{% endcase %}
</button>
{% endfor %}
</div>
{% endif %}
Does you theme not provide an option from the customizer to not show thumbnails on mobile? Asking since this is a feature on free themes by Shopify, i know you are using a paid theme but atlantic is still i believe a Shopify theme, isn't it??
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025