Send a Purchase Webhook to Funnelytics with Integromat

How to send purchases to Funnelytics using Integromat

Scenario Overview

In the following picture, you can see how your scenario will look when we will have finished setting it up.
download (1)-1

Create a Scenario in Integromat and add the Webhook as a trigger


Step 1. Select the Webhook app as a trigger.  Choose the Custom webhook module option as the trigger event.

Step 2. Give your custom webhook a name,

  1. Click the Add button,
  2. Enter a name in the "Add a Hook" window that appears
  3. Hit save
    .

Step 3. Copy the webhook URL from Integromat and paste it into your payment processor/cart solution.

Set your payment processor/cart solution to fire the webhook once the order is created.


Be sure to test your funnel so Integromat can have some data to work with.

Add the Iterator tool

The Iterator tool allows your Integromat scenario to read multiple products' info nested inside your webhook.

Step 1. Click on the green "Cog" icon you can find at the bottom of your scenario page.

Step 2. Select "Iterator".


Step 3. Go ahead and connect it to your Webhook trigger. Once done, you will be able to select the element of your webhook that contains the products purchased so that Integromat can collect the information and send it to Funnelytics.

In the image below, we have selected the 1. resource: spreadsheet: data[] element.

Note: The numbers you will see on the elements once selected, are there to make it easier to understand where that data is coming from.

These numbers correspond to the number you see under each module.

In this example, the webhook has the number 1 so every element coming from it will have a 1 at the beginning.

 

Add the Aggregate to JSON module

Now that you have made all the purchased products' data available to Integromat, let's ask it to put them in a way that the Funnelytics endpoint will easily digest.

To do this you will have to add an Aggregate to JSON module.

Step 1. Click on the little "+" icon on the bottom of the scenario page.

Step 2. Type JSON in the window that pops up,

Step 3. Select the JSON icon

Step 4. Then hit Aggregate to JSON.

Configure the Aggregate to JSON module

Configuring this module is quite easy thanks to the built-in generator, which lets you create the layout by making it read the structure of the final code we want to create.

Step 1. Start by selecting the Source of the data from the dropdown menu, which will be the Iterator.
Step 2. Then click on the Add button to create a new data structure.

Step 3. Give it a name.

Step 4. Click on Generator.

Step 5. In the new window, select JSON in the "Content-type" dropdown menu. 

Step 6. Paste the following code in the "Sample Data" field.

{
"product_name": "my product name",
"product_id": "my product id",
"total": 0
}

Integromat will read the JSON code and will populate the "Specification" section with the three elements we need and their value type.

jSON SELECT

The last step needed is to go back to the first window of the Aggregate to JSON module and select which values shall fill those fields. To do this just click on the field that needs to be filled and select the value from the pop-up window.

Note: Every Integromat module output value will inherit the module's color so that it will be easier to spot the correct element when recalling them in a further step.

Add the HTTP Request

Let's get to the last piece of our puzzle, the HTTP Request module.

To add the module, we will once again click the little "+" icon that appears at the bottom of the scenario page, however, in this case, we will search for "HTTP", and the action will be Make a Request.

Configure the HTTP Request module

Step 1. Add https://track.funnelytics.io/events/commerce to the URL field. 

Step 2. Select POST as the Method.

Step 3. Add two headers as detailed in the table below:

Header Name Value
1 Content-Type application/json
2 Authorization Your Funnelytics API key (you can find it in your workspace settings tab)

Step 4. Select Raw as "Body Type"

Step 5. Set JSON (application/json) as the "Content type".

Step 6. Lastly, in "Request content"  paste the following code and enter your data between the empty quotes ""

{
"email": "",
"datetime": "",
"items":
}

Post request setup

Click the "Request Content" field to reveal the data mapping pop-up.

Post request fields

Step 1. In the webhook elements look for the one that contains the User's Email and add it between the quotation marks in front of the "email": line. In my case here is 1. resource: customer: data: email.

Step 2. Again, in the webhook elements, look for the property that contains the order creation timestamp and add it between the quotation marks in the "datetime": line.

Step 3. Add the Aggregate to JSON output in the "items": line.

Note: be aware that Funnelytics' endpoint will accept only timestamps in the ISO 8601 format (Wikipedia): 2021-03-29T09:58Z (UTC example)

If your payment process/cart solution does not send out time data formatted this way you can always format it yourself, by adding this bit of code instead of the single time element,

"{{parseDate(Webhook Time Element; "YYYY-MM-DDTHH:mm:ss"; "Timezone")}}"

The Webhook Time Element is the one containing the order creation timestamp.

The Timezone (if needed) has to be chosen in this list only otherwise it won't be recognized by Integromat: TZ Database Name.

Here below you can see a real-case example:

"{{parseDate(1.time; "YYYY-MM-DDTHH:mm:ss"; "America/Sao_Paulo")}}"

 

Congratulations! You have completed setting up your Webhook scenario!

Next Steps

Now that everything is set up, let's clear our cookies (or use another browser) and run again through our funnel in test mode, complete a test purchase and make sure that it's working as expected.

 

If you have any questions or need further clarification with setting up actions, remember to reach out to our support team anytime by clicking the support icon in the bottom-right corner of your dashboard, or emailing us at support@funnelytics.io we are always ready to assist you!