diff --git a/src/main/resources/static/css/dark/templates.css b/src/main/resources/static/css/dark/templates.css
index 4f56a863e34b42c78020d34321ff815ab2b33193..9e2b1904902c700b06a7d91bb83bf76dfb4f4101 100644
--- a/src/main/resources/static/css/dark/templates.css
+++ b/src/main/resources/static/css/dark/templates.css
@@ -2,6 +2,10 @@
     font-weight: 600;
 }
 
+.template-header-name {
+    max-width: 60%;
+}
+
 .collapsible-header-button {
     position: absolute;
     right: 15px;
diff --git a/src/main/resources/static/css/templates.css b/src/main/resources/static/css/templates.css
index 4f56a863e34b42c78020d34321ff815ab2b33193..2a9b1342932341fef8bd25f5b1e262d2e2edf3c5 100644
--- a/src/main/resources/static/css/templates.css
+++ b/src/main/resources/static/css/templates.css
@@ -2,9 +2,14 @@
     font-weight: 600;
 }
 
+.template-header-name {
+    max-width: 60%;
+}
+
 .collapsible-header-button {
     position: absolute;
     right: 15px;
     top: 8px;
     font-weight: bold;
-}
\ No newline at end of file
+}
+
diff --git a/src/main/resources/templates/templates/selectTemplate.ftl b/src/main/resources/templates/templates/selectTemplate.ftl
index 7b14cc19df938ec1e1d9d98134fb5752b809d463..d5dfc3b4d2c859d864abbb7b04039a3da26149dd 100644
--- a/src/main/resources/templates/templates/selectTemplate.ftl
+++ b/src/main/resources/templates/templates/selectTemplate.ftl
@@ -28,7 +28,7 @@
                         <div class="headline center-align">${locale.getString("placeholder")}</div>
                     </div>
                 <#else>
-                    <@templateFunctions.listTemplates templates/>
+                    <@templateFunctions.listTemplates templates false/>
                 </#if>
             </div>
         </main>
diff --git a/src/main/resources/templates/templates/templateFunctions.ftl b/src/main/resources/templates/templates/templateFunctions.ftl
index 6eaabb2c116e40c7e598b259a7d98f4c8e09b54e..aafd6cb0bd511122237f0bce9332ea42c8fc7367 100644
--- a/src/main/resources/templates/templates/templateFunctions.ftl
+++ b/src/main/resources/templates/templates/templateFunctions.ftl
@@ -13,7 +13,7 @@
     </div>
 </#macro>
 
-<#macro listTemplates templates>
+<#macro listTemplates templates isEditable>
     <div class="container">
         <div class="row">
             <div class="col s12">
@@ -22,6 +22,14 @@
                         <li>
                             <div class="collapsible-header bold">
                                 <@templateHeader template/>
+                                <div class="collapsible-header-button">
+                                    <#if isEditable>
+                                        <a href="<@s.url '/templates/${template.ID?c}/edit'/>" class="btn-flat no-padding text-color"><i class="material-icons left">edit</i></a>
+                                        <a href="<@s.url '/templates/${template.ID?c}/requestDelete'/>" class="btn-flat no-padding text-color"><i class="material-icons left">delete</i></a>
+                                    <#else>
+                                        <a href="<@s.url '/templates/${template.ID?c}/select'/>" class="waves-effect waves-light btn budgetmaster-blue"><i class="material-icons left">note_add</i>${locale.getString("title.transaction.new", locale.getString("title.transaction.new.normal"))}</a>
+                                    </#if>
+                                </div>
                             </div>
                             <div class="collapsible-body">
                                 <div class="row no-margin-bottom">
@@ -50,10 +58,7 @@
     <#else>
         <i class="material-icons">payment</i>
     </#if>
-    ${template.getTemplateName()}
-    <div class="collapsible-header-button">
-        <a href="<@s.url '/templates/${template.ID?c}/select'/>" class="waves-effect waves-light btn budgetmaster-blue"><i class="material-icons left">note_add</i>${locale.getString("title.transaction.new", locale.getString("title.transaction.new.normal"))}</a>
-    </div>
+    <div class="truncate template-header-name">${template.getTemplateName()}</div>
 </#macro>
 
 <#macro templateName template>
diff --git a/src/main/resources/templates/templates/templates.ftl b/src/main/resources/templates/templates/templates.ftl
index b26185673b6274b3c6f9ccc2fbb59c49e3076870..5dd39950459095e74c3654bd9d492ced311f3646 100644
--- a/src/main/resources/templates/templates/templates.ftl
+++ b/src/main/resources/templates/templates/templates.ftl
@@ -2,6 +2,8 @@
     <head>
         <#import "../helpers/header.ftl" as header>
         <@header.header "BudgetMaster"/>
+        <@header.style "collapsible"/>
+        <@header.style "templates"/>
         <#import "/spring.ftl" as s>
     </head>
     <body class="budgetmaster-blue-light">
@@ -9,6 +11,7 @@
         <@navbar.navbar "templates" settings/>
 
         <#import "templateFunctions.ftl" as templateFunctions>
+        <#import "../categories/categoriesFunctions.ftl" as categoriesFunctions>
 
         <main>
             <div class="card main-card background-color">
@@ -20,29 +23,13 @@
                 <br>
                 <@templateFunctions.buttons/>
                 <br>
-                <div class="container">
-                    <#if templates?size == 0>
+                <#if templates?size == 0>
+                    <div class="container">
                         <div class="headline center-align">${locale.getString("placeholder")}</div>
-                    <#else>
-                        <table class="bordered">
-                            <thead>
-                                <tr>
-                                    <th>${locale.getString("chart.new.label.name")}</th>
-                                    <th>${locale.getString("chart.actions")}</th>
-                                </tr>
-                            </thead>
-                            <#list templates as template>
-                                <tr>
-                                    <td>${template.getTemplateName()}</td>
-                                    <td>
-                                        <a href="<@s.url '/templates/${template.ID?c}/edit'/>" class="btn-flat no-padding text-color"><i class="material-icons left">edit</i></a>
-                                        <a href="<@s.url '/templates/${template.ID?c}/requestDelete'/>" class="btn-flat no-padding text-color"><i class="material-icons left">delete</i></a>
-                                    </td>
-                                </tr>
-                            </#list>
-                        </table>
-                    </#if>
-                </div>
+                    </div>
+                <#else>
+                    <@templateFunctions.listTemplates templates true/>
+                </#if>
             </div>
 
             <#if currentTemplate??>
@@ -53,7 +40,7 @@
                         <p>${locale.getString("info.text.template.delete", currentTemplate.getName())}</p>
                     </div>
                     <div class="modal-footer background-color">
-                        <a href="<@s.url '/templates/manage'/>" class="modal-action modal-close waves-effect waves-light red btn-flat white-text">${locale.getString("cancel")}</a>
+                        <a href="<@s.url '/templates'/>" class="modal-action modal-close waves-effect waves-light red btn-flat white-text">${locale.getString("cancel")}</a>
                         <a href="<@s.url '/templates/${currentTemplate.getID()?c}/delete'/>" class="modal-action modal-close waves-effect waves-light green btn-flat white-text">${locale.getString("info.title.template.delete")}</a>
                     </div>
                 </div>