Marketo Forms Extension Setup Guide

The Marketo Forms extension lets you fetch and display the list of your existing Marketo forms into the field of your content type. As a result, while creating entries, the content managers can view the list of forms, and select the one that they want to use on the landing page. In the Contentstack backend, it saves the ID and the metadata (in JSON format) of the Marketo form that you select.

This step-by-step guide explains how to create a Marketo Forms extension in Contentstack. The steps to be performed are as follows:

  1. Get your Marketo account details
  2. Deploy Lambda function
  3. Add the ‘Marketo Forms’ custom field extension to your stack
  4. Use your custom field

Step 1 - Get your Marketo account details

In order to set up this extension, you will need the following three pieces of information from your Marketo account:

  • Munchkin Account ID
  • Client ID
  • Client Secret

To retrieve these details, log in with the Admin Marketo account, and follow the steps outlined below.

Retrieve Munchkin Account ID

To get your Munchkin Account ID, perform the steps given below:

  1. Log in to your Admin Marketo account, and click Admin in the top right corner.
    Login to Admin Marketo Account.png
  2. On the left-hand side navigation, under Integration, click Munchkin. A page opens, where you will find the Munchkin ID.
    Click on Munchkin.png

Retrieve Client ID and Client Secret

To get your Client ID and Client Secret, perform the steps given below.

Step 1: Create a role that has full API access

  1. Click Admin in the top right corner.
  2. On the left-hand side navigation panel, under Security, click on Users & Roles. Click on the Roles tab. On the page that opens, and click New Role.
    Click on 'Roles' tab.png
  3. Enter the Role Name (e.g., API-only User) and Description (optional). Expand the Access API options in Permissions, and select Read-Only Assets.
    Create the 'Api-only User' Role.png
  4. Click Create.

You will now need to create a user to whom you can assign this role.

Step 2: Add an API-only user

  1. Click the Users tab and click Invite New User.
    Click on 'Invite New User'.png
  2. Fill out the necessary information such as Email, First Name, and Last Name under Step 1: Info. Click NEXT.
    Enter API-Only User info.png
  3. In Step 2: Permissions, check the newly created role under Roles and check the API Only checkbox.
    Assign Permissions to the 'API-only User' role.png
  4. Click NEXT and Send.

Now, you need to create a service and assign the user to retrieve the Client ID and Client Secret.

Step 3: Create a service in Marketo

  1. In the left-hand side navigation panel, under Integration, click LaunchPoint. On the page that opens, click New and then New Service from the drop-down.Click on 'LaunchPoint'.png
  2. In the New Service window, enter a Display Name. Under Service, select Custom. Enter a Description and select the API Only User that you invited. This user will have full API access:
    Enter Service details.png
  3. Once you have created the new service, click View Details to obtain the Client ID and Client Secret.
    Click on View Details.png

By the end of this step, you will have the Munchkin ID, Client ID, and Client Secret of your Marketo account.

Client ID and Client Secret.png

Step 2 - Deploy Lambda function

To protect sensitive information (such as Marketo Client ID and Client Secret) and to avoid Cross-Origin Resource Sharing (CORS) issues, you can use Lambda function for this extension.

After retrieving the credentials, deploy this code for the lambda function to AWS Lambda.

In the Environment Variables section of AWS Lambda, enter the credentials against the variables as follows:

MUNCHKIN_ID= Your Munchkin Account ID
CLIENT_SECRET= Client Secret that you retrieved
CLIENT_ID= Client ID that you retrieved

Enter Marketo Munchkin ID, Client ID, and Client Secret in AWS Lambda.png

Note: Please ensure that the keys i.e., the Environment variables (in upper case) are added exactly as shown above, else your lambda function will not work.

Step 3 - Add the ‘Marketo Forms’ custom field extension to your stack

  1. Go to Settings > Extensions. Click on the + Add Extension button on the top-right corner and select Create new.
    Create New Extension.png
  2. Select Custom Field.
    Select Extension Type - Custom Field.png
  3. On the configuration page, enter details in the fields as given below:
    • Title - Provide a suitable title. For example, Forms.
    • Field data type - Select the data type in which the input data of the field should be saved in Contentstack. Select JSON in this case.
    • Multiple: Leave this checkbox unchecked.
    • Hosting method - Select Hosted By Contentstack. As soon as you do this, you will see the Extension Source Code field below.
    • Extension source code - Enter the source code for the extension. You can find the source code for the Marketo Forms extension here.
    • Config Parameter - Enter the configuration details for the extension. Here, you need to mention the ID of the folder of which you want to fetch the forms (in the ‘folder’ parameter), and the AWS API gateway URL for the lambda function (in the ‘url’ parameter). The ‘folder’ parameter is optional, but the ‘url’ parameter is mandatory.
      {
          "folder":"629"
          "url":"https://abcde1234.execute-api.us-east-1.amazonaws.com/development/demo-widget"
      }
  4. Click on Save. This creates your custom field.

Now, let’s understand how you can start using this custom field in your content type.

Step 4 - Use your custom field

To use your custom field, you need to follow the steps given below:

  1. Create a content type by clicking on the + New Content Type. Enter the relevant details for the content type and click on Create and Add fields.
    Create Content Type.png
    This leads you to the Content Type Builder page where you can add the relevant fields.
  2. Add the Custom field in your content type.
    Add 'Custom' Field.png
  3. Select Marketo Forms from the dropdown and set the other properties of your custom field.
    Select 'Marketo Forms' from dropdown.png

    Note: You can provide specific instance-level configuration settings for your Custom Field extension. Learn more.

  4. After adding other relevant fields in your Content Type, click on Save and Close.

This will create your content type. Now, go to the content type and create a new entry. Enter the relevant details. In the Marketo Forms field, select the Contact Us extension while creating an entry for this content type as shown below:

Marketo Forms Extension Demo - Select Form.png

Was this article helpful?
top-arrow