Extend the tags system for /updates/ to work for /showcase/ (google#4093

) * Extend the tags system for /updates/ to work for /showcase/ * Review comments * Fixed templating error * Adds new common tags used in case studies * Tags 2015 & 2016 case studies
tonysan · Jan 30, 2017 · 02f96f3 · 02f96f3
1 parent 4b9026a
commit 02f96f3
Show file tree

Hide file tree

Showing 43 changed files with 58 additions and 14 deletions.
diff --git a/.gitignore b/.gitignore
@@ -26,6 +26,7 @@ src/content/*/shows/http203/podcast/feed.xml
 src/content/*/showcase/_index.yaml
 src/content/*/showcase/*/_toc.yaml
 src/content/*/showcase/*/index.md
+src/content/*/showcase/tags/*
 src/content/*/rss.xml
 src/content/*/atom.xml
 

diff --git a/gulp-tasks/build.js b/gulp-tasks/build.js
@@ -38,11 +38,13 @@ gulp.task('build:showcase', function() {
     outputPath: baseOutputPath
   };
   var startPath = path.join(GLOBAL.WF.src.content, 'showcase');
-  var patterns = ['**/*.md', '!**/index.md'];
+  var patterns = ['**/*.md', '!tags/*', '!**/index.md'];
   var files = wfHelper.getFileList(startPath, patterns);
   files.sort(wfHelper.publishedComparator);
   wfTemplateHelper.generateIndex(files, options);
   wfTemplateHelper.generateFeeds(files, options);
+  options.outputPath = path.join(baseOutputPath, 'tags');
+  wfTemplateHelper.generateTagPages(files, options);
   var filesByYear = wfHelper.splitByYear(files);
   Object.keys(filesByYear).forEach(function(year) {
     options.year = year;

diff --git a/gulp-tasks/test.js b/gulp-tasks/test.js
@@ -13,6 +13,7 @@ var wfHelper = require('./wfHelper');
 var STD_EXCLUDES = [
   '!**/_common-links.md',
   '!**/updates/tags/*',
+  '!**/showcase/tags/*',
   '!**/fundamentals/getting-started/codelabs/*/*.md',
   '!**/updates/201?/index.md',
   '!**/showcase/201?/index.md',

diff --git a/gulp-tasks/wfTemplateHelper.js b/gulp-tasks/wfTemplateHelper.js
@@ -169,7 +169,7 @@ function generateIndex(files, options) {
 }
 
 function generateTagPages(files, options) {
-  gutil.log(' ', 'Generating tag pages...');
+  gutil.log(' ', 'Generating tag pages for ' + options.section + '...');
   var allTags = {};
   files.forEach(function(file) {
     var tags = file.tags;
@@ -189,15 +189,16 @@ function generateTagPages(files, options) {
     tags: Object.keys(allTags).sort(),
     section: options.section
   };
-  var tmpl = path.join(GLOBAL.WF.src.templates, 'updates', 'tag-index.md');
+  var tmpl = path.join(GLOBAL.WF.src.templates, 'tags', 'tag-index.md');
   var outputFile = path.join(options.outputPath, 'index.md');
   renderTemplate(tmpl, context, outputFile);
-  tmpl = path.join(GLOBAL.WF.src.templates, 'updates' ,'tag_toc.yaml');
+  tmpl = path.join(GLOBAL.WF.src.templates, 'tags' ,'tag_toc.yaml');
   outputFile = path.join(options.outputPath, '_toc.yaml');
   renderTemplate(tmpl, context, outputFile);
   Object.keys(allTags).forEach(function(key) {
+    var name = options.section.replace(/(\w)(\w+[^s])(s|S)?\b/, (_, a, b) => a.toUpperCase() + b + 's');
     var opts = {
-      title: 'All Updates tagged: ' + key + '',
+      title: 'All ' + name + ' tagged: ' + key + '',
       section: options.section,
       outputFile: path.join(options.outputPath, key + '.md')
     };

diff --git a/gulpfile.js b/gulpfile.js
@@ -84,6 +84,7 @@ gulp.task('clean', function() {
     'src/content/*/showcase/_index.yaml',
     'src/content/*/showcase/*/_toc.yaml',
     'src/content/*/showcase/*/index.md',
+    'src/content/*/showcase/tags/*',
     'src/content/*/shows/_index.yaml',
     'src/content/*/shows/index.md',
     'src/content/*/shows/**/feed.xml',

diff --git a/src/content/en/showcase/2015/adsy_me.md b/src/content/en/showcase/2015/adsy_me.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-05-04 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/adsy_me/card.jpg #}
+{# wf_tags: spotlight #}
 
 # Adsy.me {: .page-title }
 

diff --git a/src/content/en/showcase/2015/adventuremachine.md b/src/content/en/showcase/2015/adventuremachine.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-08-14 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/adventuremachine/card.jpg #}
+{# wf_tags: spotlight #}
 
 # Madeon Adventure Machine {: .page-title }
 

diff --git a/src/content/en/showcase/2015/airhorner.md b/src/content/en/showcase/2015/airhorner.md
@@ -6,6 +6,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_author: paulkinlan #}
 {# wf_featured_image: /web/showcase/2015/images/airhorner/card.jpg #}
 {# wf_featured_snippet: AirHorner is a simple but powerful Progressive Web App that shows the power of Service Workers and the Web Audio API to give you your very own air horn. Use it to annoy your friends or co-workers, no matter whether you're online, offline or on a flaky 2G network. #}
+{# wf_tags: spotlight,serviceworker,offline,addtohomescreen #}
 
 # AirHorner.com {: .page-title }
 

diff --git a/src/content/en/showcase/2015/beyond-the-rack.md b/src/content/en/showcase/2015/beyond-the-rack.md
@@ -7,6 +7,7 @@ description: Beyond the Rack re-engages users on the mobile web, increasing reve
 {# wf_author: paulkinlan #}
 {# wf_featured_image: /web/showcase/2015/images/beyond-the-rack/card.jpg #}
 {# wf_featured_snippet: Push notifications allowed us to bring one of the most compelling capabilities from our native app to our mobile site. We see a direct 20% click through rate from push notifications—having another channel to reach our users is a game changer. #}
+{# wf_tags: progressive-web-apps,webpush,notifications,serviceworker,casestudy #}
 
 # Beyond the Rack {: .page-title }
 

diff --git a/src/content/en/showcase/2015/chrome-dev-summit.md b/src/content/en/showcase/2015/chrome-dev-summit.md
@@ -1,14 +1,12 @@
 project_path: /web/_project.yaml
 book_path: /web/showcase/_book.yaml
-description: >
-  The Chrome Dev Summit 2014 website was built in-house by our own Paul Lewis,
-  the CDS website showed how to build a great mobile web experience for conference
-  visitors.
+description: The Chrome Dev Summit 2014 website was built in-house by our own Paul Lewis, the CDS website showed how to build a great mobile web experience for conference visitors.
 
 {# wf_published_on: 2015-03-27 #}
 {# wf_updated_on: 2015-03-27 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/chrome-dev-summit/card.jpg #}
+{# wf_tags: casestudy,chromedevsummit #}
 
 # Chrome Dev Summit 2014 {: .page-title }
 

diff --git a/src/content/en/showcase/2015/googleplus.md b/src/content/en/showcase/2015/googleplus.md
@@ -6,6 +6,7 @@ description: We hit our goal of never downloading more than 60k of HTML, 60k of
 {# wf_updated_on: 2015-11-17 #}
 {# wf_featured_image: /web/showcase/2015/images/gplus/card.jpg #}
 {# wf_featured_snippet: We hit our goal of never downloading more than 60k of HTML, 60k of JavaScript and 60k of CSS at any one time! #}
+{# wf_tags: casestudy,css #}
 
 # Google+ {: .page-title }
 

diff --git a/src/content/en/showcase/2015/hn_premii.md b/src/content/en/showcase/2015/hn_premii.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-04-01 #}
 {# wf_author: paulkinlan #}
 {# wf_featured_image: /web/showcase/2015/images/hn_premii/card.jpg #}
+{# wf_tags: spotlight #}
 
 # Hacker News Reader {: .page-title }
 

diff --git a/src/content/en/showcase/2015/hummingbirdlibrary.md b/src/content/en/showcase/2015/hummingbirdlibrary.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-08-14 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/hummingbirdlibrary/card.jpg #}
+{# wf_tags: spotlight #}
 
 # Hummingbird Library {: .page-title }
 

diff --git a/src/content/en/showcase/2015/lightsaber.md b/src/content/en/showcase/2015/lightsaber.md
@@ -7,6 +7,7 @@ description: How to set up a high FPS WebGL project with Polymer.
 {# wf_author: yatesbuckley,maciejzasada,fouadvaladbeigi #}
 {# wf_featured_image: /web/showcase/2015/images/lightsaber/card.jpg #}
 {# wf_featured_snippet: How we used Polymer to create a high-performance WebGL mobile controlled Lightsaber that is modular and configurable. We review some of the key details of our <a href="https://lightsaber.withgoogle.com/"> project</a> to help you save time when creating your own next time you run into a pack of angry Stormtroopers. #}
+{# wf_tags: casestudy,webgl,experiment #}
 
 # Creating a Lightsaber with Polymer {: .page-title }
 

diff --git a/src/content/en/showcase/2015/little_alchemy.md b/src/content/en/showcase/2015/little_alchemy.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-04-08 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/little_alchemy/card.jpg #}
+{# wf_tags: spotlight,game #}
 
 # Little Alchemy {: .page-title }
 

diff --git a/src/content/en/showcase/2015/merry_pixmas.md b/src/content/en/showcase/2015/merry_pixmas.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-03-27 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/merry_pixmas/card.jpg #}
+{# wf_tags: spotlight,css,3d #}
 
 # Merry Pixmas {: .page-title }
 

diff --git a/src/content/en/showcase/2015/service-workers-iowa.md b/src/content/en/showcase/2015/service-workers-iowa.md
@@ -6,6 +6,7 @@ description: The Google I/O 2015 Web App
 {# wf_updated_on: 2015-10-01 #}
 {# wf_author: jeffreyposnick #}
 {# wf_featured_image: /web/showcase/2015/images/service-workers-iowa/card.jpg #}
+{# wf_tags: casestudy,serviceworker,offline #}
 
 # Service Workers in Production {: .page-title }
 

diff --git a/src/content/en/showcase/2015/svgomg.md b/src/content/en/showcase/2015/svgomg.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-03-24 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/svgomg/card.jpg #}
+{# wf_tags: spotlight,svg,serviceworker,offline,progressive-web-apps #}
 
 # SVGOMG {: .page-title }
 

diff --git a/src/content/en/showcase/2015/web_filter.md b/src/content/en/showcase/2015/web_filter.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2015-03-24 #}
 {# wf_author: pbakaus #}
 {# wf_featured_image: /web/showcase/2015/images/web_filter/card.jpg #}
+{# wf_tags: spotlight,getusermedia #}
 
 # Web Filter {: .page-title }
 

diff --git a/src/content/en/showcase/2016/5miles.md b/src/content/en/showcase/2016/5miles.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T18:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/5miles/featured.png #}
 {# wf_featured_snippet: "With a new user growth rate of 100%, quarter-on-quarter, the mobile web is at the heart of our success...It’s a major venue for low-cost and highly effective customer acquisition and engagement."<br><b>Lucas Lu</b>, 5miles CEO #}
+{# wf_tags: mobile,addtohomescreen,progressive-web-apps,serviceworker,casestudy #}
 
 # 5miles {: .page-title }
 

diff --git a/src/content/en/showcase/2016/ali-express-smart-lock.md b/src/content/en/showcase/2016/ali-express-smart-lock.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2017-01-17 #}
 {# wf_featured_image: /web/showcase/2016/images/ali-express-smart-lock/card.png #}
 {# wf_featured_snippet: Most Indian users reach the Internet via 2G and 3G networks, so a fast user experience is essential. To decrease load times, Housing.com added Service Workers and streamlined their site to help consumers quickly find what they’re looking for. Users can continue browsing properties and reviewing previous searches, all while offline. #}
+{# wf_tags: smart-lock,casestudy #}
 
 # Smart Lock for AliExpress {: .page-title }
 

diff --git a/src/content/en/showcase/2016/alibaba.md b/src/content/en/showcase/2016/alibaba.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-11-09T19:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/alibaba/card.png #}
 {# wf_featured_snippet: Alibaba.com is the world’s largest online business-to-business (B2B) trading platform, serving 200+ countries and regions. After upgrading their site to a Progressive Web App (PWA), they saw a 76 percent increase in total conversions across browsers.  #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # Alibaba {: .page-title }
 

diff --git a/src/content/en/showcase/2016/aliexpress.md b/src/content/en/showcase/2016/aliexpress.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T23:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/aliexpress/featured.png #}
 {# wf_featured_snippet: "Smarter shopping, better living!" is the motto of AliExpress, a website where shoppers can buy everything from baby clothes to refrigerators directly from China. Part of the Alibaba Group, the global online retail marketplace is now a popular e-commerce site in America, Russia, and Brazil. #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # AliExpress {: .page-title }
 

diff --git a/src/content/en/showcase/2016/art-sessions.md b/src/content/en/showcase/2016/art-sessions.md
@@ -6,6 +6,7 @@ description: Six artists were invited to paint, design, and sculpt in VR.
 {# wf_updated_on: 2016-04-19 #}
 {# wf_author: michaelchang,jeffnusz #}
 {# wf_featured_snippet: Six artists were invited to paint, design, and sculpt in VR. This is the process for how we recorded their sessions, converted the data, and presented it in real-time with web browsers. #}
+{# wf_tags: experiment,vr,casestudy #}
 
 # Virtual Art Sessions {: .page-title }
 

diff --git a/src/content/en/showcase/2016/babe.md b/src/content/en/showcase/2016/babe.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T20:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/babe/featured.png #}
 {# wf_featured_snippet: "For us, it’s no longer an either-or decision. To reach new users, we must be on the mobile web!",<br> <b>Weihan Liew</b>, BaBe CEO. #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # BaBe {: .page-title }
 

diff --git a/src/content/en/showcase/2016/carnival.md b/src/content/en/showcase/2016/carnival.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-11-09T21:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/carnival/card.png #}
 {# wf_featured_snippet: Carnival Cruise Line, one of the world’s largest leisure-travel companies, wanted to enhance how it re-engaged its customers. Working with Mobify, Carnival implemented push notifications for mobile web users on Android and for desktop users on Chrome. The new strategy delivered a 42% engagement rate from customers who receive notifications. #}
+{# wf_tags: progressive-web-apps,webpush,notifications,serviceworker,casestudy #}
 
 # Carnival Cruise Line {: .page-title }
 

diff --git a/src/content/en/showcase/2016/extra.md b/src/content/en/showcase/2016/extra.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T22:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/extra/featured.png #}
 {# wf_featured_snippet: "Push Notifications are a huge part of our mobile engagement strategy. It’s a more personal way to communicate with our customers. That’s incredibly valuable to our bottom line."<br><b>Mujeeb Hazzaa</b>, Chief Business Development Officer #}
+{# wf_tags: progressive-web-apps,webpush,notifications,serviceworker,casestudy #}
 
 # eXtra Electronics {: .page-title }
 

diff --git a/src/content/en/showcase/2016/flipkart.md b/src/content/en/showcase/2016/flipkart.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-03-28 #}
 {# wf_featured_image: /web/showcase/2016/images/flipkart/card.jpg #}
 {# wf_featured_snippet: In 2015, Flipkart, India’s largest e-commerce site, adopted an app-only strategy and temporarily shut down their mobile website. The company found it harder and harder to provide a user experience that was as fast and engaging as that of their mobile app. But then, Flipkart decided to rethink their development approach. They were drawn back to the mobile web by the introduction of features that made the mobile web run instantly, work offline, and re-engage users. #}
+{# wf_tags: progressive-web-apps,offline,serviceworker,casestudy #}
 
 # Flipkart triples time-on-site with Progressive Web App {: .page-title }
 

diff --git a/src/content/en/showcase/2016/guardian-smart-lock.md b/src/content/en/showcase/2016/guardian-smart-lock.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-09-30 #}
 {# wf_featured_image: /web/showcase/2016/images/guardian-smart-lock/card.png #}
 {# wf_featured_snippet: Since launching Smart Lock, the Guardian has seen a 44% increase in cross-platform signed-in users, compared to 10% the 35 weeks leading up to the launch #}
+{# wf_tags: smart-lock,casestudy #}
 
 # Smart Lock for the Guardian {: .page-title }
 

diff --git a/src/content/en/showcase/2016/housing.md b/src/content/en/showcase/2016/housing.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-09-26 #}
 {# wf_featured_image: /web/showcase/2016/images/housing/card.png #}
 {# wf_featured_snippet: Most Indian users reach the Internet via 2G and 3G networks, so a fast user experience is essential. To decrease load times, Housing.com added Service Workers and streamlined their site to help consumers quickly find what they’re looking for. Users can continue browsing properties and reviewing previous searches, all while offline. #}
+{# wf_tags: progressive-web-apps,offline,serviceworker,casestudy #}
 
 # Housing.com increases conversions and lowers bounce rate by 40% with new PWA {: .page-title }
 

diff --git a/src/content/en/showcase/2016/iowa2016.md b/src/content/en/showcase/2016/iowa2016.md
@@ -7,6 +7,7 @@ description: Building the Google I/O 2016 PWA using web components
 {# wf_author: ericbidelman #}
 {# wf_featured_image: /web/showcase/2016/images/iowa/featured.gif #}
 {# wf_featured_snippet: <p>Learn how we built a the Google I/O 2016 Progressive Web App (IOWA) using web components, Polymer, and material design and launched it into production on Google.com.</p><p>IOWA is a single page application (SPA) that's built using web components, Polymer, Firebase, and has an extensive backend written in App Engine (Go). It pre-caches content for offline users using a service worker, dynamically loads new pages, gracefully transitions between views, and reuses content after first load.</p> #}
+{# wf_tags: progressive-web-apps,webpush,notifications,serviceworker,casestudy,webcomponents,google-io #}
 
 <style>
 .devsite-article-inner figure {

diff --git a/src/content/en/showcase/2016/jumia.md b/src/content/en/showcase/2016/jumia.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T21:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/jumia/featured.png #}
 {# wf_featured_snippet: "We finally have proper means to address our fastest growing pool of customers — mobile web users. That’s incredibly valuable. We even see better results from web Push Notifications than from app pushes."<br><b>Jeremy Doutte</b>, Jumia CEO #}
+{# wf_tags: progressive-web-apps,webpush,notifications,serviceworker,casestudy #}
 
 # Jumia {: .page-title }
 

diff --git a/src/content/en/showcase/2016/konga.md b/src/content/en/showcase/2016/konga.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T19:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/konga/featured.png #}
 {# wf_featured_snippet: "We estimate that with our new light, super-fast, UX-rich browsing capability, customers’ data consumption will fall dramatically which we believe will result in a corresponding increase in conversions."<br><b>Shola Adekoya</b>, Konga.com CEO. #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # Konga {: .page-title }
 

diff --git a/src/content/en/showcase/2016/land-lines.md b/src/content/en/showcase/2016/land-lines.md
@@ -4,8 +4,8 @@ book_path: /web/showcase/_book.yaml
 {# wf_published_on: 2016-12-15T19:00:00.000Z #}
 {# wf_updated_on: 2016-12-15T19:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/land-lines/card.png #}
-{# wf_featured_snippet: Land Lines is an experiment that lets you explore Google Earth satellite images through gesture. Using a combination of machine learning, optimized algorithms,and graphics card power, the experiment is able to run efficiently on yourphone's web browser without a need for backend servers. This is a look into our development process and the various approaches we tried leading us to the final result. #}
-
+{# wf_featured_snippet: Land Lines is an experiment that lets you explore Google Earth satellite images through gesture. Using a combination of machine learning, optimized algorithms,and graphics card power, the experiment is able to run efficiently on your phone's web browser without a need for backend servers. This is a look into our development process and the various approaches we tried leading us to the final result. #}
+{# wf_tags: experiment,casestudy #}
 
 # Land Lines {: .page-title }
 

diff --git a/src/content/en/showcase/2016/net-a-porter.md b/src/content/en/showcase/2016/net-a-porter.md
@@ -6,6 +6,7 @@ description: Net-A-Porter saves development time with Google's Polymer Library
 {# wf_updated_on: 2016-04-15 #}
 {# wf_featured_image: /web/showcase/2016/images/net-a-porter/card.png #}
 {# wf_featured_snippet: NET-A-PORTER implemented a component-based design on their online properties using Google's Polymer library. The result was a large saving in development time, standarized code across their sites and an improved SEO performance through use of structured data. #}
+{# wf_tags: polymer,casestudy #}
 
 # NET-A-PORTER {: .page-title }
 

diff --git a/src/content/en/showcase/2016/service-worker-perf.md b/src/content/en/showcase/2016/service-worker-perf.md
@@ -7,6 +7,7 @@ description: Measuring the Real-world Performance Impact of Service Workers
 {# wf_author: philipwalton #}
 {# wf_featured_image: /web/showcase/2016/images/service-worker-perf/desktop-all.png #}
 {# wf_featured_snippet: One of the most significant benefits of service workers (from a performance perspective, at least) is their ability to proactively control the caching of assets. A web application that can cache all of its necessary resources should load substantially faster for returning visitors. But what do these gains actually look like to real users? And how do you even measure this? #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy,performance,google-io #}
 
 <style>
 td[align="right"] {

diff --git a/src/content/en/showcase/2016/suumo.md b/src/content/en/showcase/2016/suumo.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-05-17T17:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/suumo/featured.png #}
 {# wf_featured_snippet: "We finally have a way to retain users on the mobile web. This has been a game changer for us!"<br><b>Dai Shibayama</b>, manager, Smart Device Division, Recruit Sumai Company Ltd. #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # Suumo {: .page-title }
 

diff --git a/src/content/en/showcase/2016/wapo.md b/src/content/en/showcase/2016/wapo.md
@@ -5,6 +5,7 @@ book_path: /web/showcase/_book.yaml
 {# wf_updated_on: 2016-07-20T18:00:00.000Z #}
 {# wf_featured_image: /web/showcase/2016/images/wapo/wapo-featured.gif #}
 {# wf_featured_snippet: AMP helps the Washington Post increase returning users from mobile search by 23%! <br><br>"We are committed to improving speed across the board. If our site takes a long time to load, it doesn’t matter how great our journalism is, some people will leave the page before they see what’s there"<br><b>David Merrell</b>, Senior Product Manager, The Washington Post #}
+{# wf_tags: progressive-web-apps,serviceworker,casestudy #}
 
 # The Washington Post {: .page-title }