Extract common article info footer into an include

The article info footer (article date, "x minute read", and tags) occur in three places (article list, article view, and articles-by-tag). This commit deduplicates the redundant code from these three places into a single include.
nielsenramon · Sep 18, 2019 · 5037395 · 5037395
1 parent 9a05590
commit 5037395
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 58 deletions.
diff --git a/_includes/article/info-footer.html b/_includes/article/info-footer.html
@@ -0,0 +1,21 @@
+<div class="article-list-footer">
+  <span class="article-list-date">
+    {{ include.post.date | date: "%B %-d, %Y" }}
+  </span>
+  <span class="article-list-divider">-</span>
+  <span class="article-list-minutes">
+    {% capture words %}
+      {{ include.post.content | number_of_words }}
+    {% endcapture %}
+    {% unless words contains "-" %}
+      {{ words | plus: 250 | divided_by: 250 | append: " minute read" }}
+    {% endunless %}
+  </span>
+  <span class="article-list-divider">-</span>
+  <div class="article-list-tags">
+    {% for tag in include.post.tags %}
+      {% assign tag_name = site.my_tags | where: "slug", tag | map: "name" | first %}
+      <a href="{{ 'tag/' | relative_url }}{{ tag }}" title="See all posts with tag '{{ tag_name }}'">{{ tag_name }}</a>
+    {% endfor %}
+  </div>
+</div>
diff --git a/_layouts/articles_by_tag.html b/_layouts/articles_by_tag.html
@@ -16,24 +16,7 @@ <h5>{{ post.title }}</h5>
             {{ post.excerpt }}
           {% endif %}
         </p>
-        <div class="article-list-footer">
-          <span class="article-list-date">
-            {{ post.date | date: "%B %-d, %Y" }}
-          </span>
-          <span class="article-list-divider">-</span>
-          <span class="article-list-minutes">
-            {% capture words %}
-              {{ post.content | number_of_words }}
-            {% endcapture %}
-            {% unless words contains "-" %}
-              {{ words | plus: 250 | divided_by: 250 | append: " minute read" }}
-            {% endunless %}
-          </span>
-          <span class="article-list-divider">-</span>
-          {% for tag in post.tags %}
-            <a href="{{ 'tag/' | relative_url }}{{ tag }}" title="See all posts by this tag">{{ tag }}</a>
-          {% endfor %}
-        </div>
+        {% include article/info-footer.html post=post %}
       </li>
     {% endfor %}
   </ul>

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -10,26 +10,7 @@
           <header class="article-header">
             <h1>{{ page.title }}</h1>
             <p>{{ page.description }}</p>
-            <div class="article-list-footer">
-              <span class="article-list-date">
-                {{ page.date | date: "%B %-d, %Y" }}
-              </span>
-              <span class="article-list-divider">-</span>
-              <span class="article-list-minutes">
-                {% capture words %}
-                  {{ page.content | number_of_words }}
-                {% endcapture %}
-                {% unless words contains "-" %}
-                  {{ words | plus: 250 | divided_by: 250 | append: " minute read" }}
-                {% endunless %}
-              </span>
-              <span class="article-list-divider">-</span>
-              <div class="article-list-tags">
-                {% for tag in page.tags %}
-                  <a href="{{ 'tag/' | relative_url }}{{ tag }}">{{ tag }}</a>
-                {% endfor %}
-              </div>
-            </div>
+            {% include article/info-footer.html post=page %}
           </header>
 
           <div class="article-content">

diff --git a/index.html b/index.html
@@ -20,26 +20,7 @@ <h5>
           {{ post.excerpt }}
         {% endif %}
       </p>
-      <div class="article-list-footer">
-        <span class="article-list-date">
-          {{ post.date | date: "%B %-d, %Y" }}
-        </span>
-        <span class="article-list-divider">-</span>
-        <span class="article-list-minutes">
-          {% capture words %}
-            {{ post.content | number_of_words }}
-          {% endcapture %}
-          {% unless words contains "-" %}
-            {{ words | plus: 250 | divided_by: 250 | append: " minute read" }}
-          {% endunless %}
-        </span>
-        <span class="article-list-divider">-</span>
-        <div class="article-list-tags">
-          {% for tag in post.tags %}
-            <a href="{{ 'tag/' | relative_url }}{{ tag }}">{{ tag }}</a>
-          {% endfor %}
-        </div>
-      </div>
+      {% include article/info-footer.html post=post %}
     </li>
   {% endfor %}
   {% if paginator.total_pages > 1 %}