Need help getting code for custom liquid

Topic summary

A Shopify beginner is attempting to implement a custom gallery template found on another website but lacks coding experience. They’ve inspected the page and copied HTML code for a gallery layout featuring product images with specific styling (2-column grid, portrait aspect ratio, lazy-loaded images).

Key Challenge:
The user doesn’t understand how to adapt the copied HTML for use in Shopify’s custom liquid sections. The code includes:

  • Gallery container with CSS variables for columns and overlay settings
  • Image elements with Shopify CDN URLs and product handles
  • Lazy loading functionality
  • Responsive image srcsets

Current Status:
The discussion appears to be a help request with no responses yet. The user is seeking guidance on which parts of the HTML code need modification to make the template functional on their own Shopify store. The posted code snippet appears partially corrupted or reversed in some sections, which may complicate implementation.

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

Hello, I am currently working on customizing Shopify website however I am very new to this whole thing, including code. After countless videos I still don’t fully understand how to use custom liquid. Specifically, I would like to use a template i’ve found on a website, on my own website. So I inspect the page to retrieve the HTML code(which i pasted at the bottom along with what it looks like). What in this code do I have to change in order to make the template appear and work on my site. Thank you in advance.

html code:

</figure