Merge pull request #372 from openforge/google-analytics-events

Google analytics events

Author: Fdom92

src/components/app-blog-card/app-blog-card.tsx

@@ -27,7 +27,7 @@ export class AppBlogCard {
               </div>
               <div class="blog-title">
                 <stencil-route-link url={`/blog/${this.blogPost.slug}`}>
-                  <h2>{this.blogPost.title}</h2>
+                  <h2 id="blog-title">{this.blogPost.title}</h2>
                 </stencil-route-link>
               </div>
               <div class="author">

src/components/app-blog-featured/app-blog-featured.tsx

@@ -35,7 +35,7 @@ export class AppBlogFeatured {
               </div>
               <div class="featured-post-title">
                 <stencil-route-link url={`/blog/${this.blogPost.slug}`}>
-                  <h2>{this.blogPost.title}</h2>
+                  <h2 id="featured-blog-title">{this.blogPost.title}</h2>
                 </stencil-route-link>
               </div>
               <div class="author">

src/components/app-footer/app-footer.tsx

@@ -41,22 +41,22 @@ export class AppFooter {
               <h2>{translate('footer.social.followUs')}</h2>
               <ul class="footer--social-links">
                 <li>
-                  <a href="https://twitter.com/OpenForge_US" target="_blank" rel="noopener">
+                  <a href="https://twitter.com/OpenForge_US" id="twitter" target="_blank" rel="noopener">
                     <i class="fab fa-twitter-square" aria-hidden="true" /> {translate('footer.social.twitter')}
                   </a>
                 </li>
                 <li>
-                  <a href="https://www.facebook.com/OpenForgeUS/" target="_blank" rel="noopener">
+                  <a href="https://www.facebook.com/OpenForgeUS/" id="facebook" target="_blank" rel="noopener">
                     <i class="fab fa-facebook-square" aria-hidden="true" /> {translate('footer.social.facebook')}
                   </a>
                 </li>
                 <li>
-                  <a href="https://www.linkedin.com/company/openforge/" target="_blank" rel="noopener">
+                  <a href="https://www.linkedin.com/company/openforge/" id="linkedin" target="_blank" rel="noopener">
                     <i class="fab fa-linkedin" aria-hidden="true" /> {translate('footer.social.linkedin')}
                   </a>
                 </li>
                 <li>
-                  <a href="https://www.instagram.com/openforgeteam/" target="_blank" rel="noopener">
+                  <a href="https://www.instagram.com/openforgeteam/" id="instagram" target="_blank" rel="noopener">
                     <i class="fab fa-instagram" aria-hidden="true" /> {translate('footer.social.instagram')}
                   </a>
                 </li>
@@ -68,7 +68,7 @@ export class AppFooter {
             <div class="footer--column col-12 col-sm-4">
               <h2>{translate('footer.webinar.signup')}</h2>
               <p>{translate('footer.webinar.webinarText')}</p>
-              <a href="http://startupjunto.org/" target="_blank" rel="noopener" class="footer--btn btn btn-primary">
+              <a href="http://startupjunto.org/" target="_blank" id="startup-junto meetup" rel="noopener" class="footer--btn btn btn-primary">
                 {translate('footer.webinar.register')}
               </a>
             </div>

src/components/app-nav-header/app-nav-header.tsx

@@ -106,7 +106,7 @@ export class AppNavHeader {
                 </stencil-route-link>
               </li>
               <li class="nav-item" data-target="#navbarSupportedContent">
-                <a class="nav-link" href="https://github.com/openforge" title={translate('nav.links.github')} target="_blank" rel="noopener">
+                <a class="nav-link" id="github" href="https://github.com/openforge" title={translate('nav.links.github')} target="_blank" rel="noopener">
                   <div class="fab fa-github" />
                 </a>
               </li>

src/index.html

@@ -22,7 +22,6 @@
 
   <!-- Preload to increase Time to Interactive -->
 
-
   <link rel="apple-touch-icon" href="/assets/icon/icon.png">
   <link rel="icon" type="image/x-icon" href="/assets/icon/favicon.ico">
   <link rel="manifest" href="/manifest.json">
@@ -35,30 +34,13 @@
   <!-- In case JavaScript is not available -->
   <noscript>Your browser does not support JavaScript!</noscript>
 
-  <!-- Structured Data -->
-  <!-- <script type="application/ld+json">
-    {
-      "@context": "http://schema.org",
-      "@type": "Organization",
-      "url": "http://www.openforge.io/",
-      "name": "OpenForge",
-      "address": "1040 N 2nd St, Suite #301, Philadelphia, PA 19123"
-    };
-  </script> -->
-
-  <!-- Global Site Tag (gtag.js) - Google Analytics -->
-  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-118169306-1"></script>
-  <script>
-    window.dataLayer = window.dataLayer || [];
-
-    function gtag() {
-      dataLayer.push(arguments);
-    }
-    gtag('js', new Date());
-
-    gtag('config', 'UA-118169306-1');
-
-  </script>
+  <!-- Google Tag Manager -->
+  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+  'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+  })(window,document,'script','dataLayer','GTM-KFPQ95V');</script>
+  <!-- End Google Tag Manager -->
 
   <script>
     console.log("Verifying user is on latest browser");
@@ -114,6 +96,11 @@
 </head>
 
 <body>
+  <!-- Google Tag Manager (noscript) -->
+  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KFPQ95V"
+  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+  <!-- End Google Tag Manager (noscript) -->
+
   <app-nav-header />
 
   <open-forge-app></open-forge-app>

src/pages/app-about/app-about.tsx

@@ -2,7 +2,6 @@ import { Component, Prop } from '@stencil/core';
 import { translate } from '../../services/translation.service';
 
 declare var fbq;
-declare var gtag;
 
 @Component({
   tag: 'app-about',
@@ -198,10 +197,6 @@ export class AppAbout {
   ];
 
   componentDidLoad() {
-    gtag('config', 'UA-118169306-1', {
-      page_title: document.title,
-      page_path: window.location.pathname,
-    });
     // isServer is false when running in the browser
     // and true when being prerendered
     if (!this.isServer) {

src/pages/app-blog-index/app-blog-index.tsx

@@ -1,6 +1,5 @@
 import { Component, Prop, State } from '@stencil/core';
 import { BLOG_DATA } from '../app-blog-post/prerender-blog-data';
-declare var gtag;
 
 @Component({
   tag: 'app-blog-index',
@@ -12,11 +11,6 @@ export class AppBlogIndex {
   @Prop({ context: 'isServer' }) private isServer;
 
   componentWillLoad() {
-    gtag('config', 'UA-118169306-1', {
-      page_title: document.title,
-      page_path: window.location.pathname,
-    });
-
     if (this.isServer) {
       this.blogData = BLOG_DATA.data;
     } else {

src/pages/app-blog-post/app-blog-post.tsx

@@ -2,7 +2,6 @@ import { Component, Prop, State, Watch } from '@stencil/core';
 import { RouterHistory, MatchResults } from '@stencil/router';
 import { BlogPost } from '../../model/blog-post.model';
 import { BLOG_DATA } from './prerender-blog-data';
-declare var gtag;
 
 @Component({
   tag: 'app-blog-post',
@@ -35,11 +34,6 @@ export class AppBlogPost {
   }
 
   componentWillLoad() {
-    gtag('config', 'UA-118169306-1', {
-      page_title: document.title,
-      page_path: window.location.pathname,
-    });
-
     this.getPostContent();
 
     // get a bunch of blog posts and pick 3 to display in read next

src/pages/app-blog/app-blog.tsx

@@ -4,7 +4,6 @@ import { BlogMeta } from '../../model/blog-meta.model';
 import { BlogCategory } from '../../model/blog-category.model';
 
 declare var fbq;
-declare var gtag;
 
 @Component({
   tag: 'app-blog',
@@ -68,10 +67,6 @@ export class AppBlog {
   }
 
   componentDidLoad() {
-    gtag('config', 'UA-118169306-1', {
-      page_title: document.title,
-      page_path: window.location.pathname,
-    });
     // isServer is false when running in the browser
     // and true when being prerendered
     if (!this.isServer) {

src/pages/app-case-study/app-case-study.tsx

@@ -1,5 +1,4 @@
 import { Component } from '@stencil/core';
-declare var gtag;
 
 @Component({
   tag: 'app-case-study',
@@ -14,11 +13,6 @@ export class AppCaseStudy {
   }
 
   componentDidLoad() {
-    gtag('config', 'UA-118169306-1', {
-      page_title: document.title,
-      page_path: window.location.pathname,
-    });
-
     document.querySelector("meta[property='og:title']").setAttribute('content', 'JuntoScope - Scoping Software | OpenForge');
     document
       .querySelector("meta[property='og:description']")