Skip to product information
1 of 1
Published:2023.12.11

Example of adding loading processing to product images in Shopify's Dawn theme

Example of adding loading processing to product images in Shopify's Dawn theme

Applications

  • Product Image Management

How to implement

  • Javascript
  • HTML/CSS
View full details

The Shopify theme "Dawn" does not have a loading process that appears while product images are loading, as seen in other themes. Here is a setting example for dynamically adding a loader with CSS animation using Javascript. (This can only be used with the "Dawn" theme, as the method of specifying the DOM is different.)


Example of adding loading processing to product images in the theme Dawn


[How to set it up (for the Dawn theme)] Add a custom Liquid section to the header group in the theme editor and insert the code


After making a purchase (all items are ¥0), you will be able to view the sample code.

If you have already made a purchase, please login here.

Sample Codes

Test Theme :Dawn/Rise 15.2.0

Add a custom Liquid section to a header group in the theme editor and insert the code

Related Post