Sending Different Responses to Different Landing Pages


I have a simple drop down menu, and I would like to send the visitors to different pages based on their responses. Is this possible? If so, how do I do it?

Thanks!


27 replies

Userlevel 7
Badge +3

Hi @daniestrada11,

Adjusting your multi-step script to accomodate redirects based on a field’s response is not something trivial. It needs to be done by a developer.

I’ve never used this particular multi-step script since we always develop our scripts in house.
However, based on my experience you’ll need to account for:

  1. Field validation
  2. Going back and forth on steps
  3. Swapping out the right redirect URL at the last step in order to avoid redirecting to the wrong URL if people have changed their answer, etc.
    This are just off the top of my head things you have to be careful about.

Best,
Hristian

@Hristian I’m not sure if you saw my previous response, but if you can help me out with adjusting this code, I’d really appreciate it! I’m not a coder so I wouldn’t know where to begin. Thanks!

@Hristian, thanks for your feedback. I’m not a coder so I don’t know what to adjust in the code. I also tried the code from this page but maybe am running into the same issue?

If you can give me pointers on what to change in the coding, I would be very grateful. I understand if that’s too complex.

Let me know!
Dani

Userlevel 7
Badge +3

Hi @daniestrada11,

The script you are trying to use for the redirect was created a while back, before Unbounce changed how they implement forms on LPs. Also, it was never meant to be used with a multi-step script.

That’s why you are running into issues.

You’ll need to modify your multi-step script in order to achieve what you want.

Best,
Hristian

Hristian, Would appreciate a look at my page as well if you’re still in the community. I have a post about my page above this message - https://talcum.global-settlements.org/clp9-2/

Thanks!
Dani

I’m trying to use this code for my page. Not based on city but based on a different list of options. The Field name is: What Type of Cancer Were You or a Loved One Diagnosed With?

It’s the 6th question.

I normally use radio buttons, but have tried a drop down in order to use this code but it isn’t working. I have both options in the form so we can try and figure out how to do it. Question 6 and 7.

I don’t know code, but I’m hoping you might be able to help!

Thanks!
Dani

I need to do basically this same thing, but instead of redirecting to different confirmation pages based on a drop-down field value, I need to do it based on a JS variable. A little background… in order to be a qualified lead, we need the age of the user to be between a specific range which we’re calculating based on a birth date field. The script I’m using to determine age seems to be working fine, but part 2 is where I’m strugging. If the age value is between 30 & 65, we want to redirect to a “YES” page but if it’s outside of those preset values, it needs to redirect to a “NO” page. Can anyone help me figure out the correct syntax for making this work (i.e. if age <= 30 && age => 65) etc? Thanks in advance!

Finally found the fix! Thanks so much.

Thanks Hritian, I fixed that closed properly, still the same issue.
Heres the fix screen shot, but still no redirect.

Any other ideas?
Thanks!

Userlevel 7
Badge +3

Hi @James3333,

It seems like the 2nd to last URL is not closed properly. (see the attached screenshot)

Best,
Hristian

Thanks for this valuable help. I want to do the same thing but because of privacy concerns, is there a way to redirect without passing all the fields to the URL, but just the ones we need to redirect?

Hi Quinn, I believe I’ve tried everything you suggested but I’m unsure what you mean by

“You’d need to change each instance of ‘qs.city’, replacing the city with your dropdown field name”

I’ve replaced the Case but not sure what else you’re referring to. Here’s my code below. If you can let me know where I went wrong that would be great.

  function getQueryStringArray(){
    var assoc=[]; 
    var items = window.location.search.substring(1).split('&'); 
    for(var j = 0; j < items.length; j++) { 
       var a = items[j].split('='); assoc[a[0]] = a[1]; 
    }
    return assoc;
}

//point at which you want to determine redirection
var qs = getQueryStringArray();
var url = '';
if (qs.city !== 'undefined' && qs.city) {
   switch (qs.city) {
      case 'Brisbane':
         url = 'http://learn.pitchblak.co/thank-you-cam-1/';
         break;
      case 'Sunshine%20Coast': 
         url = 'http://matches.confeti.com.au/thank-you-3/';
         break;
   }

   window.location.href = url; //reroute
 }
</script>```

Thanks again Quinn! It’s working and ready to go live 😀

Userlevel 3
Badge +1

Hey Holly - If the city has a space in it, you’ll just need to add %20 between each word in the case ‘city’ part of the script:
ex. case 'Vancouver' would become case 'Granite%20Bay'

Hi Quinn, I have one more question. I don’t code in java so this might be rudimentary. I have many cities that are two words , ie Granite Bay, Cameron Park etc. How do you code the java script to recognize the space between the 2-word cities in the pulldown, Granite(space)Bay?.

thanks!

Userlevel 3
Badge +1

Happy to help, Holly. Cheers!

Worked like a charm, thank you!

Userlevel 3
Badge +1

Hi Holly - this thread was migrated over from our old community and it looks like some of the formatting of the script didn’t get translated over properly. It should look like this:

<script>
  function getQueryStringArray(){
    var assoc=[]; 
    var items = window.location.search.substring(1).split('&'); 
    for(var j = 0; j < items.length; j++) { 
       var a = items[j].split('='); assoc[a[0]] = a[1]; 
    }
    return assoc;
}

//point at which you want to determine redirection
var qs = getQueryStringArray();
var url = '';
if (qs.city !== 'undefined' && qs.city) {
   switch (qs.city) {
      case 'Vancouver':
         url = 'http://unbounce.quinnomori.com/vancouver/';
         break;
      case 'Toronto': 
         url = 'http://unbounce.quinnomori.com/toronto/';
         break;
   }

   window.location.href = url; //reroute
 }
</script>

All the other instructions should be the same.

Hi Quinn, I’m new to the unbounce community, I’ve been trying to make your javascript work for me, not sure what I’m doing wrong. We have dojos in multiple cities and sending a user to the correct widget for lead capture is key. I’ve can see where I’ve gone wrong. I have a couple dummy pages published (KSA Gen Lead Capture) and keep testing them to see where I’ve gone wrong but can’t figure it out.

How can I make this script work for a radio button?

If user selects “A” then A.com
If “B” then B.com

Userlevel 3
Badge +1

Hi Travis - I took a quick look at your account and took a look at the initial page. For the drop down menu, you’ll need to set the form confirmation to go to another webpage, not post to URL, and click append form data to URL.

If you run into any other issues, could you shoot us an email at supportATunbounce.com and let me know the specific page names that you set-up for this?

Hi Again Quinn,

I’m not sure what I’m doing wrong, but I can’t get it to redirect to the new page.

I added the code from above (making the changes you suggested) to the “place holder” page. I added the code to the java scripts portion of the Unbounce page, and added it to the head.

I also made the drop down form confirmation send to and post to another url.

Can you tell if there are any problems with the way I am implementing this work around?

Thanks for your help!

Travis

Excellent…this is exactly what I was looking for!

What I’m really trying to do is separate the visitors to the landing page based on their actual interests. So, the “first landing page” doesn’t really have a form, except to ask them where they want to go next. Then I’ll drop them on the “real landing page”.

I think this will work nicely for my purposes.

Thanks again,

Travis

Userlevel 3
Badge +1

Hi Travis - I just wanted to jump in with another option that should work for you and would let you keep everything in Unbounce. It would require a bit of javascript though.

You’ll need to create a separate thank you page for each drop down choice, then one generic thank you page where you’ll add the javascript redirect.

The way it would work is:

  1. someone hits your landing page and fills out the form
  2. the form is set to go to the generic thank-you page and append the form responses as parameters to that URL
  3. the redirect on that page looks for the response to the dropdown in the URL parameter and redirects to the specific landing page (the generic thank you message is just there in case the redirect fails)

You can see an example that I set up here: http://unbounce.quinnomori.com/dynami…

The redirection script is:

function getQueryStringArray(){ <br />
  var assoc=[];
<br />
  var items = window.location.search.substring(1).split('&');
<br />
  for(var j = 0; j < items.length; j++) {
<br />
     var a = items[j].split('='); assoc[a[0]] = a[1];
<br />
  } <br />
  return assoc; <br /> } <br /><br /> //point at which you want to determine redirection <br /> var qs = getQueryStringArray(); <br /> var url = ''; <br /> if (qs.city !== 'undefined' && qs.city) { <br />
 switch (qs.city) { <br />
    case 'Vancouver': <br />
       url = 'http://unbounce.quinnomori.com/vancouver/'; <br />
       break; <br />
    case 'Toronto':
<br />
       url = 'http://unbounce.quinnomori.com/toronto/'; <br />
       break; <br />
 } <br /><br />
 window.location.href = url; //reroute <br />
} <br /> </script>   

You’d need to change each instance of ‘qs.city’, replacing the city with your dropdown field name.

And then replace Vancouver and Toronto with whatever your dropdown choices were and the corresponding URLs with the specific thank you page URLs, adding more if necessary.

Hi Lou,

Thanks for the quick response. Bummer. I’ll look into Wufoo, and see if I can make that work relatively easily.

Reply