Our native Foleon form element lets you quickly create and style forms in your content. However, sometimes you may want to use one of your Marketo forms so that your marketing automation kicks in right after a reader clicks the submit button. In this article, we show you how to use the Marketo form element.
💡 This feature is not included in every plan. If you're interested in using this functionality, please reach out to our Customer Success Management team.
What to do in Marketo
To use the Marketo form element, you must create a form in Marketo. Once you’ve created the form and the input fields, search for the embed code in the form actions dropdown.
💡 Not sure how to create a form in Marketo? Check out their documentation on forms.

Click on Embed code, where you will find the following variables:
- Base URL (make sure to include the “//”)
- Munchkin ID
- Form ID
In the embed code, you can find these variables in the second script element.
<script>MktoForms2.loadForm("//Base URL", "Munchkin ID", Form id);</script>
Here’s a full example of such an embed code:
<script src="//app-ab**.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm_1562"></form>
<script>MktoForms2.loadForm("//app-****.marketo.com", "875-JTE-***", 1562);</script>
From this embed code, you can extract the following variables (example):
-
Base URL - //app-****.marketo.com
-
Munchkin ID - 875-JTE-***
-
Form ID - 1562
The next step is establishing a connection between your Foleon project and your Marketo account.
What to do in Foleon
Go to Foleon, open the project settings, and scroll down to Marketo tracking. Toggle on Marketo page tracking, and paste in the Marketo ID (for example "875-JTE-***").
Make sure to save your project settings.

Using the Marketo form element
In your Foleon Doc, open the elements bar and drag the Marketo form element to your page.
⚠️ To use this feature, you must first set a Marketo ID in your project settings. If you haven't set this, you'll not be able to fill in the fields.

A modal will ask you to add the Base URL and Form ID. Add your form ID and hit Save.

In the image below, you see what a Marketo form element might look like in your Foleon Doc. You can now test it in the preview.
💡 If you want to change the styling of the form to match your brand, follow the steps in Styling your form.

Once a visitor has filled in your Marketo form, they will see a default success message to inform them their submission was successful.
Learn how to customize this success message below.
Set up a success message
In the form settings, you can set up a success message for when a visitor of your content submits the form.
Click the cogwheel icon in the blue element bar, go to the general settings, and fill in your custom success message in the text field.
💡 The text styling is inherited from paragraph in the brand settings.
Styling your form
When you create a form in Marketo to use in your Doc, there are limited styling options in Foleon. However, Marketo allows you to customize your form to suit your needs.
💡 Learn more in Marketo's documentation: Edit the CSS of a Form Theme.
In addition to Marketo pre-built themes, you can apply styling by inserting custom CSS code into the Doc’s remarketing field in the Foleon Doc settings.
If you want to prevent spam form submissions by enabling reCAPTCHA, learn how to set this up in Marketo's documentation: Setting up reCAPTCHA v3.
⚠️ Any custom code that has been implemented is the responsibility of the creator. Although this feature is easy to use, ensure you know your custom code inside out. If you're not very experienced with coding, we don't recommend using this feature.