t

[unreal egret]

@late dune my content collection is called "blog", it contains multiple categories such as "trees", "flowers", "animals", those three are folders. Each folder has index.md file, and also multiple subfolders for individual blog posts, such as post-1, post-2 and so on, which contain index.md.

I want to render those pages, but the code renders only index.md that are inside flowers, animals and trees folders and not subfolders within those folders (post-1, post-2)

import { getCollection } from 'astro:content';

export async function getStaticPaths() {
const blogEntries = await getCollection('blog');
return blogEntries.map(entry => ({
params: { slug: entry.slug },
props: { entry },
}));
}

const { entry } = Astro.props;
const { Content } = await entry.render();

<Content />

[late dune]

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

---

The issue you're experiencing might be due to the way you're querying your content collection. The getCollection() function retrieves entries from the specified collection, but it might not be traversing the subfolders within your categories.

To solve this, you might need to adjust your content collection configuration to ensure that it correctly identifies and includes all the relevant subfolders and their respective index.md files.

Unfortunately, the provided knowledge sources do not contain specific information on how to configure Astro to recursively traverse subfolders within a content collection.

For more detailed guidance, I would recommend referring to the Astro Content Collections documentation (https://docs.astro.build/en/guides/content-collections/).

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

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

[unreal egret]

@late dune My content collection is organized with subdirectories https://docs.astro.build/en/guides/content-collections/#organizing-with-subdirectories

How to render such content collections in [slug].astro

[late dune]

Let me check the knowledge base for you. One moment! :books:

---

To render content collections organized with subdirectories, you can use dynamic routing in Astro. You need to create a new dynamic route to generate HTML pages from your collection entries. Your dynamic route will map the incoming request param (ex: Astro.params.slug in src/pages/blog/[...slug].astro) to fetch the correct entry inside a collection.

Here's an example of how you can do this:

--- 
import { getEntry, render } from 'astro:content';

const { slug } = Astro.params;
const post = await getEntry('blog', slug);
const { Content, headings } = await render(post);
---

<Content />

In this example, getEntry is used to fetch a single entry from the collection. The slug parameter is used to identify the specific entry. The render function is then used to render the content of the entry.

Please note that if your custom slugs contain the / character to produce URLs with multiple path segments, you must use a rest parameter ([...slug]) in the .astro filename for this dynamic routing page.

For more information, you can refer to the Astro documentation on Content Collections (https://docs.astro.build/en/guides/content-collections/#querying-collections) and Astro documentation on Dynamic Routes (https://docs.astro.build/en/guides/routing/#dynamic-routes).

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