Define TY page on Landing page (instead of via form)

[Jordan_Hellye11]

Hello!

I am having a bit of difficulty implementing some custom Registration page code, and was hoping someone from the community might be able to help!

In a nut shell, we are trying to implement a set up where essentially if a lead is from *a list of countries* they are shown form A, and if they are not from that list, are shown form B. We decided to use MaxMind to check the lead's IP against their database, and return a country code, and then are using JavaScript in an HTML element to show the correct form, accordingly. Everything is working fine, except for the routing to the TY page. The forms are global, so the TY page is defined in the form as a token {{my.Thank You LP}}-- but when testing the form is navigating to the default home page, upon "Submit". We tried creating a local form, defining the TY URL directly (as opposed to calling the token) and that works perfectly. My theory is that because the form isn't plugged in via the landing page element, but is instead pulled in via JavaScript, Marketo is having a hard time pulling the my. tokens. However, for scalability reasons, we need to keep the forms global, and hence need to use the my. token to define the TY page

So! I am thinking that the actual landing page lives in the program, so perhaps we could define the {{my.Thank You LP}} via the Landing page instead of in the form? But haven't been able to come up with the code to do so. Any ideas (or additional suggestions?)

Many thanks!

Katelyn

[Pavel_Plachky]

Hello Jordan,

You could try allowing two forms on the landing page template and placing both forms on the landing page using the Marketo UI. You would use JavaScript to select which form is shown.

You would get the additional benefit of having pre-fill available.

I hope this helps,

Pavel

[Jordan_Hellye11]

Hi Pavel,

Thanks for responding--though, I don't think I understand what you mean? Can you provide a more detailed explanation please?

Thanks!

[Pavel_Plachky]

In your landing page template, you can have two elements that allow you to place a form: This would look like this:

<div class="mktoForm" id="formA" mktoName="Form A" style="display:none"></div>

<div class="mktoForm" id="formB" mktoName="Form B" style="display:none"></div>

Using the landing page editor, you place two forms on the page (two placeholders will be available on the right), although none of them will be shown initially or in the UI. You will then use JavaScript to set the style of the div element containing the chosen form and un-hide it.. You could also use JavaScript to show the correct form in a pop-up.

I hope it helps.

Pavel

[Jordan_Hellye11]

Hi Pavel!

I see what you mean.. And actually we tried that. But the other form element was causing issues, because Marketo wanted the required fields to be filled out on the form that was not chosen (the hidden form), so was preventing submission. We couldn't figure out how to resolve that.

[SanfordWhiteman · Accepted solution]

So! I am thinking that the actual landing page lives in the program, so perhaps we could define the {{my.Thank You LP}} via the Landing page instead of in the form? But

Yes, very simple:

MktoForms2.whenReady(function(form){
   form.onSuccess(function(vals,tyURL){
      document.location.href = "{{my.Thank You LP}}";
      return false;
   });
});

Be aware that when you use the form embed on a Marketo LP you also lose native Pre-Fill (since the page is treated as an external page) and need to use a different approach for that.

[Jessica_Sprink2]

Hi Sanford,

In your answer above to set the TY page instead of the form using the token, where would I add this code?

1. MktoForms2.whenReady(function(form){ 
2.    form.onSuccess(function(vals,tyURL){ 
3.       document.location.href = "{{my.Thank You LP}}"; 
4.       return false; 
5.    }); 
6. });