How to display the number of posts in a given tag.
Here’s my routes.yaml file.
collections:
/blog/:
permalink: /blog/{slug}/
template: blog
filter: primary_tag:blog
data: tag.blog
/newsletter/:
permalink: /newsletter/{slug}/
template: newsletter
filter: primary_tag:newsletter
data: tag.newsletter
And here’s the newsletter.hbs file, where I want to show the total number of posts in the newsletter.
<div class="news-feed-header">{{count.posts}} issues</div>
<div class="news-feed">
{{#foreach posts}}
<a class="news-item post-card post" href="{{url}}">
<div class="news-item-content">
<time class="post-content-date" datetime="{{date format="YYYY-MM-DD"}}">{{date format="D MMM YYYY"}}</time>
<h2 class="news-item-title">{{title}}</h2>
<p>{{excerpt}}</p>
</div>
<div class="news-item-img"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 400px, 700px"
style="background-image:url({{img_url feature_image size="m"}});">
</div>
</a>
{{/foreach}}
</div>
Any help would be much appreciated.
PS: I just copied the code for loading an image and tried to use it to load the image as a background for a div
. I’ve no idea what’s the correct way to do something like this and if it works or not. Can someone point me in the right direction here as well. Here’s the code that was used to load the image, provided in the default ghost-starter template.
<img class="gh-card-image"
srcset="{{img_url feature_image size="s"}} 300w,
{{img_url feature_image size="m"}} 600w,
{{img_url feature_image size="l"}} 1000w,
{{img_url feature_image size="xl"}} 2000w"
sizes="(max-width: 1000px) 400px, 700px"
src="{{img_url feature_image size="m"}}"
alt="{{title}}"
/>