How to create button that leads a random 40% of people to one page and 60% to another?

Ask the community
,
1

I am trying to create a button on Page A that when pressed 40% of people (or 40% of presses whichever is easier) are led to Page B and the other 60% are led to Page C. I’d like to do this again on Page B (ex: Page B Button 40% to Page D and 60% to Page E). I’d like the result to be completely random.

If you reload Page A it (hopefully) doesn’t change your result (If you were led to Page B you can’t reload Page A and later get page C results. This aspect is secondary but would be awesome.

I understand this might be a big request but any advice in the general direction is helpful!

2

Hi Brandon,

Javascript has a random function that can be utilized for this. For the sake of testing in order to get an idea how close to 40% and 60% that it gets, the onReady code is running in a for loop a hundred million times.

Below that is how you would apply that in the button code.

import wixLocation from 'wix-location';
let random = 0,counter40 = 0,counter60 = 0;

$w.onReady(function () {
 for (var i = 0; i < 10000000; i++) {
    random = Math.floor((Math.random() * 100) + 1);
    if (random <= 40)   {
        counter40++;
    } else {
        counter60++;
     }
  }
  console.log("counter40: " + counter40.toString());
  console.log("counter60: " + counter60.toString());
});
 
export function button1_click(event) {
    random = Math.floor((Math.random() * 100) + 1);
    if (random <= 40)   {
        wixLocation.to("/pageB");
    } else {
        wixLocation.to("/pageC");
    }
}
3

Interesting! I figured it would be along the lines of that. My actual percentages are 1.04% and 98.86%. I would just have to replace those into the respective positions in your code right?

4

@lilchipmunk11 Right, just substitute your actual page names in the button code and dispense with the onReady code that was there only for testing purposes.

5

@tony-brunsman How do i tell if it’s actually working? I’ve got the following below.

import wixLocation from 'wix-location';
let random = 0,counter1 = 0,counter99 = 0;

$w.onReady(function () {
 for (var i = 0; i < 10000000; i++) {
    random = Math.floor((Math.random() * 100) + 1);
 if (random <= 1.08)   {
        counter1++;
    } else {
        counter99++;
     }
  }
  console.log("counter1: " + counter1.toString());
  console.log("counter99: " + counter99.toString());
});

export function button2_click(event) {
random = Math.floor((Math.random(100000)) + 1);
 if (random <= 1060)   {
        wixLocation.to("https://www.google.com");
    } else {
        wixLocation.to("https://www.yahoo.com");
    }
}
6

@lilchipmunk11 The following line creates a random whole number between 1 and 1000.

random = Math.floor((Math.random() * 1000) + 1);

In the test portion, you could put a console.log(random) for each line of the loop, so you can see in the developer console at the bottom of the page what the function returns line by line. It will run for a few minutes …

7

I tweaked it a bit and now this works well

import wixLocation from 'wix-location';
let random = 0

$w.onReady(function () {
});

export function button2_click(event) {
    random = Math.floor((Math.random() * 1000000) + 1);
 if (random <= 10806)   {
        wixLocation.to("https://www.google.com");
    } else {
        wixLocation.to("https://ww.yahoo.com");
    }
}

Is there anyway the choice that is decided by the random number to become set in stone for that browser? or at least that browsing session? For example If random <=10 and the user clicks the button and is sent to google.com. If they come back to my site and click the button again it will always send them to google.com and not allow them to get another choice?

8

@lilchipmunk11 Have a look at the wix-storage API . It will allow you to store the random result for that browser or browsing session using local or session storage respectively.