diff --git a/app/assets/javascripts/templateFolderForm.js b/app/assets/javascripts/templateFolderForm.js
index 744b0c4f6..2d5ee8d98 100644
--- a/app/assets/javascripts/templateFolderForm.js
+++ b/app/assets/javascripts/templateFolderForm.js
@@ -25,8 +25,9 @@
         {key: 'add-new-template', $el: this.$form.find('#add_new_template_form'), cancellable: true}
       ];
 
-      // cancel buttons only relevant if JS enabled, so
+      // cancel/clear buttons only relevant if JS enabled, so
       this.states.filter(state => state.cancellable).forEach((x) => this.addCancelButton(x));
+      this.states.filter(state => state.key === 'items-selected-buttons').forEach(x => this.addClearButton(x));
 
       // first off show the new template / new folder buttons
       this.currentState = this.$form.data('prev-state') || 'unknown';
@@ -41,23 +42,42 @@
     };
 
     this.addCancelButton = function(state) {
-      let $cancel =  $('<a></a>')
-          .html('Cancel')
-          .attr('class', 'page-footer-js-cancel')
-          .attr('tabindex', '0')
-          .on('click keydown', (event) => {
-            event.preventDefault();
-            // clear existing data
-            state.$el.find('input:radio').prop('checked', false);
-            state.$el.find('input:text').val('');
+      let $cancel = this.makeButton('Cancel', () => {
 
-            // go back to action buttons
-            this.selectActionButtons();
-          });
+        // clear existing data
+        state.$el.find('input:radio').prop('checked', false);
+        state.$el.find('input:text').val('');
+
+        // go back to action buttons
+        this.selectActionButtons();
+      });
 
       state.$el.append($cancel);
     };
 
+    this.addClearButton = function(state) {
+
+      let $clear = this.makeButton('Clear', () => {
+
+        // uncheck all templates and folders
+        this.$form.find('input:checkbox').prop('checked', false);
+
+        // go back to action buttons
+        this.selectActionButtons();
+      });
+
+      state.$el.find('.template-list-selected-counter').append($clear);
+    };
+
+    this.makeButton = (text, fn) => $('<a></a>')
+      .html(text)
+      .addClass('page-footer-js-cancel')
+      .attr('tabindex', '0')
+      .on('click keydown', event => {
+        event.preventDefault();
+        fn();
+      });
+
     this.selectActionButtons = function () {
       // If we want to show one of the grey choose actions state, we can pretend we're in the choose actions state,
       // and then pretend a checkbox was clicked to work out whether to show zero or non-zero options.
@@ -85,6 +105,9 @@
       }
 
       this.render();
+
+      $('.template-list-selected-counter-count').html(numSelected);
+
     };
 
     this.countSelectedCheckboxes = function() {
@@ -102,6 +125,9 @@
       <div id="nothing_selected">
         <button class="button-secondary" value="add-new-template">New template</button>
         <button class="button-secondary" value="add-new-folder">New folder</button>
+        <div class="template-list-selected-counter">
+          Nothing selected
+        </div>
       </div>
     `;
 
@@ -109,6 +135,9 @@
       <div id="items_selected">
         <button class="button-secondary" value="move-to-existing-folder">Move</button>
         <button class="button-secondary" value="move-to-new-folder">Add to a new folder</button>
+        <div class="template-list-selected-counter">
+          <span class="template-list-selected-counter-count">1</span> selected &ensp;
+        </div>
       </div>
     `;
   };
diff --git a/app/assets/stylesheets/components/message.scss b/app/assets/stylesheets/components/message.scss
index c4833d8dc..c36c7bae1 100644
--- a/app/assets/stylesheets/components/message.scss
+++ b/app/assets/stylesheets/components/message.scss
@@ -108,6 +108,13 @@
     padding: $gutter-half 0 $gutter-one-third 0;
   }
 
+  &-selected-counter {
+    position: absolute;
+    right: $gutter-half;
+    top: $gutter - 1px;
+    color: $secondary-text-colour;
+  }
+
 }
 
 .folder-heading {