---
title: "Organizing components and patterns with folders"
date: "2026-03-16T13:50:20+00:00"
summary: "Organize components and patterns in Drupal Canvas with folders. Learn to create, rename, delete, and reorder for efficient management."
image:
type: "page"
url: "/acquia-source/organizing-components-and-patterns-folders"
id: "013b22cf-f496-4711-889d-9918b55c8821"
---

Folders in Drupal Canvas enable organization of components, patterns, and code-based components across different sections of the system. They allow controlled creation, modification, reordering, and deletion of folders while maintaining safeguards to prevent accidental data loss. Folders are strictly organizational and do not affect the display, execution, or backend logic of components or patterns.

Folders can be created and managed in the **Components** and **Patterns** tabs in the Library, with each tab maintaining its own independent structure. In addition, folders can be created and managed in the **Code** section to organize code-based components. This folder structure in this section is separate from the folder structure in the tabs in the Library.

Folder structure and indicators
-------------------------------

Each folder includes the following elements:

*   ****Folder name:**** The folder name that provides a unique title to identify and organize components and patterns. 
    
    Note
    
    Folder names must be unique in their respective sections. If a folder with the same name already exists, the system prevents creation and displays an error message.
    
*   **Ellipses button:**  A dropdown menu with the **Rename** and **Delete Folder** options.
    
*   ****Item count:**** A number next to the folder name that indicates the total components and patterns in the folder. The system updates this number when users add or move items.
    
*   ****Expand and collapse control:**** Expand or collapse folders to display or hide the components and patterns in them.
    

Creating folders
----------------

### Creating folders for components

To create a folder for components:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  In the toolbar on the left, click the **Library** (**+**) icon to open the Component Library.
4.  On the **Component** tab, click ****\+ New****.
5.  Select ****Add folder****.
    
    The system displays a new folder row in the list.
    
6.  Enter the folder name in the **New folder** field.
    
7.  Press **Enter** to create the folder.
    

### Creating folders for patterns

To create a folder for patterns:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  In the toolbar on the left, click the **Library** (**+**) icon to open the Component Library.
4.  Click the **Patterns** tab.
5.  Click ****\+ New****.
6.  Select ****Add folder****.
    
    The system displays a new folder row in the list.
    
7.  Enter the folder name in the **New folder** field.
    
8.  Press **Enter** to create the folder.
    

### Creating folders for code-based components

To create a folder for code-based components:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  In the toolbar on the left, click the **Code** (`</>`) icon.
4.  Click ****\+ New****.
5.  Select ****Add folder****.
    
    The system displays a new folder row in the list.
    
6.  Enter the folder name in the **New folder** field.
    
7.  Press **Enter** to create the folder.
    

Renaming a folder
-----------------

To rename a folder:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  Navigate to the section containing the folder that you want to edit. For example, the Components tab, Patterns tab, or Code section.
4.  Locate the folder that you want to rename.
5.  Click the ellipses button for the folder.
6.  Select ****Rename****.
    
7.  Enter the new folder name.
    
8.  Press **Enter** to save the changes.
    

Note

Edits to the folder name do not affect the components and patterns in the folder.

Deleting folders
----------------

To delete a folder:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  Navigate to the section containing the folder that you want to edit. For example, the Components tab, Patterns tab, or Code section.
4.  Locate the folder that you want to delete.
5.  Click the ellipses button.
6.  Select ****Delete folder****.
    

Note

The **Delete folder** option is disabled if the folder contains one or more components and patterns. Users must remove all components and patterns from a folder before they delete it. 

Folder deletion is permanent, and users cannot recover deleted folders.

Reordering folders
------------------

To reorder the folder sequence:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  Navigate to the section containing the folder that you want to move. For example, the Components tab, Patterns tab, or Code section.
4.  Click and hold the folder.
    
5.  Drag the folder to the new location in the list.
    
6.  Drop the folder to change the sequence.
    

Note

This action affects only the folder display order, not the functionality of the components and patterns in the folder.

Moving components and patterns between folders  
------------------------------------------------

Users move components and patterns across the following levels:

*   From the menu list into a folder.
    
*   From a folder to the menu list.
    
*   From one folder to another folder.
    

To move components and patterns between folders:

1.  [Access your site](/node/69836#access-a-site).
    
2.  On the top right, click **Edit** to open Drupal Canvas.
3.  Navigate to the section containing the component or pattern that you want to move. For example, the **Components** tab, **Patterns** tab, or **Code** section.
4.  Click and hold the component or pattern.
    
5.  Drag the component or pattern to the new folder.
    
6.  Drop the component or pattern to complete the move.
    

Note

The component and patterns count indicators update based on movement.

This action affects only the component or pattern location, not the functionality of the items.