Hi everyone,
So I’m building a photography website and I want the homepage to feature a single picture picked at random. I’ve tried achiving this using several mathods but nothing worked out and I’m lost. 
I’d love to hear your ideas. Thanks!
Hi Roi,
Add the images to a collection and use Math.random() to get a random image and set it to your gallery or standalone image element
Thanks Ido and Geo!
I managed to figure out creating a collection and connecting it to the image element, but I’m confused when it comes to using Math.random() with the collection using the page code panel. I’m just so very lost. Help?
Thanks again!
I’m super lost… can someone please help me with this?
Hi Roi,
I found this thread on stackoverflow.
Once you got your image’s source just assign it to the image element.
For example:
$w('yourImage').src = imageSource;
Feel free to paste your code here
Roi
Hi Roi Dolev,
Did you ever figure it out? I’m trying to do the same.
Cheers
Jannu
Hey Jannu,
The Random Image example should give you a good start.
Hi. Did you guys ever figure this out? Im trying to do the same thing, but the “Random Image” link doesn’t work…
Hi,
Can you try again ? the link should work
I was able to get the link to work and I tried to mirror what you did. I created a data set, I created a collection, I connected the data set to the collection. Now I believe I need to connect to a page element to get everything to work. What type of element do I need to connect to? Any suggestions? BTW - What I am trying to do is rotate out banner ad images all going to the same link.
Hi @yisrael-wix
Thank you so much for your help and providing the code example. I used the Random Image example you provided and it works well for me. However in my case, I need the random image to also load with it’s url (in the database), so that when clicked on the user gets sent to the link from the random image.
I have trouble figuring out how to do that after many failed attempts. This is a crucial part of my project and I can’t thank you enough already how much you have helped me, but this last step of hooking up a url is all I need. <3
My Code:
import wixWindow from 'wix-window';
import wixData from 'wix-data';
$w.onReady(async function () {
// Check the render cycle so this is just done once.
// Otherwise, server-side will render, and then the image
// switches to the image that the client-side rendered.
if (wixWindow.rendering.renderCycle === 1) {
let res = await wixData.query("AdvertisementImage").find();
let items = res.items;
let count = items.length; // how many images do we have?
let rnd = Math.floor(Math.random() * count);
$w('#adimage').src = items[rnd].image; // get a random image
}
});
Hi there! You don’t need to have a dataset or connect your element/image to the database. You do need the data base however.
Here is the code you want to use 
import wixWindow from 'wix-window';
import wixData from 'wix-data';
$w.onReady(async function () {
// Check the render cycle so this is just done once.
// Otherwise, server-side will render, and then the image
// switches to the image that the client-side rendered.
if (wixWindow.rendering.renderCycle === 1) {
let res = await wixData.query("ImageID").find();
let items = res.items;
let count = items.length; // how many images do we have?
let rnd = Math.floor(Math.random() * count);
$w('#imageFieldKey').src = items[rnd].image; // get a random image
}
});
@danyminko You will need to add a field to the collection that contains the desired url. So, for example, add a field called url.
You then need to add the following line to the code to set the image’s link:
$w('#image1').link = items[rnd].url;
@yisrael-wix Thank you! I actually tried this method and I was close to getting it except I guess I forgot to replace .src with .link. I will try this out and get back to you with results.
@danyminko Do you actually need to specify the number of images in the count? Here is my code that doesn’t load an image. Help making this work would be greatly appreciated!
#image20 is my element where I want the random image to load. HomePageHeroes is my dataset which contains the images.
UPDATE - image loads but it is the same image every time, it is not random. It is the image i set #image20 to initially. It loaded once I replaced the dataset name in my above code with #dataset1 (the corvid title for the data set on the home page).
@yisrael-wix Hi Yisrael, Dany again. I’m wondering if you could help me fix my code, which is somewhat related to this forum post, but also kind of not. For a few months now I have been trying to make an advertising Lightbox that opens/closes depending on what user role is on the site.
I have 3 possible roles:
1.) user is not logged in
2.) user is logged in (member)
3.) user is logged in, and purchased a membership rank. (paid member)
My goal is to have the Lightbox close for the paid member, and be open for anyone that is not a paid member (the other two roles). Here is what I have so far, could you give me any pointers on what I could be doing wrong? Big thanks my friend.
P.S. Its for a cool little Online Web Games website www.kompotgames.com
import wixUsers from 'wix-users';
import wixWindow from 'wix-window';
$w.onReady(function () {
let user = wixUsers.currentUser;
user.getPricingPlans()
.then( (pricingPlans) => {
let firstPlan = pricingPlans[0];
let planName = firstPlan.name.name; // "Membership"
if (planName === "Membership") {
wixWindow.lightbox.close('Advertisement');
}
else {
wixWindow.openLightbox('Advertisement');
}
});
});
@danyminko Hey there Dany…
You might want to look at the following example…
Stripe Payment Processing
Integrate the Stripe Payment processing system into a site. Three levels of user access are demonstrated: visitor, freemium (registered), and premium (paid).
The example uses routers for determining “what to do” for each type of site visitor.
@yisrael-wix Hi Yisrael thanks for the response. I took a few glances over it (didnt touch template edit mode). It seems doable, a bit complicated and confusing, but maybe I need to touch it. As far as I understand it creates an ID for a user that then later allows them to access paid pages.
Regarding the code that I displayed however, is there something wrong or hopeless about it? Do you think that its not doable. I don’t have Stripe and if I can avoid creating and setting up and account, and just do it through the wix Plans I would prefer that.