WordPress - Cognito Forms

Overview

The integration relies on 2 WordPress plugins:

How does it work?

The Kiflo plugin will track the visitors on your website and inject the tracking code automatically inside any Cognito form configured accordingly.
The tracking code will become available like the other fields, when the user submits the form.
Then, you can use it to create a new lead in Kiflo using Zapier or our API.

Setup Kiflo WordPress plugin

To download, install and configure Kiflo WordPress plugin, please refer to this article: https://docs.kiflo.com/article/39-wordpress

Configure your form

In your form's settings, active the Developer Mode:

Then, add a new field to store the Kiflo tracking code. This field must have the following properties:

  • Field Name = KifloTrackingCode (remember this name, we will need it later)
  • Type = Single Line
  • Show This Field = Internally
  • Require This Field = Never
  • Read-Only = Always

Once you've done adding all the fields, go to Publish tab and copy the Seamless integration code:

That's it for the configuration, now, let's integrate your form into a page.

Integrate your form into a page

Edit the page or post where you want to display your form.

Then add a Custom HTML block, and paste the Seamless integration code you copy in the previous step.

Should be something similar to:

<!-- wp:html -->
<div class="cognito">
  <script src="https://www.cognitoforms.com/s/ycJT8mfbL0mNpNEl1_n_aQ"></script>
  <script>
      Cognito.load("forms", { id: "1" });
  </script>
</div>
<!-- /wp:html -->

Please note that the following variables identify your form and will be different from the upper example:

  • ycJT8mfbL0mNpNEl1_n_aQ
  • id: "1"

Then modify the code, to allow Kiflo plugin to inject the tracking code in your form during initialization:

<!-- wp:html -->
<div class="cognito">
  <script src="https://www.cognitoforms.com/s/ycJT8mfbL0mNpNEl1_n_aQ"></script>
  <script>
    kjs.onLoaded(function() {
      Cognito.load("forms", { id: "1", entry: { "KifloTrackingCode": kiflo('getTrackingCode') } });
    });
  </script>
</div>
<!-- /wp:html -->

The property name " KifloTrackingCode" should match the name of the field you defined in your form!

That's it!

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.