Task: track copying email and phone to the clipboard as an event in Google Tag Manager. Tracking was implemented using javascript in 7 simple steps.
The method can be used to track the copy of any blocks of text: model name, promotional code, store address, etc.
1. Marking of tracking text
Add to the script I found on the forum
softtime :
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#tel").bind('copy', function(e){ dataLayer.push({ 'event': 'tel copy'}); }); $("#mail").bind('copy', function(e){ dataLayer.push({ 'event': 'email copy'}); }); }); </script>
Where "#tel" is the id that we will use to mark the text, you can change them
')
This is how the Data Layer transfer looks, its parameters can also be changed (
for more information about Data Layer in GTM help ):
dataLayer.push({ 'event': 'email copy'});
2. Mark the text for tracking using the span tag:
After adding the script, you need to mark the text that we will track. The id indicates our id (tel and mail) from the previous paragraph:
<span id="tel">8 800 000 00-00</span> <span id="mail">example@gmail.com</span>
3. Create a rule
After editing the site, go to the GTM interface, and create a rule in the container drafts, where event equates to tel copy (or the value that you specified in the dataLayer for the event):
Create a similar rule for mail, where event equates to email copy
4. Create an Activation Tag
Then we create the tag “Event”, set the Category, Action and Shortcut and enable the activation of the tag by the rule:
Similarly, create a tag for the mail.
5. Create a version and check the performance in the "View-Run debug mode"
We check the tag's performance - it should be activated when you copy the necessary text:
Activate debug mode to check if everything works:
Go to the site and look at the bottom panel. Before copying the phone, it looks like this:
After copying the text, the "Copy phone" tag is active:
6. Publish the change container
Do not forget to publish changes, because Before that, all the work on setting tags did not affect the GTM container on the site.
7. New events will appear in Google Analytics reports.
By setting the event parameters (category, action and shortcut), you can track the events in the reports, as well as adjust the corresponding goals, if required.
If you know more simple solutions to this problem, please write in the comments.