April 08, 2023
Image Gallery on desktop:
Image Gallery on mobile (as a slider):
It can also be made stacked instead of slider.
What it looks like in the Theme Customizer:
You can see a working example here.
Instructions
Follow the instructions below to add this image gallery to your theme as a section that can be added to any page (if you have an Online Store 2.0 theme):
- In your Shopify dashboard, go to Online Store -> Themes. Then find the theme you want to add this gallery to and click Actions -> Edit Code.
- On the left-hand side, open Sections and click Add a new section.
- Select liquid and name it image-gallery. Then hit Done.
- Get the code by clicking on the button below, copy it and paste it into the image-gallery section you just created. Then save it.
- Click the three dots beside the theme name, on the top left, then click Customize Theme.
- You should now see a section called "Image Gallery" available to use. Enjoy!
PS: I packed everything in a single file for easy of use. If you are a developer, you may want to split the CSS, JS and HTML/Liquid into separate bits. Or not.
Support me
💸💸 This is all free for now and made on my spare time, as an indie developer. If you like my work and it helps you make or save money, please consider buying me a coffee! (or an entire coffee maker) 💸💸
For questions, concerns, requests or feedback, message me.