Best way to display a number of posts per author

Attributes
1

Hello,

I have a page with a list of authors of a blog. My goal is to show in every author’s card the number of posts that that author has written.

What would be the best way to approach this.

Thanks.

2

Hi @aaron, I would use Finsweet’s Count List Items - Count List Items - Count the number of items in a Webflow CMS Collection List

1 Like
3

Yes, I know that one but that works for collection lists that you want to show the amount of items of in a page.

My use case is more counting the amount of items that are related to a specific item in another collection.

I hope that makes sense.

4

Hey @aaron! We have no solution for this, have you seen if Webflow’s CMS API can be used for this?

5

Hey @aaron my bad!

You could add a field to the Authors collection (e.g. Number of Posts) and display that in the Authors cards on the front end. Then you could setup a Cloudflare Worker to get the Blogs and Author collections via the Webflow CMS API, count the amount of times an author is referenced in the Blogs collection, then update the Number of Posts field for each author. You could then setup a CRON trigger so that the Cloudflare Worker happens every hour or something.

I haven’t tested this, but should be enough to get you started:

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  try {
    const webflowApiKey = 'YOUR_WEBFLOW_API_KEY';
    const siteId = 'YOUR_SITE_ID';
    const authorsCollectionId = 'AUTHORS_COLLECTION_ID';
    const blogsCollectionId = 'BLOGS_COLLECTION_ID';

    const headers = {
      'Authorization': `Bearer ${webflowApiKey}`,
      'Accept-Version': '1.0.0',
      'Content-Type': 'application/json',
    };

    // Fetch all authors
    const authorsRes = await fetch(`https://api.webflow.com/collections/${authorsCollectionId}/items`, { headers });
    const authorsData = await authorsRes.json();
    const authors = authorsData.items;

    // Fetch all blog posts
    const blogsRes = await fetch(`https://api.webflow.com/collections/${blogsCollectionId}/items`, { headers });
    const blogsData = await blogsRes.json();
    const blogs = blogsData.items;

    // Count blog posts per author
    const authorBlogCounts = authors.reduce((acc, author) => {
      acc[author._id] = blogs.filter(blog => blog.author._id === author._id).length;
      return acc;
    }, {});

    // Update authors with blog post count
    for (const authorId in authorBlogCounts) {
      const count = authorBlogCounts[authorId];
      await fetch(`https://api.webflow.com/collections/${authorsCollectionId}/items/${authorId}`, {
        method: 'PATCH',
        headers,
        body: JSON.stringify({
          fields: {
            number_of_posts: count
          }
        })
      });
    }

    console.log('Authors updated successfully');
    return new Response('Authors updated', { status: 200 });
  } catch (error) {
    console.error('Error updating authors:', error);
    return new Response('Error updating authors', { status: 500 });
  }
}

Don’t just copy and paste this though. It’s not completely accurate for the Webflow API.

Alternatively, you could use something like Zapier to update the Number of Posts field. This might need some custom logic but it shouldn’t be too difficult if you’re not comfortable with Cloudflare Workers/APIs.

1 Like
6

I haven’t taken a look at that @Support-Luis but definitely worth the try.

Thank you @yogdog that’s great definitely going to take a look at your detailed solutions and try to see if I can implement it.

2 Likes
7

Great, let us know how you get on, @aaron !

1 Like
8

@aaron how did you get on?