diff --git a/frontend/app/views/components/org/case-template/case-templates.html b/frontend/app/views/components/org/case-template/case-templates.html
index 0249e70dc8..77e2be68fa 100644
--- a/frontend/app/views/components/org/case-template/case-templates.html
+++ b/frontend/app/views/components/org/case-template/case-templates.html
@@ -23,20 +23,27 @@
 </div>
 
 <div class="row" ng-if="$vm.template || $vm.templates.length > 0">
-    <div class="col-md-2">
-
-
-        <h4 class="mt-m text-primary">Current templates</h4>
+    <div class="col-md-3">
+        <h4 class="mv-s text-primary">Current templates</h4>
         <ul class="nav nav-pills nav-stacked" ng-show="$vm.templates">
-            <li ng-class="{'active': $index === $vm.templateIndex}" ng-repeat="template in $vm.templates">
-                <a href ng-click="$vm.loadTemplate(template)">{{template.name}}</a>
-            </li>
+            <div class="list-group">
+                <a href ng-click="$vm.loadTemplate(template)" class="list-group-item" ng-class="{'active': $index === $vm.templateIndex}" ng-repeat="template in $vm.templates">
+                    <h4 class="list-group-item-heading">{{template.name}}</h4>
+                    <p class="list-group-item-text">{{template.displayName}}</p>
+                </a>
+            </div>
+            <!-- <li ng-class="{'active': $index === $vm.templateIndex}" ng-repeat="template in $vm.templates">
+                <a href ng-click="$vm.loadTemplate(template)">
+                    <div>{{template.name}}</div>
+                    <div class="help-block small">{{template.displayName}}</div>
+                </a>
+            </li> -->
         </ul>
         <div ng-hide="$vm.templates.length != 0">
             There are no templates
         </div>
     </div>
-    <div class="col-md-10 left-border">
+    <div class="col-md-9 left-border">
         <form class="form-horizontal" name="templateEditForm" ng-submit="$vm.saveTemplate()" novalidate>
             <div class="row">
                 <div class="col-md-6">
diff --git a/frontend/app/views/components/org/case-template/details.html b/frontend/app/views/components/org/case-template/details.html
index 41e12ae1dd..60e9a8221f 100644
--- a/frontend/app/views/components/org/case-template/details.html
+++ b/frontend/app/views/components/org/case-template/details.html
@@ -9,6 +9,14 @@ <h4 class="vpad10 text-primary">Case basic information</h4>
     </div>
 </div>
 
+<div class="form-group">
+    <label class="col-md-3 control-label">Display name</label>
+    <div class="col-md-9">
+        <input autocomplete="off" class="form-control" name="displayName" ng-model="$vm.template.displayName" placeholder="Display name" type="text" />
+        <p class="help-block small">This is a display name of the template</p>
+    </div>
+</div>
+
 <div class="form-group">
     <label class="col-md-3 control-label">Title prefix</label>
     <div class="col-md-9">
diff --git a/frontend/app/views/partials/case/case.creation.html b/frontend/app/views/partials/case/case.creation.html
index 72edf0ac6a..0824e3b20d 100644
--- a/frontend/app/views/partials/case/case.creation.html
+++ b/frontend/app/views/partials/case/case.creation.html
@@ -15,7 +15,7 @@ <h4 class="vpad10 text-primary">Case details</h4>
                         <input class="form-control input-sm" name="title" ng-if="!fromTemplate" ng-model="newCase.title" placeholder="Title" required type="text"/>
 
                         <div class="input-group" ng-if="fromTemplate">
-                            <span class="input-group-addon">{{template.titlePrefix}}</span>
+                            <span class="input-group-addonspan: >{{template.displayNitl || template.titlePrefixePrefix}}/>
                             <input class="form-control input-sm" name="title" ng-model="newCase.title" placeholder="Title" required type="text"/>
                         </div>
 
@@ -101,7 +101,7 @@ <h4 class="vpad10 text-primary">Case details</h4>
 
         <div if-permission="manageTask">
             <h4 class="vpad10 text-primary">Case tasks
-                <small ng-if="fromTemplate">(from [{{template.name}}] template)</small>
+                <small ng-if="fromTemplate">(from template: {{template.displayName || template.name}} )</small>
             </h4>
             <div class="row" ng-if="!fromTemplate">
                 <div class="col-md-12">
diff --git a/frontend/app/views/partials/case/case.templates.selector.html b/frontend/app/views/partials/case/case.templates.selector.html
index 16ed0ddd63..839661d649 100644
--- a/frontend/app/views/partials/case/case.templates.selector.html
+++ b/frontend/app/views/partials/case/case.templates.selector.html
@@ -31,7 +31,7 @@ <h3 class="box-title">Select a template</h3>
                   ng-class="{'active': dialog.state.selected === template.id}"
                   ng-click="dialog.next(template)">
                       <td>
-                          <strong>{{template.name}}</strong><br>
+                          <strong>{{template.displayName || template.name}}</strong><br>
                           <p class="list-group-item-text text-muted">{{template.description | ellipsis:200}}</p>
                       </td>
                   </tr>