I thought this may help other people, but definitely will help me to remember what I did when I soon enough forget.
I wanted to make a product page like amazon with the image list changing the main large image on hover.
And I was successful with this, thanks in whole to env variable plugin by @gaurav
With this I am able to hover the image in the R.G. list of images and have the image change in the large image. I also set it up to change on click of the image, but really liked how Amazon did it on hover so…
First, you must have installed the plugin mentioned previously. It costs $16 and after I first purchased it and wasn’t that happy about it as I only used it once, I have since found a lot of use cases for it, and am very happy with my purchase.
Second need to set up the page and things as the screen shots below will detail.
- R.G. of the image list you want. Place the env variable plugin into the first cell of the R.G. with the conditionals set as illustrated
- Set up the workflow for changing the image based on the env variable change
The display data function is setting the group that contains the large image
!
Important to leave the groups data source empty so you can display the data you want in it.
This also allows you to clear the data. As well as set the data on a click of the image in the R.G.
