diff --git a/templates/components/thread-card-text.html b/templates/components/thread-card-text.html
new file mode 100644
index 0000000..fe36304
--- /dev/null
+++ b/templates/components/thread-card-text.html
@@ -0,0 +1,8 @@
+{{ define "thread-card-text" }}
+  {{ $length := len . }}
+  {{ if gt $length 300 }}
+  <p class="card-text line-break text-break">{{ slice . 0 300 }} ...</p>
+  {{ else }}
+  <p class="card-text line-break text-break">{{ . }}</p>
+  {{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/templates/components/thread-card-title.html b/templates/components/thread-card-title.html
new file mode 100644
index 0000000..2d1f297
--- /dev/null
+++ b/templates/components/thread-card-title.html
@@ -0,0 +1,5 @@
+{{ define "thread-card-title" }}
+  {{ if ne . "" }}
+  <h5 class="card-title">{{ . }}</h5>
+  {{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/templates/components/thread-card.html b/templates/components/thread-card.html
index 1a86f1c..28349c0 100644
--- a/templates/components/thread-card.html
+++ b/templates/components/thread-card.html
@@ -8,17 +8,8 @@
       {{ end }}
 
       <div class="card-body">
-        {{ if ne .Title "" }}
-        <h5 class="card-title">{{.Title}}</h5>
-        {{ end }}
-
-        {{ $textLength := len .Text }}
-        {{ if gt $textLength 300 }}
-        <p class="card-text line-break text-break">{{ slice .Text 0 300 }} ...</p>
-        {{ else }}
-        <p class="card-text line-break text-break">{{.Text}}</p>
-        {{ end }}
-
+        {{ template "thread-card-title" .Title }}
+        {{ template "thread-card-text" .Text }}
         <a href="/{{.ID}}" class="btn btn-outline-primary">Open</a>
       </div>
     </div>