Nested pages under a parent page?

Hi, I currently have a 3 pages on my site:

domain.com/page1
domain.com/page2
domain.com/page3

I would like to nest addition pages under a parent page ie:

domain.com/page1/subpage1
domain.com/page1/subpage2

The folder method let’s me assign the slug to be “domain.com/page1” and then add “subpage1” and “subpage2” inside the folder. But how do I create a visible HTML page that uses the slug “domain.com/page1” if it is already claimed by the folder? Am I missing something?

Also, I do NOT want to use a CMS collection to accomplish this.

Hey @adam1 :wave:

This structure is possible. Create a page and a folder then make sure that they have the same slug. Depending on the order they’re created, the slug may get a number appended to the end. If that happens, simply delete the extra characters. Hope that helps. I’ll also include some screenshots below showing the setup. Let me know if you have any questions.

Create a page with the desired name and slug values.

Then create a folder and give it the same value for the slug as the page.

Lastly add subpages inside the folder.

3 Likes

Thanks, Matthew! I didn’t know you could have the same slug for a folder and a page. This is exactly what I needed :raised_hands:

2 Likes

Yeah I didn’t know the folder & page could have the same URL. So amazing, thank you!

1 Like

Hey! do you know how to add slug from parent folder in CMS because cms page has not parent folder features like static page. can you help me? i want to make slug like:- xyz/abc/def/ghi

@Artik_Designer this is not currently possible in Webflow. Please add your vote for collection folders and leave a comment on how the feature would be beneficial for you.

https://wishlist.webflow.com/ideas/WEBFLOW-I-2020

1 Like

@matthewpmunger , thanks for this explanation!

Wondering… is there a way for the navigation link for the parent page to stay highlighted when the user visits any of the child pages?

This is what I’m trying to achieve:

“Work” in the navigation always stays highlighted when you click on any of the child pages of “Work.”

Thanks so much.

There are different ways to approach this in Webflow and it depends on the site. If you can share that would be helpful.

  1. use a combo class to style the parent navigation element
  2. use nested symbols or separate navbars to create a custom nav component for each variation
  3. possibly use custom code to target parent (would need research to know if possible)

I’ve done this in the past using the first two methods. A bit manual of a process but possible.