How to link Wordpress Form (Contact Form 7) with Marketo Database

[LucasDF]

Hello,

I wanted to know about people's best practices when It comes to connecting WordPress Form with the Marketo Database,

For my example: I'd like people who fill the newsletter form on my website to be automatically transferred to the Marketo Database with a Label "Newsletter" so I can send them directly into my nurturing process. 

I guess there are many ways to do that, so if you have any advice to give me I'll be happy with that,

Thanks

Lucas

[SanfordWhiteman]

You should be using an embedded Marketo form on your WordPress site, not a local form builder.

When using Marketo, best practice is to submit true Marketo forms. This allows you to track and trigger on Filled Out Form activities in Mkto.

[LucasDF]

There are no other ways to make it work with other form ? I could do that but I have to say the form editor in Marketo isn't really great aesthetically speaking, it wouldn't look good in the design of my website, otherwise I'd do it

[SanfordWhiteman]

You can customize the styles of a Marketo form very easily — in fact the Form Editor has a built-in place to store Custom CSS.

A developer can bridge the gap between a custom HTML form and Marketo by using the Marketo Forms JS API to post a hidden form to Marketo. But without a dev, that angle isn't going to be possible.

[Tim_Griffin1]

Hi Sanford - 

Just to confirm, using Contact Form 7 precludes the "simple" use of a double form like you laid out here?

https://codepen.io/figureone/pen/b8bc4bc6b321858c8a036dd60d36b89c

How much dev work would be required to make this kind of a link for CF7?

Just launched native Marketo forms on 2 sites in the past 6-8 weeks, and we're seeing exit rates (without submittal) on those form pages jumping UP 8+%. May just be styling/page appearance, but the obvious knee jerk reax is to roll that back and find another way to automate data entry into Marketo/CRM.

Tim

[SanfordWhiteman · Accepted solution]

No more than an hour of development if you're familiar with what Marketo expects.

Contact Form 7 has a simple API that lets you pass the submitted values to a JS callback. It's an Array of Objects to start, but reduce it to an Object and pass it to the Marketo submit. Easy.

[lawrencejohnson]

You absolutely can use your own form system to send submissions to Marketo. There is a REST API we use all the time for this sort of thing, but there are pros and cons:

Pros

- Own complete control over the user experience for your forms. Yes, you can style Marketo forms, you can even hook into their JS API for plenty of other like transitions, but if Marketo is only one piece of your form processing, then eventually this approach becomes burdened (using multiple CRMs, local database requirements, multi page forms, notification requirements exceeding what Marketo can do, etc.). Again, not saying these things are impossible, but there are plenty of use cases we've encountered.

- Use server-side data to customize what gets sent to Marketo. This can be particularly important for data that may be sensitive enough that you don't want it ever to exist client-side.

- Custom validation against server-side conditions. This can be useful if you have complex validation requirements for your form that also compare against data that is not available on the frontend.

- Marketo embedded forms can significantly decrease your site's performance rating ultimately impacting SEO. If you go with the standard implementation approach, Marketo dumps a large library that also includes jQuery as a render-blocking script. You can (and I have) implement something more custom to load async deferred to reduce this but it requires significant effort.

Cons

- There are some things with tracking user interaction with the forms quite that just aren't possible to do without using the Marketo embed forms.

- The REST API happens on your backend, which means your form processing time will increase by about 1-2 seconds on average.

- Anytime you make an update to your Marketo form, you also have to update the code that processes your form.

In Summary

Yes you can do this, but it should be approached as an effort that requires significant development initially and will require developer involvement as new updates are made. In general, Marketo's embedded forms are much better than most CRMs, and I think they are worth using for most use-cases.

As for Contact Form 7, we don't use it for many reasons, but I imagine there is either a plugin extension or perhaps hooks you can tap into to achieve what you want.

More info on Marketo REST API Here

https://developers.marketo.com/rest-api/

[SanfordWhiteman]

---

You can (and I have) implement something more custom to load async deferred to reduce this but it requires significant effort.

---

Takes < 5 lines of code to switch the forms2 library to defer or async, really not significant at all.

[lawrencejohnson]

That heavily depends on the rest of your website framework. You need a competent waiting mechanism to load once the library is ready and while the number of lines of code is not necessarily high, it's not novice-level javascript especially if you have multiple dependencies.

[SanfordWhiteman]

I have a post on the Products blog on this coming out tomorrow (it's actually been in drafts for like 6 months!).

True, you could have a plethora of other frameworks/package managers/etc. adding to the overall complexity, but a basic mod of the default embed code to use defer is very simple. Not for a novice dev — but then nothing is simple for a novice! 🙂