[bug 1248040] Update GTM data attributes on contribute pages navigati…

…on and buttons
mozilla · Mar 23, 2016 · a6f6fbd · a6f6fbd
1 parent 9268c7f
commit a6f6fbd
Show file tree

Hide file tree

Showing 8 changed files with 46 additions and 141 deletions.
diff --git a/bedrock/mozorg/templates/mozorg/contribute/contribute-base.html b/bedrock/mozorg/templates/mozorg/contribute/contribute-base.html
@@ -35,20 +35,20 @@
         <nav class="contribute-nav">
           <span class="toggle" role="button" aria-controls="contribute-nav-menu" tabindex="0">{{ _('Menu') }}</span>
           <ul id="contribute-nav-menu">
-            <li class="nav-landing"><a href="{{ url('mozorg.contribute') }}" data-label="Why volunteer">
+            <li class="nav-landing"><a href="{{ url('mozorg.contribute') }}" data-link-type="nav" data-link-name="Why volunteer">
               {# L10n: this br is for formatting, omit or reposition as needed #}
               {{ _('Why<br> volunteer') }}
             </a></li>
-            <li class="nav-events"><a href="{{ url('mozorg.contribute.events') }}" data-label="Find an event">
+            <li class="nav-events"><a href="{{ url('mozorg.contribute.events') }}" data-link-type="nav" data-link-name="Find an event">
               {# L10n: this br is for formatting, omit or reposition as needed #}
               {{ _('Find<br> an event') }}
             </a></li>
-            <li class="nav-stories"><a href="{{ url('mozorg.contribute.stories') }}" data-label="Meet Mozillians">
+            <li class="nav-stories"><a href="{{ url('mozorg.contribute.stories') }}" data-link-type="nav" data-link-name="Meet Mozillians">
               {# L10n: this br is for formatting, omit or reposition as needed #}
               {{ _('Meet<br> Mozillians') }}
             </a></li>
             {% block contrib_nav_cta %}
-            <li class="nav-cta"><a href="{{ url('mozorg.contribute.signup') }}" data-label="Get involved" data-position="CTA button click - nav">{{ _('Get involved') }}</a></li>
+            <li class="nav-cta"><a href="{{ url('mozorg.contribute.signup') }}" data-link-type="nav" data-link-name="Get involved">{{ _('Get involved') }}</a></li>
             {% endblock contrib_nav_cta %}
           </ul>
         </nav>
@@ -116,13 +116,13 @@ <h1 class="page-title">{% block contrib_page_title %}{% endblock %}</h1>
         {% set upcoming_event = next_event() %}
         {% if upcoming_event %}
           <h3>{{ _('Upcoming event') }}</h3>
-          <a class="event-link" href="{{ upcoming_event.url }}" rel="external">
+          <a class="event-link" href="{{ upcoming_event.url }}" rel="external" data-link-type="button" data-link-name="Upcoming event">
             <time class="event-date" datetime="{{ upcoming_event.start_time.isoformat() }}">{{ _(upcoming_event.month_abbr) }} <span class="date-day">{{ upcoming_event.day_of_month }}</span></time>
             <h4 class="event-title">{{ upcoming_event.title|safe }}</h4>
             <p class="event-info"><span class="event-location">{{ upcoming_event.location|safe }}</span></p>
           </a>
         {% endif %}
-        <p class="events-all"><a href="{{ url('mozorg.contribute.events') }}">{{ _('See all events') }}</a></p>
+        <p class="events-all"><a href="{{ url('mozorg.contribute.events') }}" data-link-type="button" data-link-name="See all events">{{ _('See all events') }}</a></p>
       </div>
 
       <div class="extra-links">

diff --git a/bedrock/mozorg/templates/mozorg/contribute/index.html b/bedrock/mozorg/templates/mozorg/contribute/index.html
@@ -42,7 +42,7 @@
         </div>
       </div>
 
-      <p class="cta"><a href="{{ url('mozorg.contribute.signup') }}" data-position="CTA button click - landing primary" data-label="Get Involved">{{ _('Get Involved') }}</a></p>
+      <p class="cta"><a href="{{ url('mozorg.contribute.signup') }}" data-link-type="button" data-link-name="Get Involved">{{ _('Get Involved') }}</a></p>
 
       <div class="cycle-pager"></div>
     </div>
@@ -90,17 +90,17 @@ <h2 class="section-title">{{ _('How Mozillians help every day') }}</h2>
         <li class="person hcard">
           <h3 class="fn given-name">Rubén</h3>
           <p class="meta">{{ _('Spain &middot; Activism') }}</p>
-          <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
+          <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url" data-link-type="button" data-link-name="Read his story - Ruben">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
         </li>
         <li class="person hcard">
           <h3 class="fn given-name">Faye</h3>
           <p class="meta">{{ _('Philippines &middot; Activism') }}</p>
-          <a href="{{ url('mozorg.contribute.story-faye') }}" class="url">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
+          <a href="{{ url('mozorg.contribute.story-faye') }}" class="url" data-link-type="button" data-link-name="Read her story - Faye">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
         </li>
         <li class="person hcard">
           <h3 class="fn given-name">Michael</h3>
           <p class="meta">{{ _('Switzerland &middot; Coding') }}</p>
-          <a href="{{ url('mozorg.contribute.story-michael') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
+          <a href="{{ url('mozorg.contribute.story-michael') }}" class="url" data-link-type="button" data-link-name="Read his story - Michael">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
         </li>
       </ul>
     </div>
@@ -114,7 +114,7 @@ <h2 class="section-title">{{ _('Want to get involved? Here’s how.') }}</h2>
         <li class="step2">{{ _('Stand by for an email that will connect you to the Mozilla community') }}</li>
         <li class="step3">{{ _('Create your Mozillians account and share your contributions with the world') }}</li>
       </ol>
-      <p class="cta"><a href="{{ url('mozorg.contribute.signup') }}" data-position="CTA button click - landing bottom" data-label="Get started">{{ _('Get started') }}</a></p>
+      <p class="cta"><a href="{{ url('mozorg.contribute.signup') }}" data-link-type="button" data-link-name="Get started">{{ _('Get started') }}</a></p>
     </div>
   </section>
 
@@ -124,26 +124,26 @@ <h2 class="section-title">{{ _('Not ready to dive in just yet?') }}</h2>
       <p class="section-tagline">{{ _('Here are a few other ways you can support Mozilla right now.') }}</p>
       <ul class="other-actions">
         <li>
-          <a href="{{ donate_url('contribute') }}" class="other-donate" data-label="Donate to Mozilla">{{ _('Donate to Mozilla') }}</a>
+          <a href="{{ donate_url('contribute') }}" class="other-donate" data-link-type="button" data-link-name="Donate to Mozilla">{{ _('Donate to Mozilla') }}</a>
         </li>
         <li>
-          <a href="{{ url('firefox') }}" class="other-download" data-label="Download Firefox">{{ _('Download Firefox') }}</a>
+          <a href="{{ url('firefox') }}" class="other-download" data-link-type="button" data-link-name="Download Firefox">{{ _('Download Firefox') }}</a>
         </li>
         {# Hide this link for now
         <li>
-          <a href="{{ url('mozorg.about.manifesto') }}" class="other-read" data-label="Read our Manifesto">{{ _('Read our Manifesto') }}</a>
+          <a href="{{ url('mozorg.about.manifesto') }}" class="other-read" data-link-type="button" data-link-name="Read our Manifesto">{{ _('Read our Manifesto') }}</a>
         </li>
         #}
         {# Hide this link for now
         <li>
-          <a href="https://gear.mozilla.org" class="other-shop" data-label="Buy a Mozilla t-shirt">{{ _('Buy a Mozilla t-shirt') }}</a>
+          <a href="https://gear.mozilla.org" class="other-shop" data-link-type="button" data-link-name="Buy a Mozilla t-shirt">{{ _('Buy a Mozilla t-shirt') }}</a>
         </li>
         #}
         <li>
-          <a href="https://www.facebook.com/mozilla" class="other-facebook" data-label="Like us on Facebook">{{ _('Like us on Facebook') }}</a>
+          <a href="https://www.facebook.com/mozilla" class="other-facebook" data-link-type="button" data-link-name="Like us on Facebook">{{ _('Like us on Facebook') }}</a>
         </li>
         <li>
-          <a href="https://twitter.com/mozilla" class="other-twitter" data-label="Follow us on Twitter">{{ _('Follow us on Twitter') }}</a>
+          <a href="https://twitter.com/mozilla" class="other-twitter" data-link-type="button" data-link-name="Follow us on Twitter">{{ _('Follow us on Twitter') }}</a>
         </li>
       </ul>
     </div>

diff --git a/bedrock/mozorg/templates/mozorg/contribute/stories.html b/bedrock/mozorg/templates/mozorg/contribute/stories.html
@@ -37,9 +37,9 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
   </div>
 
   <ul class="story-links">
-    <li><a href="https://twitter.com/nukeador" class="twitter" rel="external">@nukeador</a></li>
-    <li><a href="https://github.com/nukeador" class="github" rel="external">Github</a></li>
-    <li><a href="http://www.nukeador.com/" class="website" rel="external">nukeador.com</a></li>
+    <li><a href="https://twitter.com/nukeador" class="twitter" rel="external" data-link-type="button" data-link-name="Twitter - Ruben">@nukeador</a></li>
+    <li><a href="https://github.com/nukeador" class="github" rel="external" data-link-type="button" data-link-name="Github - Ruben">Github</a></li>
+    <li><a href="http://www.nukeador.com/" class="website" rel="external" data-link-type="button" data-link-name="Website - Ruben">nukeador.com</a></li>
   </ul>
 {% endblock %}
 
@@ -48,17 +48,17 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
     <li class="person hcard">
       <h3 class="fn given-name">Shreyas</h3>
       <p class="meta">{{ _('India &middot; Teaching') }}</p>
-      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url" data-link-type="button" data-link-name="Read his story - Shreyas">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Faye</h3>
       <p class="meta">{{ _('Philippines &middot; Activism') }}</p>
-      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url" data-link-type="button" data-link-name="Read her story - Faye">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Michael</h3>
       <p class="meta">{{ _('Switzerland &middot; Coding') }}</p>
-      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url" data-link-type="button" data-link-name="Read his story - Michael">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
     </li>
   </ul>
 {% endblock %}

diff --git a/bedrock/mozorg/templates/mozorg/contribute/story-faye.html b/bedrock/mozorg/templates/mozorg/contribute/story-faye.html
@@ -36,9 +36,9 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
   </div>
 
   <ul class="story-links">
-    <li><a href="https://twitter.com/fayetandog" class="twitter" rel="external">@fayetandog</a></li>
-    <li><a href="https://www.facebook.com/fayetandog" class="facebook" rel="external">Facebook</a></li>
-    <li><a href="http://fayetandog.com/" class="website" rel="external">fayetandog.com</a></li>
+    <li><a href="https://twitter.com/fayetandog" class="twitter" rel="external" data-link-type="button" data-link-name="Twitter - Faye">@fayetandog</a></li>
+    <li><a href="https://www.facebook.com/fayetandog" class="facebook" rel="external" data-link-type="button" data-link-name="Facebook - Faye">Facebook</a></li>
+    <li><a href="http://fayetandog.com/" class="website" rel="external" data-link-type="button" data-link-name="Website - Faye">fayetandog.com</a></li>
   </ul>
 
   <div class="story-more">
@@ -66,17 +66,17 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
     <li class="person hcard">
       <h3 class="fn given-name">Rubén</h3>
       <p class="meta">{{ _('Spain &middot; Activism') }}</p>
-      <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url" data-link-type="button" data-link-name="Read his story - Ruben">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Shreyas</h3>
       <p class="meta">{{ _('India &middot; Teaching') }}</p>
-      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url" data-link-type="button" data-link-name="Read his story - Shreyas">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Michael</h3>
       <p class="meta">{{ _('Switzerland &middot; Coding') }}</p>
-      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url" data-link-type="button" data-link-name="Read his story - Michael">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
     </li>
   </ul>
 {% endblock %}
diff --git a/bedrock/mozorg/templates/mozorg/contribute/story-michael.html b/bedrock/mozorg/templates/mozorg/contribute/story-michael.html
@@ -36,8 +36,8 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
   </div>
 
   <ul class="story-links">
-    <li><a href="https://twitter.com/KohlerSolutions" class="twitter" rel="external">@KohlerSolutions</a></li>
-    <li><a href="https://github.com/MichaelKohler" class="github" rel="external">Github</a>
+    <li><a href="https://twitter.com/KohlerSolutions" class="twitter" rel="external" data-link-type="button" data-link-name="Twitter - Michael">@KohlerSolutions</a></li>
+    <li><a href="https://github.com/MichaelKohler" class="github" rel="external" data-link-type="button" data-link-name="Github - Michael">Github</a>
   </ul>
 
   <div class="story-more">
@@ -65,17 +65,17 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
     <li class="person hcard">
       <h3 class="fn given-name">Faye</h3>
       <p class="meta">{{ _('Philippines &middot; Activism') }}</p>
-      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url" data-link-type="button" data-link-name="Read her story - Faye">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Shreyas</h3>
       <p class="meta">{{ _('India &middot; Teaching') }}</p>
-      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url" data-link-type="button" data-link-name="Read his story - Shreyas">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Rubén</h3>
       <p class="meta">{{ _('Spain &middot; Activism') }}</p>
-      <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-ruben') }}" class="url" data-link-type="button" data-link-name="Read his story - Ruben">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-ruben.jpg') }}" alt=""></a>
     </li>
   </ul>
 {% endblock %}
diff --git a/bedrock/mozorg/templates/mozorg/contribute/story-ruben.html b/bedrock/mozorg/templates/mozorg/contribute/story-ruben.html
@@ -37,9 +37,9 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
   </div>
 
   <ul class="story-links">
-    <li><a href="https://twitter.com/nukeador" class="twitter" rel="external">@nukeador</a></li>
-    <li><a href="https://github.com/nukeador" class="github" rel="external">Github</a></li>
-    <li><a href="http://www.nukeador.com/" class="website" rel="external">nukeador.com</a></li>
+    <li><a href="https://twitter.com/nukeador" class="twitter" rel="external" data-link-type="button" data-link-name="Twitter - Ruben">@nukeador</a></li>
+    <li><a href="https://github.com/nukeador" class="github" rel="external" data-link-type="button" data-link-name="Github - Ruben">Github</a></li>
+    <li><a href="http://www.nukeador.com/" class="website" rel="external" data-link-type="button" data-link-name="Website - Ruben">nukeador.com</a></li>
   </ul>
 {% endblock %}
 
@@ -48,17 +48,17 @@ <h3>{{ _('I’m currently helping with:') }}</h3>
     <li class="person hcard">
       <h3 class="fn given-name">Faye</h3>
       <p class="meta">{{ _('Philippines &middot; Activism') }}</p>
-      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-faye') }}" class="url" data-link-type="button" data-link-name="Read her story - Faye">{{ _('Read her story') }} <img src="{{ static('img/contribute/person-faye.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Shreyas</h3>
       <p class="meta">{{ _('India &middot; Teaching') }}</p>
-      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-shreyas') }}" class="url" data-link-type="button" data-link-name="Read his story - Shreyas">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-shreyas.jpg') }}" alt=""></a>
     </li>
     <li class="person hcard">
       <h3 class="fn given-name">Michael</h3>
       <p class="meta">{{ _('Switzerland &middot; Coding') }}</p>
-      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
+      <a href="{{ url('mozorg.contribute.story-michael') }}" class="url" data-link-type="button" data-link-name="Read his story - Michael">{{ _('Read his story') }} <img src="{{ static('img/contribute/person-michael.jpg') }}" alt=""></a>
     </li>
   </ul>
 {% endblock %}