FormAnalytics with Tripetto

We are running a Wordpress installation with a Form Tool called Tripetto. We would like to track the user’s behaviour within the form and purchased FormAnalytics.

While other forms on our page (WP Forms) have been detected automatically Tripetto does not get recognized… The Forms run in an iFrame, Tripetto does not use “FormID” or similar…

Even looking after the Form name, any ID I see Tripetto assigning to the form etc. does not bring any results in Matomo.

Any suggestions what else we can to to track the form?

If you use an iframe, then the tracking code for the form should also be called in the iframe.

Just to clarify: Tripetto loads ints form in an iframe, I can’t change that. Inspecting the form does not reveal any ID or name that Matomo seems to be able to track…

I tried adding all kind of IDs, Name of the Form etc. but nothing seems to get Matomo FormAnamytics to recognize the form.

In any case, Matomo won’t track anything that could happen in a frame. Then you have to find a solution to add Matomo tracking code to the iframe…

1 Like

ok, thank you for the quick response.

The Tracking code you are referring to is this, right:
https://developer.matomo.org/guides/form-analytics/setup

Yes, this is the code you have to include. But it is better explained there (this is the Matomo bootstrap code):
https://developer.matomo.org/guides/tracking-javascript-guide

Hi @Markus_Leiter ,

As Philippe said tracking code needs to added with in the IFrame, I have replied to your request sent to support team with more information.

Hi @Markus_Leiter - did you manage to resolve this issue in Tripetto? My organisation is struggling with the very same problem with Tripetto/Matomo. Cheers

Hi @mlinnell,
we found a workaround using the Matomo Tag Manager.
Adding custom tracking code to Tripetto enabled us to track every event.

please find attached the tracking code we used… no guarantee that it works.
you have to add your Matomo URL and your Site ID…

function() {
// Init Matomo (only if this code is not yet present on the page that the form is embedded at)
var _paq = window._paq = window._paq || [];
_paq.push([‘trackPageView’]);
_paq.push([‘enableLinkTracking’]);
(function() {
var u="//{$MATOMO_URL}/";
_paq.push([‘setTrackerUrl’, u+‘matomo.php’]);
_paq.push([‘setSiteId’, {$IDSITE}]);
var d=document, g=d.createElement(‘script’), s=d.getElementsByTagName(‘script’)[0];
g.type=‘text/javascript’; g.async=true; g.src=u+‘matomo.js’; s.parentNode.insertBefore(g,s);
})();

// Send events to Matomo (only include the event rules below that you want to track)
return function(event, form, block) {
	switch (event) {
		case 'start': _paq.push(['trackEvent', 'Tripetto Form', 'Form is started.', form.name ]); break;
		case 'stage': _paq.push(['trackEvent', 'Tripetto Form', 'Form block becomes available.', block.name ]); break;
		case 'unstage': _paq.push(['trackEvent', 'Tripetto Form', 'Form block becomes unavailable.', block.name ]); break;
		case 'focus': _paq.push(['trackEvent', 'Tripetto Form', 'Form input element gained focus.', block.name ]); break;
		case 'blur': _paq.push(['trackEvent', 'Tripetto Form', 'Form input element lost focus.', block.name ]); break;
		case 'pause': _paq.push(['trackEvent', 'Tripetto Form', 'Form is paused.', form.name ]); break;
		case 'complete': _paq.push(['trackEvent', 'Tripetto Form', 'Form is completed.', form.name ]); break;
	}
}

}

Thank you, @Markus_Leiter! Really appreciate it. We will get started with implementing the tag manager approach instead. But if you or others on this forum come across a solution for the form module itself, then do share. Cheers.