Dawn Customisation - How to add text after the close icon on the Product Media Modal Popup

I’m using the Dawn theme. We have quite a few images in the product media gallery for each product. On desktop, it’s not clear that the user can scroll down the product media modal popup to view all the product media.

We’d like to make it more clear by adding a bit of text saying ‘SCROLL DOWN TO VIEW MORE IMAGES’ to the product media modal popup’s desktop view. We’d like this text to appear as vertical text right under / after the close icon. I have attached a screenshot of where we’d like this text:


I tried to code this in, but can’t get the positioning right and would really appreciate if someone could provide the correct code for this.

This is our store url: https://arrange-studio-sa.myshopify.com/

Password: ohtsau

Thank you

Hello @megeh
here is the code you need to replace the code with the old code.
Go to Online Store ------------> Themes ----------------> (click 3 Dots) Edit code-------------> find this file in the Snippets section “product-media-modal.liquid” and replace the whole code with this modified code

{% comment %}
  Renders a product media modal. Also see 'product-media-gallery'

  Accepts:
  - product: {Object} Product liquid object
  - variant_images: {Array} Product images associated with a variant

  Usage:
  {% render 'product-media-modal' %}
{% endcomment %}

Please let me know
Thanks

1 Like
  • Here is the solution for you
  • Please follow these steps:

  • Then find the main-product.liquid file.
  • Then add the following code at the end of the file and press ‘Save’ to save it.

  • Here is the result you will achieve:

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

Thanks so much - this worked absolutely perfectly!!!

Thank you so much :slightly_smiling_face: