Elementor is the most used page builder in WordPress today. In all, it adds up to more than 10 million active installations, which is a very expressive number. One of the difficulties in Elementor currently is to associate the onclick event in Elementor.
What is the onclick event?
The onclick event is used so that, when the user or visitor clicks on a certain link or button, a Javascript function is triggered.
Many services such as Google and Facebook use and recommend to improve the measurement of metrics in services such as Ads.
How to use the onclick event in Elementor in a Button (for Facebook Pixel, Google Ads or Google Tag Manager)
- Go to Button > Advanced > set “CSS ID”
When you click on the button you want to add the onclick event, click on it and go to the “Advanced” tab and fill in the “CSS ID” field for a unique value. Example: “My_Button”
- Add an HTML widget
If possible right after the Button widget
document.addEventListener("DOMContentLoaded", function(event) {
jQuery('#My_Button a').click(function(){
// tracking code here
// for example, Facebook Pixel:
fbq('track','AddToCart');
});
});- Paste the code below into the HTML widget
If you encounter any errors in Elementor, check out our Elementor Errors Guide.
Source: https://elementor.com/help/button-widget/
Conversion Events in Elementor with Plugin
One way to generate conversions in Elementor through a plugin is to use Events Tracker for Elementor. This plugin is free. Its basic version offers the possibility to add conversions and frequently used elements such as Buttons, CTAs and Forms.
