|
Universal Group
|
May 31, 2019 at 6:34 am
We would like to add conversion tracking code to our register now buttons specific to a course page only. https://www.theuniversalgroup.ca/training/trade-safety-coordinator-tsc/ and we want to ensure that the code is applicable to current and future courses as they become available on the page. Is there a suggested “best practice” for doing this in EE?
1. Install the event snippet on the page that has the button or link you’d like to track.
Open the HTML for the page.
Copy the snippet below and paste it between the head tags (<head></head>) of the page, right after the global site tag.
<!– Event snippet for TSC Register Now conversion page In your html page, add the snippet and call gtag_report_conversion when someone clicks on the chosen link or button. –> <script> function gtag_report_conversion(url) { var callback = function () { if (typeof(url) != ‘undefined’) { window.location = url; } }; gtag(‘event’, ‘conversion’, { ‘send_to’: ‘AW-861425611/E6etCMqOr6EBEMuf4ZoD’, ‘event_callback’: callback }); return false; } </script>
2. Add an onclick attribute directly to the code for the button or link you’d like to track. The code you use will depend on how the link or button is displayed on your site: as a text link, button, or button image.
Add the code to a text link: In the code below, replace “http://example.com/your-link” with the URL for your website or telephone link, and replace “Download now!” with your link text.
<a href="http://example.com/your-link">Download now!</a>
Add the code to a button: This code shows you how to add click tracking functionality to a button using the <button> tag. Replace “http://example.com/your-link” with the URL for your website.
<button onclick=”return gtag_report_conversion(‘http://example.com/your-link’)”>Submit</button>
Add the code to a button image: In the code below, replace “download_button.gif” with your button image, replace the width and height with your image’s parameters, and replace “http://example.com/your-link” with the URL for your link.
|
|
Josh
|
May 31, 2019 at 8:53 am
Hi,
For item #1, we recommend using the wp_head action hook to add code between the head tags (<head></head>) of the page. So for example to add the code to the page you linked to, you’d add this code to a site-specific plugin:
add_action('wp_head', 'my_custom_add_gtag');
function my_custom_add_gtag() {
if(is_single(1734)){
echo "<script>
function gtag_report_conversion(url) {
var callback = function () {
if (typeof(url) != 'undefined') {
window.location = url;
}
};
gtag(
'event',
'conversion', {
'send_to': 'AW-861425611/E6etCMqOr6EBEMuf4ZoD',
'event_callback': callback
});
return false;
}
</script>";
}
}
For item #2, I’m afraid the “Register Now” button isn’t technically a button, it’s actually an input to submit a form. Do they have any code examples for tracking a form submit?
|
|
Universal Group
|
May 31, 2019 at 9:14 am
Hi Josh, These are the options:
Add the code to a text link: In the code below, replace “http://example.com/your-link” with the URL for your website or telephone link, and replace “Download now!” with your link text.
Download now!
Add the code to a button: This code shows you how to add click tracking functionality to a button using the <button> tag. Replace “http://example.com/your-link” with the URL for your website.
<button onclick=”return gtag_report_conversion(‘http://example.com/your-link’)”>Submit</button>
Add the code to a button image: In the code below, replace “download_button.gif” with your button image, replace the width and height with your image’s parameters, and replace “http://example.com/your-link” with the URL for your link.
|
|
Josh
|
May 31, 2019 at 9:34 am
The page does not have an html link or an html button there to add code to though. So neither of those are viable options in this case.
|
|
Universal Group
|
June 3, 2019 at 9:47 am
This reply has been marked as private.
|
|
Josh
|
June 3, 2019 at 1:22 pm
On a different note, we would like to change the default attendee from 0 to 1 and put an asterisk beside Number of Attendees
You could add this code to the site:
add_action('wp_enqueue_scripts', 'my_add_inline_script_eets', 20);
function my_add_inline_script_eets() {
$custom_js = '
jQuery(document).ready(function($){
var qty = $(".ticket-selector-tbl-qty-slct");
if( qty.val() == 0 ) {
qty.val("1");
}
});';
wp_add_inline_script('ticket_selector', $custom_js);
}
You can add the above to a functions plugin or, if available, into your WordPress child theme’s functions.php file.
With regards to adding the asterisk, the text there appears to be coming from a custom template, so someone could add to that custom template so an asterisk appears before the text.
|
|
Universal Group
|
June 4, 2019 at 6:15 am
This reply has been marked as private.
|
|
Josh
|
June 4, 2019 at 6:36 am
Anywhere after the opening <?php tag, and not inside any existing functions or classes. If you’re really not sure where to put the code, then using a site specific plugin is recommended.
|
|
Universal Group
|
June 5, 2019 at 8:24 am
This reply has been marked as private.
|
|
Josh
|
June 5, 2019 at 8:38 am
Thanks again Josh. We applied the code and it worked but then admin started receiving 7 notifications per registration so we had to remove it. Any thoughts?
My thought is: There’s no way that code could cause extra email notifications.
Do they get extra email notifications when the code is removed?
|
|
Universal Group
|
June 5, 2019 at 8:51 am
Extra notifications stopped when the code was removed. So strange.
|
|
Josh
|
June 5, 2019 at 10:39 am
It may the way you added the code that’s causing the problem. For example if there’s a space before the opening PHP tag, that could lead to “headers already sent” PHP warnings, which could mess up the request.
May I ask was the code added to a functions.php file or into a new plugin that gets activated?
|
|
Universal Group
|
June 5, 2019 at 10:43 am
Only added to functions.php. The code worked with regard to changing the default from 0 to 1 but then admin emailed me soon after to let me know that multiple notifications came through for single registrations.
|
|
Josh
|
June 5, 2019 at 11:12 am
Instead of adding to functions.php, you could add the code to a functions plugin. One problem with adding code for a plugin into a theme’s functions.php is the theme’s functions.php file is really only intended for theme functions. Any issues with custom code can be more easily isolated if they’re in their own little plugin.
Also, when you add the code, are you using a code editor + FTP or some other means like the code editor built into the WordPress admin dashboard?
|
|
Universal Group
|
June 5, 2019 at 11:17 am
This reply has been marked as private.
|
|
Josh
|
June 5, 2019 at 11:23 am
Any recommended functions plugin that others have used with EE?
We recommend making a plugin from scratch. Here’s a link to the guide that shows how:
https://eventespresso.com/wiki/create-site-specific-plugin-wordpress-site/
|
