A

Anonymous

Solved

capture interesting moment, known lead

Forum|Forum|9 years ago
May 25, 2016
4 replies
3822 views

I wanted to get some help thinking through a solution for this.

First, the setting:

We have a Marketo form for requesting white papers, etc. It's embedded on our website, and there's a munchkin code on the site. When a user fills out the form, it populates two hidden fields with some URL-passed information we need. Then an automatic email goes to the user, providing a link to the white paper.

If somebody returns to the form for another request, already cookied, they get the form's "custom html for known leads", instead. This html provides a link direct to the white paper. No email is sent.

Challenge:

We want to create an Interesting Moment that passes this info into Salesforce. It seems to work for first time visitors, but we want it to also work when a returning visitor shows up - getting the custom html rather than the form.

I thought I'd read somewhere that when a visitor returns and gets the custom html this should still register as a form fill, but it didn't seem to do so. Is this correct, and what is a good way to capture this moment?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by SanfordWhiteman

Check out MktoForms2 :: QS-aware KL HTML. Pass your ?title=<title>&type=<type> and the values are populated in the proper spots.

The KL HTML itself is dirt-simple since all the logic is brought out into the whenReady listener:

(The %-variables are not really interpreted, they're just placeholders.)

Note one wheel not worth attempting to reinvent is query string parsing. I've written my own parser in the past but it cannot come near the near-industry-standard URI.js, which is included here.

Grégoire_Miche2

Level 10

Hi Charles,

What is the HTML code you have been putting in the custom HTML? You need to have the {{form.button}} token so that it can register the form fillout event.

-Greg

A

Anonymous

hmmm. I wonder if I've painted myself into a corner?

When a first time uer fills out the form, and request the asset, the submit button doesn't take them directly to it. It redirects them to a confirmation page saying "you'll receive an email with the link".

When someone returns to the the page, it pulls from the passed variables in the url at top to create the link, not a {{form.button}} link. This was so we could use a single form to handle multiple requested file types. Looks like this:

(for reference, click to request a white paper or case study here: live page )

------------------------------------------------------

<div><span style="font-size: 14px;"><span style="color: #666666;">Welcome back, {{lead.FirstName}}!</span> {{form.NotYou:default=Not you?}}</span><br /> <br /></div>

var param1var = getQueryVariable("param1");

function getQueryVariable(variable) {

var query = window.location.search.substring(1);

var vars = query.split("&");

for (var i=0;i<vars.length;i++) {

var pair = vars[i].split("=");

if (pair[0] == variable) {

return pair[1];

}

var param1 = vars[0].substr(vars[0].indexOf("=") + 1);

var param2 = vars[1].substr(vars[1].indexOf("=") + 1);

if (param2=="white_paper") {

param1="<span style=\"font-size: 14px;font-weight:500;\">Thank you for your interest in our white paper. </span><br/><a href=\"go.url.com/rs/746-PTV-801/images/"+param1+".pdf\" target=\"_blank\">Download it now</a>";

} else if (param2=="case_study") {

param1="<span style=\"font-size: 14px;font-weight:500;\">Thank you for your interest in our case study. </span><br/><a href=\"go.url.com/rs/746-PTV-801/images/"+param1+".pdf\" target=\"_blank\">Download it now</a>";

} else if (param2=="webinar") {

param1="<span style=\"font-size: 14px;font-weight:500;\">Thank you for your interest in our webinar. </span><br/><a href=\"go.url.com/"+param1+".html\" target=\"_blank\">View it now</a>";

} else {

param1="There may have been an error in processing your request. Please try again, or contact us for further assistance.";

}

document.getElementById("fillbox1").innerHTML = param1;

document.getElementById("fillbox2").innerHTML = param2;

}

// ]]></script>

<div><span style="color: #666666; font-size: 14px;"><a href="mailto:email@url.com">Contact us</a> to learn more about our services.</span><br /></div>

<div><span style="font-size: 14px; color: #666666;">Thank You!<br /> </span></div>

------------------------------------------------------

NOTE: I tried putting {{form.button}} on the page to see what happened, but it just put it there as literal text - "{{form.button}}".

Grégoire_Miche2

Level 10

Hi again Charles,

My understanding is that the form.button needs a default="" to display a text, so the form will be {{form.button:default=the text I want}} and it should be in the custom code, together with the {{form.not you}}.

and if you want to pass to Marketo some specific target links, you should rather use a hidden field.

-Greg

A

Anonymous

Ok... I got the button to work - needed a capital B.

But I fear I'm still a little confused on some of this. On the actual form, I have hidden fields populated by the URL parameters. But how do I do that on this custom html field without a form on it?

Grégoire_Miche2

Level 10

You will need to play with some JS code and the forms 2.0 API, I think.

But before this I would run a test, since I am not sure that the form, even not displayed, would not capture the hidden fields.

@Sanford Whiteman, @Courtney Grimes, ever tried to capture data in hidden fields while running the "known lead" feature ?

-Greg

SanfordWhiteman

Level 10

Hidden fields will not be Autofilled if KL HTML is shown. They can be added using the standard form.addHiddenFields() method.

A

Anonymous

Thank you... any help you could give is greatly appreciated. I've spent a little time today trying to wrap my head around this, but nothing's sticking. none of my experiments work. I've tried many of the different sample scripts out there, just to see what they'd do. But even those 'out-of-the-can' scripts don't seem to work inside the Known Lead Html. I'm stumped.

SanfordWhitemanAccepted solution

Level 10

Check out MktoForms2 :: QS-aware KL HTML. Pass your ?title=<title>&type=<type> and the values are populated in the proper spots.

The KL HTML itself is dirt-simple since all the logic is brought out into the whenReady listener:

(The %-variables are not really interpreted, they're just placeholders.)

Note one wheel not worth attempting to reinvent is query string parsing. I've written my own parser in the past but it cannot come near the near-industry-standard URI.js, which is included here.

A

Anonymous

Nice! Hadn't seen .js that way. I just know basic if/else and case.

I've dropped everythiing into place, but I not quite to my goal. I think I must be misunderstanding something?

On our website, I have what you wrote in Code pen...

On our KL HTML section I put the <div class="k1">....</div> code you pasted above. I left the %asset.placeholders% as is. Did I need to change those?

The form works, and the KL message comes up, but the placeholders remain. Either I misunderstood something, or there's a step I missed. Does the URI.js take care of the query string completely, or is there an extra step I need to do?

Also, this doesn't have the {{form.button}}. I haven't looked yet, but do you know if KL's will register as a form submission in Marketo?

For reference: live page

A

Anonymous

After a couple offline discussions and a couple modifications to the sample code he'd given, Sanford Whiteman helped me to get through a couple hoops, and this is resolved!

If anybody's curious, check out his .js solution.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded