I would like to change the default blog post list to include the featured image of each post. I copied the contents of the blogPosts and blogPost components to make a new partial.
I changed this section in blogPosts:
<ul class="post-list">
{% for post in posts %}
<li>
<h3><a href="{{ post.url }}">{{ post.title }}</a></h3>
<p class="info">
Posted
{% if post.categories.count %} in {% endif %}
{% for category in post.categories %}
<a href="{{ category.url }}">{{ category.name }}</a>{% if not loop.last %}, {% endif %}
{% endfor %}
on {{ post.published_at|date('M d, Y') }}
</p>
<p class="excerpt">{{ post.summary }}</p>
</li>
{% else %}
<li class="no-data">{{ noPostsMessage }}</li>
{% endfor %}
</ul>To this, which includes the featured images code from blogPost:
{% for post in posts %}
<div class="custom-posts">
{% if post.featured_images.count %}
<div class="posts-image">
{% for image in post.featured_images %}
<a href="{{ post.url }}"><img data-src="{{ image.filename }}" src="{{ image.path }}" alt="{{ image.description }}"></a>
{% endfor %}
</div>
{% endif %}
<div class="posts-info">
{{ post.published_at|date('M d, Y') }} {% if post.categories.count %} in {% endif %}
{% for category in post.categories %}
<a href="{{ category.url }}">{{ category.name }}</a>{% if not loop.last %}, {% endif %}
{% endfor %}
</div>
<div class="posts-text">
<h4><a href="{{ post.url }}">{{ post.title }}</a></h4>
{{ post.summary }}
</div>
</div>
{% endfor %}However, there is one issue. This code now completely removes the visibility of my existing blog post that was originally shown on my front page. My news page still shows the post in the original list format just fine. I am still relatively new to October CMS, so I am having a hard time finding how to fix my problem. Any help would be greatly appreciated. :)
Last updated
