recent_posts.html in blogging-site-theme-0.1.6

- old
+ new
@@ -1,43 +1,45 @@
 <div class="container">
-    <div class="relatedPosts">
+    <div class="recentPosts">
+        {%- if site.posts.size>0 -%}
         <h1 class="related_post_heading">Recent Posts</h1>
+        {%- endif -%}
         <div class="row">
-            {% for recent in site.posts offset:1 limit:3 %}
-            {% if recent.url != page.url %}
-            <div class="col-lg-4 col-md-6 mb-5 card-group">
+            {% assign posts = site.posts | where_exp:"post","post.url != page.url" %}
+            {% for post in posts limit: 3%}
+
+            <div class="col-lg-4 col-md-6 mb-4 card-group">
                 <div class="card h-100">
-                    <a href="{{ recent.url }}">
-                        <img src="{{ recent.image }}" class="card-img-top" alt="{{recent.url}}"
-                            style="width:100%; border-radius: 4px; height: 200px;">
+                    <a href="{{ post.url }}">
+                        <img src="{{ post.image }}" class="card-img-top" height="215px" width="100%" loading="lazy"
+                            alt="">
                     </a>
                     <div class="card-body">
-                        <a class="text-decoration-none text-dark" href="{{ recent.url }}" class="anchor_link">
-                            <h4 class="card-title mb-4 text-left">{{ recent.title }}</h4>
+                        <a class="text-decoration-none text-dark" href="{{ post.url }}" class="anchor_link">
+                            <h4 class="card-title mb-4 text-left">{{ post.title }}</h4>
                         </a>
                     </div>
-                    {% assign author = site.data.blog.authors[recent.author] %}
                     <div class="card-footer bg-white">
                         <div class="wrapfooter">
-                            {% if recent.author %}
+                            {% assign author = site.data.blog.authors[post.author] %}
+
+                            {% if post.author %}
                             <span class="meta-footer-thumb">
-                                <img class="author-thumb" src="{{ author.image }}" alt="{{ author.name }}">
+                                <img class="author-thumb" loading="lazy" src="{{author.image}}" alt="{{ authorName }}">
                             </span>
                             {% endif %}
-
                             <span class="author-meta">
-                                <span class="recent-name">
-                                    <a target="_blank" href="/blog">{{recent.author}}</a>
+                                <span class="post-name">
+                                    <a target="_blank" href="/blog"> {{author.name}}</a>
                                 </span><br>
-                                <span class="post-date">{{recent.date | date_to_string }}</span>
+                                <span class="post-date">{{post.date | date_to_string }}</span>
                             </span>
-                            <span class="post-read-more"><a class="text-dark" href="{{ recent.url }}"
+                            <span class="post-read-more"><a class="text-dark" href="{{ post.url }}"
                                     title="Read Story">Read More</a></span>
                         </div>
                     </div>
                 </div>
             </div>
-            {% endif %}
             {% endfor %}
         </div>
     </div>
 </div>
\ No newline at end of file