Merge pull request #3997 from analytics-pros/bug-1248040-smarton

[bug 1248040] Update GTM data attributes on smarton pages navigation …

bedrock/teach/templates/teach/smarton/base.html

@@ -33,10 +33,10 @@ <h1 class="series-title"><a href="{{ url('teach.smarton.index') }}">{{ _('Get <b
       <p class="series-intro">
         {{ _('The SmartOn Series is like your Internet owner’s manual: the place to learn the most useful intel and tips from Mozilla policy peeps and programmers.') }}
       </p>
-      <p class="series-link"><a href="{{ url('teach.smarton.index') }}">{{ _('See all SmartOns') }}</a></p>
+      <p class="series-link"><a href="{{ url('teach.smarton.index') }}" data-link-type="nav" data-link-name="See all SmartOns">{{ _('See all SmartOns') }}</a></p>
 
       <div id="tabzilla">
-        <a href="{{ url('mozorg.home') }}">Mozilla</a>
+        <a href="{{ url('mozorg.home') }}" data-link-type="nav" data-link-name="tabzilla">Mozilla</a>
       </div>
     </div>
   </header>
@@ -89,10 +89,10 @@ <h1 class="page-title">{{ title }}</h1>
     <nav class="nav-steps">
       {# L10n: <b> elements below are for visual formatting, to distinguish the numeral from the text label #}
       <ol>
-        <li id="nav-step-ask"><a href="#ask">{{ _('<b>1.</b> Ask') }}</a></li>
-        <li id="nav-step-know"><a href="#know">{{ _('<b>2.</b> Know') }}</a></li>
-        <li id="nav-step-do"><a href="#do">{{ _('<b>3.</b> Do') }}</a></li>
-        <li id="nav-step-chat"><a href="#chat">{{ _('<b>4.</b> Chat') }}</a></li>
+        <li id="nav-step-ask"><a href="#ask" data-link-type="nav" data-link-name="Ask">{{ _('<b>1.</b> Ask') }}</a></li>
+        <li id="nav-step-know"><a href="#know" data-link-type="nav" data-link-name="Know">{{ _('<b>2.</b> Know') }}</a></li>
+        <li id="nav-step-do"><a href="#do" data-link-type="nav" data-link-name="Do">{{ _('<b>3.</b> Do') }}</a></li>
+        <li id="nav-step-chat"><a href="#chat" data-link-type="nav" data-link-name="Chat">{{ _('<b>4.</b> Chat') }}</a></li>
       </ol>
     </nav>
 

bedrock/teach/templates/teach/smarton/index.html

@@ -17,7 +17,7 @@
       <li class="topic topic-tracking" id="topic-tracking" data-path-hide="M0,0 v260 c0,0,60,6,130-5 c80-10,130-5,130-5 V0 H0 z" data-path-show="M0,0 v70 c0,0,45,14,130,14 s130-14,130-14 V0 H0 z">
         <h2 class="topic-title">{{ _('Tracking') }}</h2>
         <p class="topic-intro">{{ _('What you do online is your business, and you can keep it that way.') }}</p>
-        <a href="{{ url('teach.smarton.tracking') }}" class="inner">
+        <a href="{{ url('teach.smarton.tracking') }}" class="inner" data-link-type="tile" data-link-name="Tracking">
           <p class="cta">
           {% if l10n_has_tag('smarton-surveillance') %}
             {{ _('Outfox the trackers') }}
@@ -39,7 +39,7 @@ <h2 class="topic-title">
         </h2>
         {# L10n: "Buff" here is slang for fit, strong, or tough. #}
         <p class="topic-intro">{{ _('Look both ways, stay updated, and make sure your passwords are as buff as you are.') }}</p>
-        <a href="{{ url('teach.smarton.security') }}" class="inner">
+        <a href="{{ url('teach.smarton.security') }}" class="inner" data-link-type="tile" data-link-name="Cybersecurity">
           <p class="cta">{{ _('Lock it down') }}</p>
         </a>
         <svg class="shape" viewBox="0 0 255 300" width="100%" height="100%" preserveAspectRatio="none" aria-hidden="true" role="presentation"><path fill="#fff" d="M0,0 v70 c0,0,45,14,130,14 s130-14,130-14 V0 H0 z"/></svg>
@@ -54,7 +54,7 @@ <h2 class="topic-title">
         {% endif %}
         </h2>
         <p class="topic-intro">{{ _('Decide where you think the line should be – and keep others from crossing it.') }}</p>
-        <a href="{{ url('teach.smarton.surveillance') }}" class="inner">
+        <a href="{{ url('teach.smarton.surveillance') }}" class="inner" data-link-type="tile" data-link-name="Government Surveillance">
           <p class="cta">{{ _('Take a stand') }}</p>
         </a>
         <svg class="shape" viewBox="0 0 255 300" width="100%" height="100%" preserveAspectRatio="none" aria-hidden="true" role="presentation"><path fill="#fff" d="M0,0 v70 c0,0,45,14,130,14 s130-14,130-14 V0 H0 z"/></svg>

bedrock/teach/templates/teach/smarton/security.html

@@ -301,7 +301,7 @@ <h2 class="section-title">{{ _('Blast your cybersecurity smarts') }}</h2>
           <p>
             <span class="chat-question">{{ _('How many online passwords do you have?') }}</span>
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('How many online passwords do you have?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('How many online passwords do you have?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-1.svg' %}
@@ -310,7 +310,7 @@ <h2 class="section-title">{{ _('Blast your cybersecurity smarts') }}</h2>
           <p>
             <span class="chat-question">{{ _('What kind of security tips and tricks do you use online?') }}</span>
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('What kind of security tips and tricks do you use online?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('What kind of security tips and tricks do you use online?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-2.svg' %}
@@ -319,7 +319,7 @@ <h2 class="section-title">{{ _('Blast your cybersecurity smarts') }}</h2>
           <p>
             <span class="chat-question">{{ _('On a scale from 1 to 10, how safe do you feel online? Is it always clear to you whether or not your activities are secure?') }}</span>
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('On a scale from 1 to 10, how safe do you feel online?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/cybersecurity'|urlencode, _('On a scale from 1 to 10, how safe do you feel online?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-3.svg' %}

bedrock/teach/templates/teach/smarton/surveillance.html

@@ -324,7 +324,7 @@ <h2 class="section-title">{{ _('Blast your surveillance smarts') }}</h2>
 
             {{ q1tweet }}
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, q1tweet|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, q1tweet|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-1.svg' %}
@@ -333,7 +333,7 @@ <h2 class="section-title">{{ _('Blast your surveillance smarts') }}</h2>
           <p>
             {{ _('If you had a digital lockbox that no one could see but you, what would you put in it?') }}
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, _('If you had a digital lockbox that no one could see but you, what would you put in it?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, _('If you had a digital lockbox that no one could see but you, what would you put in it?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-2.svg' %}
@@ -342,7 +342,7 @@ <h2 class="section-title">{{ _('Blast your surveillance smarts') }}</h2>
           <p>
             {{ _('Have you stopped sharing certain things online since you found out about mass government surveillance?') }}
             <span class="tweet-this">
-              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, _('Have you stopped sharing certain things online since you found out about mass government surveillance?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+              <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/surveillance'|urlencode, _('Have you stopped sharing certain things online since you found out about mass government surveillance?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
             </span>
           </p>
           {% include 'teach/smarton/includes/list-number-3.svg' %}

bedrock/teach/templates/teach/smarton/tracking.html

@@ -360,7 +360,7 @@ <h2 class="section-title">{{ _('Share your tracking smarts') }}</h2>
             <p>
               <span class="chat-question">{{ _('What privacy settings do you use in your browser?') }}</span>
               <span class="tweet-this">
-                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('What privacy settings do you use in your browser?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('What privacy settings do you use in your browser?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
               </span>
             </p>
             {% include 'teach/smarton/includes/list-number-1.svg' %}
@@ -369,7 +369,7 @@ <h2 class="section-title">{{ _('Share your tracking smarts') }}</h2>
             <p>
               <span class="chat-question">{{ _('How much are you willing to share about yourself in exchange for personalized content?') }}</span>
               <span class="tweet-this">
-                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('How much are you willing to share about yourself in exchange for personalized content?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('How much are you willing to share about yourself in exchange for personalized content?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
               </span>
             </p>
             {% include 'teach/smarton/includes/list-number-2.svg' %}
@@ -378,7 +378,7 @@ <h2 class="section-title">{{ _('Share your tracking smarts') }}</h2>
             <p>
               <span class="chat-question">{{ _('Have you ever used private browsing?') }}</span>
               <span class="tweet-this">
-                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('Have you ever used private browsing?')|urlencode, hashtag|urlencode)|e }}">{{ _('Tweet this') }}</a>
+                <a class="button-tweet" href="{{ 'https://www.twitter.com/intent/tweet?url=%s&text=%s%s'|format('http://mzl.la/tracking'|urlencode, _('Have you ever used private browsing?')|urlencode, hashtag|urlencode)|e }}" data-link-type="social share" data-link-name="Twitter">{{ _('Tweet this') }}</a>
               </span>
             </p>
             {% include 'teach/smarton/includes/list-number-3.svg' %}