Learn how to ship impactful customer journeys with Builder

Announcing Visual Copilot - Figma to production in half the time

Builder.io logo
Contact Sales
Platform
Developers
Contact Sales

Blog

Home

Resources

Blog

Forum

Github

Login

Signup

×

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

in beta

enterprise plans

Builder's Page Hierarchy feature provides a hierarchical view of all URLs from page models within a space. It offers quick navigation and searching capabilities for Builder Pages.

The image below shows the Page Hierarchy view in Builder. In this example, there are Pages at c/docs/ along with other subdirectories, such as guides:

Image of Builder UI with Page Hierarchy selected which means that the pages display according to their URL. There's a note with an arrow pointing to the Page Hierarchy tab that says, "Click Page Hierarchy to display Pages according to URL."

The Page Hierarchy feature offers several benefits for managing and navigating your Builder Pages:

  • Quick navigation: Conveniently browse through your site structure and find specific Pages based on their URL.
  • Content auditing: Get a clear overview of your site's structure, helping you identify gaps or redundancies in your content.
  • URL-based organization: Understand how your Pages are organized based on their URLs, which can be especially helpful for large sites with complex structures.
  • Efficient search: Efficiently find Pages across your entire site by searching with just a portion of the URL.
  • Version management: List all versions of a Page in one place, making it easier to manage different locales, targeted versions, or scheduled variations.

To view your Page Hierarchy:

  1. Go to your Builder Content.
  2. Click on the Page Hierarchy tab. Note that there could be a slight delay as Builder indexes the Pages for the first time.
  3. When all Pages are indexed, your Pages are categorized according to their URL. For example, if your docs are under https://www.your-site.com/docs/, there will be a category called docs that you can expand to show all the Pages that are in /docs/.

The video below shows this process.

When you're in Page Hierarchy mode, search returns results in hierarchical context. For example, if you have several URL paths, such as specials, products, and development, and you search for a term that has Pages in all three, for example "shirt", all content entries with shirt in their URL.

To search in Page Hierarchy mode:

  1. Go to your Builder Content.
  2. Enter your search term in the search field. As an alternative to clicking into the field, you can activate the search with your keyboard by pressing the slash key, /. Press Enter to search.

The search queries the URL string, rather than the name of the Page and returns all versions of that Page, including published and draft versions. Note that top-level Pages display at the root of the hierarchy.

The video below shows the process of searching for any Pages that have the word page in the URL. The search results show in the content list as well as in the Page Hierarchy view.

When searching within the Page Hierarchy, you'll get all versions of a Page that match your search criteria. This includes:

  • Published versions: The current live version of the Page.
  • Draft versions: Any unpublished Pages.
  • Localized versions: Different language or region-specific versions of the same Page.
  • Targeted versions: Variations of a Page designed for specific audience segments.
  • Scheduled variations: Different versions of a Page set to go live at predetermined times.

This comprehensive view of Page versions means you can manage your content more effectively by accessing all related pages in one place.

This document covered displaying and searching Pages in a hierarchical structure based on their URL. For information on organizing other types of content in Builder, visit:

Was this article helpful?

Product

Visual CMS

Theme Studio for Shopify

Sign up

Login

Featured Integrations

React

Angular

Next.js

Gatsby

Get In Touch

Chat With Us

Twitter

Linkedin

Careers

© 2020 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

Newsletter

Get the latest from Builder.io

By submitting, you agree to our Privacy Policy

Product

Platform Overview

Integrations

What's New

Open Source

Builder

Builder

Mitosis

Mitosis

Qwik

Qwik

Partytown

Partytown

Popular Guides

From Design to Code Guide

Composable Commerce Guide

Headless CMS Guide

Headless Commerce Guide

Composable DXP Guide

Design to Code

Resources

Blog

Knowledge Base

Community Forum

Partners

Templates

Success Stories

Showcase

Resource Center

Frameworks

React

React

Next

Next.js

Qwik

Qwik

Gatsby

Gatsby

Angular

Angular

Vue

Vue

Svelte

Svelte

Remix logo

Remix

Nuxt

Nuxt

Hydrogen

Hydrogen

See All

© 2024 Builder.io, Inc.

Security

Privacy Policy

SaaS Terms

Security & Compliance

Cookie Preferences

Gartner Cool Vendor 2024