How to get the URLs of the elements returned by getCollection()? | Astro Lounge | Page 1

#

Hi @glad oar. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

You can create URLs for the entries returned by getCollection() by using the slug property of each entry. The slug is a URL-friendly version of the name of the entry. You can map over the entries returned by getCollection() and create a new array with the URLs.

Here is an example of how you can do this:

import { getCollection } from 'astro:content';

const blogEntries = await getCollection('blog');

const blogURLs = blogEntries.map(blogPostEntry => `/my-blog-url/${blogPostEntry.slug}`);

In this example, blogURLs is an array of URLs for each blog post entry. The URL for each entry is created by appending the slug of the entry to a base URL (/my-blog-url/ in this case).

Please note that the base URL you use should match the route where your content is served in your application.

This information is based on the example provided in the Astro documentation (https://docs.astro.build/en/guides/content-collections#using-content-in-astro-templates).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

#

@glad oar kapa.ai is still learning and improving, please let us know how it did by reacting below

#How to get the URLs of the elements returned by getCollection()?

This information is based on the example provided in the Astro documentation (https://docs.astro.build/en/guides/content-collections#using-content-in-astro-templates).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: