Umbraco UI Builder
CMSCloudHeartcoreDXP
15.latest
15.latest
  • Umbraco UI Builder Documentation
  • Known Issues
  • Release Notes
  • Getting Started
    • First Steps with UI Builder
    • Requirements
    • Installing Umbraco UI Builder
    • Licensing
    • Configuration
    • User Interface
  • Upgrading
    • Upgrade your UI Builder setup
    • Upgrading Umbraco UI Builder
    • Version Specific Upgrade Notes
    • Migrate from Konstrukt to Umbraco UI Builder
  • How-to Guides
    • Creating your First Integration
  • Areas
    • Explore Areas in UI Builder
    • Sections
      • Summary Dashboards
    • Trees
      • Folders
    • Dashboards
    • Context Apps
  • Collections
    • Work with Collections in UI Builder
    • The Basics
    • List Views
      • Field Views
    • Editors
    • Child Collections
      • Child Collection Groups
      • Retrieve Child Collections
    • Related Collections
    • Entity Identifier Converters
  • Searching
    • Add Search to Your Collections
    • Searchable Properties
  • Filtering
    • Filter Your Data with Ease
    • Global Filters
    • Data Views
      • Data Views Builders
    • Filterable Properties
  • Actions
    • Trigger Actions in UI Builder
    • The Basics
    • Action Visibility
    • Inbuilt Actions
  • Cards
    • Display Insights with Cards
    • Count Cards
    • Custom Cards
  • Property Editors
    • Enhance Input with Property Editors
    • Entity Picker
  • Advanced
    • Ready to go deeper?
    • Virtual Sub Trees
    • Encrypted Properties
    • Value Mappers
    • Repositories
    • Events
  • Miscellaneous
    • Conventions
    • Umbraco Aliases
Powered by GitBook
On this page
  • Option 1: Configuring via a Composer
  • Option 2: Configuring via Program.cs
  • Example Configuration

Was this helpful?

Edit on GitHub
Export as PDF
  1. Getting Started

Configuration

Learn how to configure Umbraco UI Builder in your project using two different approaches.

You can configure Umbraco UI Builder either via a Composer or in the Program.cs.

Option 1: Configuring via a Composer

A Composer is a common approach for registering and configuring services in Umbraco during application startup.

To configure Umbraco UI Builder via a Composer:

  1. Create a file called UIBuilderComposer.cs in your project.

  2. Implement the IComposer interface and add the configuration inside the Compose method:

using Umbraco.Cms.Core.Composing;
using Umbraco.UIBuilder.Extensions;

public class UIBuilderComposer : IComposer
{
   public void Compose(IUmbracoBuilder builder)
    {
       builder.AddUIBuilder(cfg =>
        {
           // Apply your configuration here
        });
    }
}

Option 2: Configuring via Program.cs

You can also configure Umbraco UI Builder directly in Program.cs using the AddUIBuilder extension method.

To configure Umbraco UI Builder:

  1. Open the Program.cs file in your project.

  2. Locate the CreateUmbracoBuilder() method.

  3. Add AddUIBuilder before AddComposers().

builder.CreateUmbracoBuilder()
    .AddBackOffice()
    .AddWebsite()
    .AddUIBuilder(cfg => {
       // Apply your configuration here
    })
    .AddDeliveryApi()
    .AddComposers()
    .Build();

Example Configuration

The AddUIBuilder method accepts a delegate function, allowing you to configure your solution using fluent APIs.

PreviousLicensingNextUser Interface

Last updated 2 months ago

Was this helpful?

For a complete sample configuration, see the article.

Creating your First Integration