WordPress Fluent form Tracking with GTM & GA4

You’ll require some tracking code if you need to track a Fluent form with Google Tag Manager and Google Analytics. If you’d like to track enhanced conversions, where you also need form data such as email addresses phone numbers, etc

In the following tutorial, I’ll share in detail about Fluent tracking with new and updated tracking codes. The great thing is that the tracking code that I have written will give your form submit event and form data like email, phone number, etc

<script>
/**
* Author: Md Hasanuzzamna
* Linkedin: https://linkedin.com/md-h
* Email: info@leomeasure.com
* Website: https://leomeasure.com
* Youtube: https://youtube.com/@leomeasure
*/
(function($) {
	var $form = $('form.frm-fluent-form');
	$form.on('fluentform_submission_success', function() {
		var formId = this.getAttribute('data-form_id');
	   	var formData = new FormData(this);
		var inputValues = {};

		formData.forEach(function (value, key) {
			var key = key.replace(/]$/g, '').replace(/[\[\]]/g, '_');
		    inputValues[key] = value;
		});

		window.dataLayer = window.dataLayer || [];
		dataLayer.push({
			event: 'fluent_form_submit',
			form_id: formId,
			inputs: inputValues
		});
	});
})(jQuery);
</script>

• GitHub