#slice content collections
3 messages · Page 1 of 1 (latest)
Hi @paper marsh. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
To display content entries after the third entry, you can use the JavaScript slice() method on the array of entries returned by the getCollection() function. The slice() method returns a shallow copy of a portion of an array into a new array object.
Here's an example of how you can do this:
---
import { getCollection } from 'astro:content';
const allBlogPosts = await getCollection('blog');
const blogPostsAfterThird = allBlogPosts.slice(3);
---
{blogPostsAfterThird.map(post => (
<li>
<a href={`/posts/${post.slug}`}>{post.data.title}</a>
</li>
))}
In this example, slice(3) creates a new array that includes all entries starting from the fourth entry (since array indices start at 0). Then, we use map() to iterate over blogPostsAfterThird and generate HTML for each post.