The Complete Guide for Integrating Marketo into Webflow

Marketo is a powerful marketing platform that is used by over 37,000 companies worldwide. Its features make it a valuable tool for synchronizing data and automating campaigns.

But on its own, Marketo does little. It needs data about your prospects and customers first before it can produce any insights.

That's why it is so important to properly integrate Marketo into your website. You want to be sure that your online forms sync properly with Marketo, so that any visitor information you receive can be quickly and accurately placed into the system.

Fortunately, if you are using Webflow for your website, Marketo is relatively easy to integrate. As a Webflow focused design and development team, connecting Webflow forms to Marketo is a common service that we perform. 

Here's what we'll cover:

• What is Marketo?
• What you need to get started
• Techniques for integration
• Best practices for Webflow forms
• Common challenges with integration

‍

What is Marketo?

Marketo, now Marketo Engage, is a marketing automation software product that is owned by Adobe. It helps teams attract buyers, nurture leads across journeys and channels, sync sales and marketing, and deliver insights that help get the most out of marketing.

Some of Marketo's core features include:

• Building highly targeted audiences. Marketo can create precise segments for your campaigns using automated capture and continuous enrichment of customer profiles. It can also use native CRM integrations to sync sales and marketing data. 
• Omnichannel engagement. Customers may be active on many different channels, so it's important to reach them where they are. Marketo can execute consistent and personalized campaigns across email, web, mobile, chat, events, webinars, digital ads, and more.
• Personalized content. With integrated generative AI, Marketo can easily create and personalize content to be delivered dynamically across channels. It can also test content variations and use AI to predict the content that will convert the best.
• Campaign operations. Marketo can leverage marketer-defined rules, generative AI, and user-friendly tools for simplifying and automating marketing tasks, such as automatically updating field values and lead scores.
• Sales intelligence. Marketo helps align marketing and sales around the best accounts and leads while enabling sales teams with engagement tools and buyer insights. It can connect to CRMs bi-directionally with native integration to keep teams and systems in sync.
• Marketing analytics. With out-of-the-box dashboards and customizable reporting, Marketo provides deep insights into what's working and what isn't for your campaigns.

‍

What you need to get started

You need two things to integrate Marketo into Webflow:

1. A Webflow site
2. A Marketo account

Note that you will need an Enterprise plan to integrate Marketo forms into Webflow using the official integration.

Before starting, you should also consider your goals and plans for using Marketo with your site. What kind of data do you want to collect from online forms? How would you want to use it? This information will help you guide the setup of individual forms, and determine the individual fields that you place in them.

‍

‍

Techniques for Integrating Marketo Forms

If you want to connect a form on your Webflow website to Marketo, you have a few options:

• Embedding directly using code
• Relying on a third-party automation tool, like Zapier
• Using the official Webflow integration

In most cases, the official Webflow integration is the simplest route to take. However, the other two options are available. Each method has its own tradeoffs, so it's important to consider your team's technical skill level, project goals, and how much control you need over form behavior and styling.

‍

Embedding directly with code

It is possible to connect Marketo forms directly in Webflow using custom code. This might be desirable if you want tight control over the appearance of your forms and are comfortable with HTML and CSS. But keep in mind that custom code can be cumbersome to maintain over time.

Adobe has information on the Marketo site about how to create a Marketo form.

‍

Relying on a third-party automation tool

There are many external tools that can help you automate the integration of platforms like Webflow and Marketo. These include Zapier, Make, and Kestra.

These tools automate software processes, so that you can integrate activity from one platform to another. They can be used, for example, to take form submissions from your Webflow site and immediately submit them to your Marketo account.

The drawback to this is that it does introduce a 3rd party platform to your system. This can lead to consequences and challenges with handling data, including tracking data. 

Also, these tools charge by the number of tasks that they perform, which could potentially be expensive. On the other hand, if you rely on them extensively for other purposes, they may be familiar to set up.

‍

Using the Webflow Marketo Integration

Webflow now comes with its own integration for connecting forms to Marketo. This is, in many situations, the best approach.

Before you can connect a form, you need to connect Marketo to Webflow.

‍

Steps to connect Marketo

Create a new custom installed service in Marketo

This step requires a user set up with API access only. If you don't have one, here is how to create one:

1. Log in to Marketo
2. Click the Admin tab
3. Select Users & Roles from the left hand panel under Security
4. Press Invite New User and fill in the email, first and last names
5. Press Next
6. Choose Access API as the Role and check API Only
7. Press Next and press Send to create the new user

Once you have a user, you can create a custom installed service that references your new user, by following these steps:

• Log in to Marketo
• Click the Admin tab
• Select LaunchPoint from the left hand panel under Integration
• Click New under Installed Services and choose New Service
• Give it a Display Name and choose Custom from the Service dropdown
• Give it a Description
• Choose your user (created above) under the API Only User dropdown menu.
• Press Create

Copy your Marketo IDs

When connecting your Marketo integration, you'll need to include the following 3 Marketo IDs in your setup:

Munchkin Account ID

Munchkin is the Javascript-based tracking service that Marketo uses. To copy the Munchkin Account ID from Marketo:

1. Log in to Marketo
2. Click the Admin tab
3. Select Munchkin from the left hand panel under Integration
4. Copy the Munchkin Account ID from the Tracking Code section

Client ID

The Client ID is used to register an application that works with the Marketo API, and functions as part of the security protocols.

1. Log in to Marketo
2. Click the Admin tab
3. Select LaunchPoint from the left hand panel under Integration
4. Click View Details on your custom installed service
5. Copy the Client ID

Client Secret

The Client Secret is another piece of information used by Marketo's authentication program to make sure that your setup is safe.

1. Log in to Marketo
2. Click the Admin tab
3. Select LaunchPoint from the left hand panel under Integration
4. Click View Details on your custom installed service
5. Copy the Client Secret

Add the Marketo integration to your Workspace

After you've copied your 3 Marketo IDs, you can add the Marketo integration to your Workspace:

1. Open the Account dropdown in the navbar
2. Select Workspaces
3. Select the Workspace where you'd like to add the Marketo integration

Then you can add the Marketo integration:

1. Go to Workspace settings > Integrations tab > Marketing automation integrations
2. Click "Add marketing integration"
3. Add your Client ID, Client Secret, and Munchkin Account ID keys to the corresponding fields
4. Press Add Marketo Integration to save your settings

Steps to Map Individual Forms to Marketo

After connecting Marketo, you can then connect individual forms by following these steps:

‍

‍

Publish your form in Webflow

1. Make your form in Webflow if you have not already.
2. Publish your site containing the form.
3. Fully fill out and submit the form to generate a test submission.

Each form block should have a unique Form name. Having multiple forms with the same name can create problems.

‍

‍

Map your Webflow form to Marketo

1. Go to the site settings of the site that contains the form you want to connect.
2. Go to Forms tab > Form integrations
3. Click "Map New Form".
4. Choose Marketo from the Marketing platform dropdown menu.
5. Select your form from the Marketing form name dropdown box.
6. Choose your corresponding Webflow form from the Webflow form name dropdown menu.
7. Map your Webflow form fields to Marketo lead fields
8. Press Connect form

Test your Webflow form

1. Open your live site, fill out your form completely, and submit.
2. Log in to Marketo
3. Click the Marketing Activities tab
4. Locate your Marketo trigger that starts a Flow linked to the Marketo form submission

‍

Best Practices for Webflow forms

Here are some best practices for making sure that you get the most out of your Marketo integration.

• Use asynchronous loading for form scripts to prevent them from slowing down page load times.
• Testing form submission and data capture. Make sure your forms are working properly by testing data submission quality. After submitting them, make sure they are showing up in your databases formatted properly. Every field should be submitted correctly, and with all hidden fields, meta form data should be mapped.
• Be sure to follow brand style guidelines for forms. This is especially important if you choose to embed external forms. You want the appearance to be crafted to align with the look and feel of the rest of your site.
• Focus on accessibility and responsiveness. Your webpage will be visited by people with different needs and different devices. The Web Accessibility Initiative has several suggestions for making forms as accessible as possible.
• Consider using hidden fields to capture UTM parameters and other information.

‍

‍

Common Challenges with Integration

Look out for these issues. Left unchecked, they could cause bigger issues later on.

• Data mapping. If you have custom fields or complex databases, make sure that data is formatted and aligned properly from the HubSpot form to the database. There could be errors, especially if using a third-party tool like Zapier, or if your forms are especially complicated.
• Tracking code issues. Using third-party tools for integration can inhibit your ability to use tracking information. Double check your Munchkin setup to make sure it is working.
• Form submissions not syncing. The end goal of integrating Marketo is to make sure that all of your marketing information is synced properly. If that doesn't happen, you will get much less out of it. 
• Lack of editing capabilities. It is not currently possible to edit a Marketo integration on your Webflow Workspace after it has been saved. Instead, you will have to delete the integration and create a new one.

‍

Conclusion

Integrating Marketo into your Webflow site is more than just a technical exercise- it’s a strategic investment in your marketing and sales alignment. Used correctly, Marketo can help you capture high-quality data from your website visitors, automate your follow-ups, personalize your messaging, and track the effectiveness of your campaigns across channels.

Whether you are using the simplest integration methods or the most complex, success lies in the details: mapping data fields correctly, ensuring accessibility, testing thoroughly, and keeping a close eye on potential issues like tracking problems or sync failures.

Since our web development expertise is focused on Webflow, and because Marketo is such a common marketing automation platform, connecting the two is a common project for us. We've partnered with dozens of clients to help them get the most out of both platforms at the same time.

Do you have a Webflow site, or want to build one? We'd love to talk!