What do you do when your stakeholder demands a solution and particularly when it is not possible to do so directly?
I'm sure you want to come up with the answer. So here's one of my answers that could benefit you as well, or it could be your own answer too.
It's easy to personalize Marketo landing pages, but it's a tricky one to do for non-Marketo pages. Our use case was to personalize thank you page with the lead first name when he/she submitted his/her details through Marketo form.
That's how we got it...
Step 1: The following script can be placed either in your Marketo form or on the landing page where the Marketo form is located.
<script>
$(document).ready(function(){
MktoForms2.whenReady(function(form) {
//Add an onSuccess handler
form.onSuccess(function(values, followUpUrl) {
var vals=form.vals();
// Take the lead to a different page on successful submit, ignoring the form's configured followUpUrl
location.href = followUpUrl+"?fname="+vals.FirstName.replace(/ /g, "-");
// Return false to prevent the submission handler continuing with its own processing
return false;
});
});
});
</script>
Why did we add this script to our form/page? Ok, let me explain that before I come up with another script that has to be placed on the thank you page. So, on submission of Marketo form, this script will pick the value of the first name and add it to the thank you page URL.
Step 2: Now you need to add the next script to the thank you page that will capture first name value from the URL, store it in a variable, and show it on the page.
<script>
$(document).ready(function(){
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace("", " "));
}
var studentName=getParameterByName("fname");
if (studentName =='NULL') {
studentName="";
}
$('.Thankyou span').text(function(i, oldText) {
return oldText === 'NAME' ? studentName : oldText;
});
});
</script>
Step 3: This is the most important step and if you miss a single thing then it's not going to work. I spent almost the whole day fixing this when just one parameter was missing in the third step... 
Now when you are placing this thank you page content, don't forget this line of your second script where you have defined a class and added a HTML tag.
<h1 class="Thankyou"> <span>NAME</span> Thankyou for submitting your enquiry</h1>
You have to define this message in the same structure. You can change the h1 tag and thank you message but can't change the variable added under span tag "NAME" or class "Thankyou" unless you have changed it in the javascript itself.
I hope you're going to enjoy reading this or maybe this will answer your problem. Keep reading and I'd also encourage you to continue sharing your methods and new solutions that may benefit your buddies.
You can read the same blog on my website at santrathaur.com as well.
Read the blog here: http://www.santrathaur.com/personalize-your-non-marketo-hosted-thank-you-page/
Cheers,
Sant Singh Rathaur
Connect me on LinkedIn - https://www.linkedin.com/in/sant-singh-rathaur/
.png)