---
title: Replace a component globally
slug: cms-12/docs/replacing-a-component-globally
docTags: 
createdAt: 2026-08-10T15:56:03.000Z
---

The following example shows how to replace a component for the entire system. This example also shows how to replace the built-in Optimizely Content Management System (CMS) page tree with a custom page list component.

1. Declare a replacement component. Using the definition name of the component you want to replace is important.

```csharp
// A simple component implementation represented with a dijit content pane on the client side
public class MyCustomPageList: ComponentBase {
  public MyCustomPageList(): base("dijit/layout/ContentPane") {
    // Add "Hello World!" as non-persisted content to the dijit content pane
    this.Settings.Add(new Setting("content", "Hello World!", false));
  }
  public override string DefinitionName => new PageTreeComponent().DefinitionName;
}
```

2. Register the component using the IOC container by implementing the `ConfigureContainer` method of `EPiServer.ServiceLocation.IConfigurableModule` in an initialization module.

```csharp
[InitializableModule]
public class InitializationModule: IConfigurableModule {
  public void ConfigureContainer(ServiceConfigurationContext context) {
    context.Services.AddTransient<IComponent, MyCustomPageList>();
  }
  public void Initialize(InitializationEngine context) {}
  public void Uninitialize(InitializationEngine context) {}
  public void Preload(string[] parameters) {}
}
```

This replaces any creation of the `PageTreeComponent` with an instance of the `MyCustomPageList` type that is created by the IOC container.

:::hint{type="info"}
**Note**
An editor has to make a change in edit view to able to see new component.
:::