Konstrukt
🚨 Konstrukt is now Umbraco UI Builder 🚨
  • Konstrukt Documentation
  • Getting Started
    • Overview
    • Installation
    • Configuration
    • User Interface
  • Guides
    • Creating your first integration
  • Areas
    • Overview
    • Sections
      • Summary Dashboards
    • Trees
      • Folders
    • Dashboards
    • Context Apps
  • Collections
    • Overview
    • The Basics
    • List Views
      • Field Views
    • Editors
    • Child Collections
      • Child Collection Groups
  • Searching
    • Overview
    • Searchable Properties
  • Filtering
    • Overview
    • Global Filters
    • Data Views
      • Data Views Builders
    • Filterable Properties
  • Actions
    • Overview
    • The Basics
    • Action Visbility
    • Inbuilt Actions
  • Cards
    • Overview
    • Count Cards
    • Custom Cards
  • Property Editors
    • Overview
    • Entity Picker
  • Advanced
    • Virtual Sub Trees
    • Encrypted Properties
    • Value Mappers
    • Repositories
    • Events
  • Extras
    • Conventions
    • Umbraco Aliases
    • Konstrukt vs UI-O-Matic
    • Known Issues
    • Changelog
Powered by GitBook
On this page
  • Defining a folder
  • Changing a folder alias
  • Changing a folder icon color
  • Adding a sub folder to a folder
  • Adding a collection to a folder
Edit on GitHub
  1. Areas
  2. Trees

Folders

Configuring folders to organise trees in Konstrukt, the back office UI builder for Umbraco.

PreviousTreesNextDashboards

Last updated 3 years ago

A folder can appear in either a tree or as a sub folder to other folders. Folders can contain either other (sub)folders or .

Defining a folder

AddFolder(string name, Lambda folderConfig = null) : KonstruktFolderConfigBuilder

Adds a folder to the current tree with the given name and a default folder icon.

// Example
treeConfig.AddFolder("Settings", folderConfig => {
    ...
});

AddFolder(string name, string icon, Lambda folderConfig = null) : KonstruktFolderConfigBuilder

Adds a folder to the current tree with the given name + icon.

// Example
treeConfig.AddFolder("Settings", "icon-settings", folderConfig => {
    ...
});

Changing a folder alias

SetAlias(string alias) : KonstruktFolderConfigBuilder

Sets the alias of the folder.

Optional: When creating a new folder, an alias is automatically generated from the supplied name for you, however you can use the SetAlias method to override this should you need a specific alias.

// Example
folderConfig.SetAlias("settings");

Changing a folder icon color

SetIconColor(string color) : KonstruktFolderConfigBuilder

Sets the folder icon color to the given color. Possible options are black, green, yellow, orange, blue or red.

// Example
folderConfig.SetIconColor("blue");

Adding a sub folder to a folder

AddFolder(string name, Lambda folderConfig = null) : KonstruktFolderConfigBuilder

Adds a sub folder to the current folder with the given name and a default folder icon.

// Example
folderConfig.AddFolder("Categories", subFolderConfig => {
    ...
});

AddFolder(string name, string icon, Lambda folderConfig = null) : KonstruktFolderConfigBuilder

Adds a sub folder to the current folder with the given name + icon.

// Example
folderConfig.AddFolder("Categories", "icon-tags", subFolderConfig => {
    ...
});

Adding a collection to a folder

AddCollection<TEntityType>(Lambda idFieldExpression, string nameSingular, string namePlural, string description, Lambda collectionConfig = null) : KonstruktCollectionConfigBuilder<TEntityType>

// Example
folderConfig.AddCollection<Person>(p => p.Id, "Person", "People", "A collection of people", collectionConfig => {
    ...
});

AddCollection<TEntityType>(Lambda idFieldExpression, string nameSingular, string namePlural, string description, string iconSingular, string iconPlural, Lambda collectionConfig = null) : KonstruktCollectionConfigBuilder<TEntityType>

// Example
folderConfig.AddCollection<Person>(p => p.Id, "Person", "People", "A collection of people", "icon-umb-users", "icon-umb-users", collectionConfig => {
    ...
});

You define a folder by calling one of the AddFolder methods on a given or parent Folder config builder instance.

Adds a collection to the current folder with the given names and description and default icons. An ID property accessor expression is required so that Konstrukt knows which property is the ID property. See the for more info.

Adds a collection to the current folder with the given names, description and icons. An ID property accessor expression is required so that Konstrukt knows which property is the ID property. See the for more info.

Tree
Collections documentation
Collections documentation
collections
Tree with Settings folder