Home » Blog » Dev » How to Implement Marketo Form Pre-Fill on WordPress in 2021

How to Implement Marketo Form Pre-Fill on WordPress in 2021

marketo-featured-img

Note: Because GBDA specializes in WordPress development, the solution presented is tailored to WordPress but the principles will be the same for implementation on any platform.

Have you come seeking the Holy Grail of Marketo form pre-fill on WordPress? We know, the documentation was confusing, the desert sun was unforgiving, and the Google searches were unfruitful. Come, weary traveller, sit with us at the Great Big Tavern and let us share in our common tales of woe. We will give you ale to elevate your spirits, and you will leave here with the knowledge you seek.

How to Implement Marketo Form Pre-Fill on WordPress in 2021
A crusading web developer surveys the landscape, yearning for Marketo forms to pre-fill, with lightning bolt

I don’t really want to drink anything. I just want to pre-fill my Marketo forms…

Ok, suit yourself. I wanted to write this blog because I had a good deal of trouble finding a workable solution for pre-filling Marketo forms, and I’m hoping it can be of use to you if you’re in the same boat. I will say that after a great deal of searching, all of the information was out there, it was just spread out across various articles and bits of documentation that aren’t well indexed by Google at the moment.

My sense is that it’s all a bit muddled because the methods to implement pre-fill (and restrictions on it) have been evolving. As of today, the only way to do pre-fill is through custom code (scroll down for our solution), but it can be confusing sifting through the search results when some older documentation seems to indicate pre-fill should work out of the box while others point to functionality that just doesn’t exist anymore. On top of it all, Marketo changed their policy regarding pre-fill as recently as April 2019 to be more restrictive (emphasis mine):

Starting April 24, 2019, Marketo will only pre-fill form fields if the URL used to navigate to the Marketo landing page contains a valid mkt_tok URL parameter value (which occurs when users click tracked links in Marketo emails). What that means is, any time a person is viewing a Marketo landing page with a form, the URL being used must contain the mkt_tok token in the query string, otherwise the form on that landing page will not be pre-filled. If the URL in the browser window does have a valid mkt_tok tracking token, then the form within the page will pre-fill as expected with data corresponding to the person record associated with that mkt_tok.

Also note that if you are embedding Marketo Landing Pages within other web pages using an <iframe>, the mkt_tok would need to be passed from the parent page to the <iframe> URL if you intend for form prefill to work within the <iframe>

So essentially in order to pre-fill form fields, the user must be coming from a marketing email where they clicked a link containing a unique token (mkt_tok) in the query string. This is all done for reasons of security and UX, which is explained in more detail in the link above.

This coffee smells terrible, AND I can’t figure out how to implement pre-fill for my Marketo forms!

Before we move on to our solution, here are a couple of useful links I found along the way that led me to the promised land. Maybe some nugget contained within, in combination with our solution, will be useful to you on your travels:

The Solution

First, you’ll need your Client ID and Client Secret from your Marketo account. You can find instructions on that here: https://developers.marketo.com/blog/quick-start-guide-for-marketo-rest-api/

Marketo API Credentials

With Client ID and Secret in hand, you can move on to the code. This is the plan, in short:

  1. JavaScript (marketo-prefill.js):
    1. Once a Marketo form is loaded, get the value of the _mkto_trk cookie
    2. Make an AJAX call to functions.php and pass _mkto_trk value
  2. PHP (functions.php):
    1. Use our Client ID and Client Secret to retrieve an API access token
    2. Make a call to /rest/v1/leads.json to gather info about our lead based on _mkto_trk
      1. Here is a list of standard fields you can request
      2. In our example we are requesting email, phone, firstName, lastName, website, and title
    3. Return the lead info to the client
  3. Javascript (marketo-prefill.js, continued):
    1. Use the lead info returned from the server to populate our form
    2. Rejoice

The Code

And that’s it! Happy coding 🙂

CUBE-Solved-2.svg

About Great Big Digital

Achieve your website goals with customized data, intuitive UX, and intentional design.