Out of the box, the main way to display SureCart's (v3+) product images in Bricks is with an element called 'Product Media'. This outputs a pre-built slider with thumbnails for use on the product page. But it's not very customizable and isn't nestable, so we can't use it for displaying the product images outside of that slider. For more flexibility, this Pro Tutorial goes through how to get all of the product's images via Bricks' query loop.
This will then allow us to create grid layouts, add to custom sliders, have the images link to lightboxes etc.. everything we can do easily in Bricks with image elements and query loops.
Migrate Images
First, make sure all images have been migrated and none are coming from SureCart's server. This way all images are in our media library and we have control over the alt text, image sizes etc.
We'll then create a custom query loop for the product's images..
This is a BricksLabs Pro tutorial.
For full access login below or create your BricksLabs Pro account