If you do not feel comfortable adding javascript, a line at a time, to a web page, read no farther.
But if you enjoy adding javascript, a line at a time, to a web page, you will be happy to know there are two ways to do that with Matomo. The manual JS way (like a paleolithic sort of HTML developer) is to go directly into your header/footer and run a single line. This is pedagogically useful. As Wes Bos would say, "Gotta learn Vanilla JS before you learn shortcuts". If you are timid about how Javascript works in a web page, try this right now. Go to a random web page (any web page), and open devtools >> console. In the console of your browser, you can manually add any variable, on the fly. All of the following should work. Note, this is just for fun; try the following. var _paq = { name: "Evan" }; // Make an object, with one parameter, a string _paq; // Look at what is in the object called _paq _paq.aaa=42; // Add a property to our object, aaa _paq.bbbb=[1,2,3,4,5]; // Add a property to our object, bbbb _paq.bbbb.push(42); // Arrays have a built in method, push. We push an integer onto the object _paq.bbbb; // We inspect the property bbbb on the object _paq Again, this is all just pedagogical for the moment. Now go to a page which has Matomo running. May I suggest https://littlefurnace.com? Open devtools >> console. In the console of your browser, try the following. _paq; // Wow, the _paq object is already defined. It holds many Matomo things. _paq.push(['trackContentImpression', 'News Topic', 'events', 'Current page URL', {dimension5: 'event'}]); That second line is how Matomo allows us to DO things. The _paq object is listening for pushes; it is waiting for you to push the name of a method it knows. In this case we pushed trackContentImpression. This was sort of new to me the first time I saw it: the way to make Matomo do something is to give it the name of a method it knows. And at the same time, you should pass in any required parameters. You can find a list of Matomo methods here: https://developer.matomo.org/api-reference/tracking-javascript Once you understand the above, you may be like a kid in a candy store. Enjoy! But there's a problem now with maintainability. These Javascript things you are writing are sort of a mess for your team to read and monitor, going forward in time (visualize a time in the future, when you have left your team: how will they read your code?). Tag Manager So to avoid being a paleolithic programmer, take advantage of a tag manager. Tealium and Google Tag Manager are nice. Matomo Tag Manager is almost as nice and it maintains the continuity of your toolchain as staying private, free, et cetera. In MTM, you can do all of the methods we showed above. To implement JS in tag manager you need to go to (Optional) Matomo Tag Manager >> Trigger >> New trigger. Then make a trigger. Matomo Tag Manager >> Tag >> New Tag. Then make "custom HTML" for your tag. I am out of time in writing this guide but your next steps can be derived from how we made a tag here.
0 Comments
Leave a Reply. |
AuthorEvan Genest Archives
December 2023
Categories |