{"id":16054,"date":"2020-05-20T10:02:41","date_gmt":"2020-05-20T08:02:41","guid":{"rendered":"https:\/\/www.dase-analytics.com\/blog\/?p=16054\/"},"modified":"2020-12-30T12:24:14","modified_gmt":"2020-12-30T10:24:14","slug":"testing-new-tracking-these-5-chrome-extensions-will-definitely-help-you","status":"publish","type":"post","link":"https:\/\/www.dase-analytics.com\/blog\/en\/testing-new-tracking-these-5-chrome-extensions-will-definitely-help-you\/","title":{"rendered":"Testing new tracking? These 5 Chrome extensions will definitely help you!"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Are you using <\/span><b>Google Analytics<\/b><span style=\"font-weight: 400;\"> and <\/span><b>Google Tag Manager<\/b><span style=\"font-weight: 400;\">? If so, I hope the following tips for <\/span><b>Google Chrome Extensions help you<\/b><span style=\"font-weight: 400;\"> to learn something new. You can install them for free and save a lot of time hassle during debugging (when looking for implementation errors). \ud83d\ude42<\/span><\/p>\n<p><span style=\"font-weight: 400;\">We will look closer to this extensions:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">dataslayer<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Google Tag Assistant<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Tag Manager Injector<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Selector Gadged\u00a0<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Facebook Pixel Helper<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">At first, we will briefly show you how to <\/span><b>install<\/b><span style=\"font-weight: 400;\"> them.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can find all available extensions on this link:<\/span><\/p>\n<p><a href=\"https:\/\/chrome.google.com\/webstore\/category\/extensions\"><span style=\"font-weight: 400;\">https:\/\/chrome.google.com\/webstore\/category\/extensions<\/span><\/a><\/p>\n<p><span style=\"font-weight: 400;\">The easiest way is to find extensions by name. An example of a dataslayer:<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-16055 size-full\" title=\"chrome extensions\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image6-14.png\" alt=\"chrome extensions\" width=\"1211\" height=\"797\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image6-14.png 1211w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image6-14-300x197.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image6-14-1024x674.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image6-14-600x395.png 600w\" sizes=\"(max-width: 1211px) 100vw, 1211px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">The next step is to add the extension to Chrome.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you want to edit any settings in your extensions, here&#8217;s how to access them:<\/span><\/p>\n<ol>\n<li><span style=\"font-weight: 400;\">Click the three dots in the upper right corner, then select More tools:<img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-16057 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28.png\" alt=\"chrome extensions 2\" width=\"1823\" height=\"899\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28.png 1823w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28-300x148.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28-1024x505.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28-1536x757.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image2-28-600x296.png 600w\" sizes=\"(max-width: 1823px) 100vw, 1823px\" \/><\/span><\/li>\n<li>Choose extensions:<img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-16056 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21.png\" alt=\"chrome extensions 3\" width=\"1595\" height=\"904\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21.png 1595w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21-300x170.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21-1024x580.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21-1536x871.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image4-21-600x340.png 600w\" sizes=\"(max-width: 1595px) 100vw, 1595px\" \/><\/li>\n<\/ol>\n<p>An extension report might look like this:<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-16058 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image11-5.png\" alt=\"extension report\" width=\"1295\" height=\"722\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image11-5.png 1295w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image11-5-300x167.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image11-5-1024x571.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image11-5-600x335.png 600w\" sizes=\"(max-width: 1295px) 100vw, 1295px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Some extensions are already pre-installed in Chrome.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Tip: Sometimes we need to have a <\/span><b>\u201cclean\u201d browser<\/b><span style=\"font-weight: 400;\"> (without any cookies or cash) when testing. Therefore, it is <\/span><b>best to use Incognito mode<\/b><span style=\"font-weight: 400;\">. Or erase all browsing data, which I hate to do because it is extra work (it logs me off the site, clears the history, pre-filled forms, etc.).<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Fortunately, Google Chrome lets you use extensions in the Ingoknito window as well. Activation is required for each extension directly in the extension settings:<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone wp-image-16059 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image1-28.png\" alt=\"dataslayer\" width=\"707\" height=\"928\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image1-28.png 707w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image1-28-229x300.png 229w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image1-28-600x788.png 600w\" sizes=\"(max-width: 707px) 100vw, 707px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Once we&#8217;re done adding extensions, we can look at every extension separately.<\/span><\/p>\n<h2><b>Dataslayer<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">I use this tool most often in my work. Dataslayer <\/span><b>allows you to clearly display, as its name suggests, dataLayer.<\/b><span style=\"font-weight: 400;\"> And not only that. Since we mainly use dataLayer to implement custom measurements (we send data to Google Analytics through Google Tag Manager), the dataslayer can also see how this data is sent to Analytics and whether it is correct. For example, we know from the programmer that he has implemented dataLayer variables for the \u201cAdd Product to Cart\u201d event for e-commerce tracking. Of course, we need to test if all variables are set up correctly and if the correct data is being sent.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">And how does dataslayer display data? On the PrintScreen below you can see an example of adding a product into the cart:<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"wp-image-16060 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image7-11.png\" alt=\"dataslayer data display \" width=\"1294\" height=\"860\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image7-11.png 1294w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image7-11-300x199.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image7-11-1024x681.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image7-11-600x399.png 600w\" sizes=\"(max-width: 1294px) 100vw, 1294px\" \/><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16061\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image13-5.png\" alt=\"dataslayer data\" width=\"1138\" height=\"860\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image13-5.png 1138w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image13-5-300x227.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image13-5-1024x774.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image13-5-600x453.png 600w\" sizes=\"(max-width: 1138px) 100vw, 1138px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">The left side shows what the dataLayer looks like on the page, the right side shows what data is being sent to Google Analytics.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><b>Google Tag Assistant<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">I like Google Tag Assistant because it\u2019s easy to use. If I need to see very quickly whether Google Tags are inserted correctly and what their IDs are, I will use this tool. <\/span><b>Google Tag Assistant show these tags &#8211; Google Ads Remarketing, Google Tag Manager, Google Optimize, and Google Analytics.<\/b><\/p>\n<p><span style=\"font-weight: 400;\">In addition to this simple overview, Google Tag Assistant has another very useful feature &#8211; <\/span><b>Recording<\/b><span style=\"font-weight: 400;\">. This feature allows you to <\/span><b>upload the entire interaction with the page and see how data is processed through GTM, Google Ads, and especially how it is sent to Google Analytics.<\/b><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16062\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image3-26.png\" alt=\"Google Tag Assistant\" width=\"447\" height=\"624\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image3-26.png 447w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image3-26-215x300.png 215w\" sizes=\"(max-width: 447px) 100vw, 447px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Google Tag Assistant will also show you if you have the tag installed correctly. Just click on the tag directly:<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"wp-image-16063 size-full\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image14-5.png\" alt=\"Google Tag Assistant data\" width=\"434\" height=\"586\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image14-5.png 434w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image14-5-222x300.png 222w\" sizes=\"(max-width: 434px) 100vw, 434px\" \/><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16064\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image9-8.png\" alt=\"Google Tag Assistant screenshot 2\" width=\"434\" height=\"595\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image9-8.png 434w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image9-8-219x300.png 219w\" sizes=\"(max-width: 434px) 100vw, 434px\" \/><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Tip: Sometimes when you install a new GTM, you may find that the tag is poorly implemented (red). This occurs when the container has not yet been published. Therefore, it is enough to simply publish it (even empty).<\/span><\/p><\/blockquote>\n<p>&nbsp;<\/p>\n<h2><b>Tag Manager Injector<\/b><\/h2>\n<p><i><span style=\"font-weight: 400;\">Note: This extension is not for free anymore for the new users.<\/span><\/i><\/p>\n<p><b>Tag Manager Injector could help when the test container is ready, but GTM is not yet implemented on the page<\/b><span style=\"font-weight: 400;\">. It&#8217;s easy to use &#8211; just enter the GTM ID and run the extension to start testing. With this tool, you can use a Preview Mode where you can test which tags are firing and which aren&#8217;t.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Another way you can take advantage of this extension is to learn. Just set up your own container, create tags, and put the GTM ID on any page where you would like to learn how to measure certain points.. For example, Google Help. \ud83d\ude42<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16065\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16.png\" alt=\"Tag Manager Injector\" width=\"1868\" height=\"889\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16.png 1868w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16-300x143.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16-1024x487.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16-1536x731.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image5-16-600x286.png 600w\" sizes=\"(max-width: 1868px) 100vw, 1868px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Tip: If you also need to test dataLayer, Tag Manager Injector lets you add your own dataLayer on the page.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><b>Selector Gadged<\/b><span style=\"font-weight: 400;\">\u00a0<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">This extension <\/span><b>is actually a CSS selector<\/b><span style=\"font-weight: 400;\"> &#8211; we can accurately <\/span><b>determine the CSS element<\/b><span style=\"font-weight: 400;\">. Most often we need a CSS selector when creating Triggers in Google Tag Manager. For example, we need to create a specific click trigger in the search box. Just click on the desired window, which must turn green.<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16066\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5.png\" alt=\"Selector Gadged\u00a0\" width=\"1887\" height=\"907\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5.png 1887w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5-300x144.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5-1024x492.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5-1536x738.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image15-5-600x288.png 600w\" sizes=\"(max-width: 1887px) 100vw, 1887px\" \/><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16067\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image10-7.png\" alt=\"trigger configuration\" width=\"914\" height=\"356\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image10-7.png 914w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image10-7-300x117.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image10-7-600x234.png 600w\" sizes=\"(max-width: 914px) 100vw, 914px\" \/><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Tip: If yellow markings also appear on the page, use right-click to remove them. Yellow fields indicate additional elements that belong to a given CSS selector.<\/span><\/p><\/blockquote>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-16081\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018.png\" alt=\"selector gadged\" width=\"1840\" height=\"898\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018.png 1840w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018-300x146.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018-1024x500.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018-1536x750.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1018-600x293.png 600w\" sizes=\"(max-width: 1840px) 100vw, 1840px\" \/><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-16083\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021.png\" alt=\"selector gadget\" width=\"1888\" height=\"898\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021.png 1888w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021-300x143.png 300w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021-1024x487.png 1024w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021-1536x731.png 1536w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/2020-05-20_1021-600x285.png 600w\" sizes=\"(max-width: 1888px) 100vw, 1888px\" \/><\/p>\n<h2><b>Facebook Pixel Helper<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">Finally, I would like to mention one more tool that helps us to <\/span><b>test the implementation of Facebook Pixel<\/b><span style=\"font-weight: 400;\">. In the past, this tool has made it a lot easier for me to see if each event is working properly for dynamic remarketing. <\/span><b>Facebook Pixel Helper displays very clearly what pixels you are using and displays ID, value, and menu for events<\/b><span style=\"font-weight: 400;\">. If something is wrong, this tool will tell you. An example is if the product ID does not match the feed ID. Alternatively, the price could be in the wrong format.<\/span><\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-full wp-image-16071\" src=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image12-6.png\" alt=\"Facebook Pixel Helper\" width=\"386\" height=\"567\" srcset=\"https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image12-6.png 386w, https:\/\/www.dase-analytics.com\/blog\/wp-content\/uploads\/image12-6-204x300.png 204w\" sizes=\"(max-width: 386px) 100vw, 386px\" \/><\/p>\n<h2><span style=\"font-weight: 400;\">Conclusion<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">The tools I mentioned in this article are not the only ones we use at DASE. Analytics is also available for password managers (read more at <a href=\"https:\/\/www.passwordmanager.com\/1password-vs-lastpass\/\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/www.passwordmanager.com\/1password-vs-lastpass\/)<\/a>. <\/span><span style=\"font-weight: 400;\">Therefore, in the next articles, I want to focus on other extensions that may help you, as well as more detailed instructions for each feature of the most commonly used tools. Stay tuned. \ud83d\ude42\u00a0<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Are you using Google Analytics and Google Tag Manager? If so, I hope the following tips for Google&#8230;<\/p>\n","protected":false},"author":68,"featured_media":16074,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[769,772],"tags":[],"_links":{"self":[{"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/posts\/16054"}],"collection":[{"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/users\/68"}],"replies":[{"embeddable":true,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/comments?post=16054"}],"version-history":[{"count":8,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/posts\/16054\/revisions"}],"predecessor-version":[{"id":16977,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/posts\/16054\/revisions\/16977"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/media\/16074"}],"wp:attachment":[{"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/media?parent=16054"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/categories?post=16054"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.dase-analytics.com\/blog\/en\/wp-json\/wp\/v2\/tags?post=16054"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}