A critical vulnerability was discovered in React Server Components (Next.js). Our systems remain protected but we advise to update packages to newest version. Learn More

Kristoffer Lindén
Dec 8, 2021
  3402
(0 votes)

Create your own menu to handle your custom plugin

So in CMS 11 when you wrote your plugin you easily add settings to your plugin using GuiPlugin attribute and adding properties using the PlugInProperty attribute.
In CMS 12 that is not longer possible so the best is instead to create your own top menu item with a submenu that contains for example Dashboard and Settings.

The menu provider could look like this:

[MenuProvider]
public class MyPluginMenuProvider : IMenuProvider
{
    private readonly LocalizationService _localizationService;

    public MyPluginMenuProvider(LocalizationService localizationService)
    {
        _localizationService = localizationService;
    }

    public IEnumerable<MenuItem> GetMenuItems()
    {
        var mainMenuItem =
            new UrlMenuItem("My plugin", MenuPaths.Global + "/cms/myplugin", null)
            {
                IsAvailable = context => true,
                SortIndex = SortIndex.Last + 100,
                AuthorizationPolicy = CmsPolicyNames.CmsAdmin
            };

        var dashboardMenuItem =
            new UrlMenuItem(_localizationService.GetString("/Plugin/DisplayName"),
                MenuPaths.Global + "/cms/myplugin/dashboard", "/MyPlugin/Dashboard/Index")
            {
                IsAvailable = context => true,
                SortIndex = 100,
                AuthorizationPolicy = CmsPolicyNames.CmsAdmin
            };

        var settingsMenuItem =
            new UrlMenuItem(_localizationService.GetString("/Plugin/Settings"),
                MenuPaths.Global + "/cms/myplugin/settings", "/MyPlugin/Settings/Index")
            {
                IsAvailable = context => true,
                SortIndex = 200,
                AuthorizationPolicy = CmsPolicyNames.CmsAdmin
            };

        return new List<MenuItem>
        {
            mainMenuItem,
            dashboardMenuItem,
            settingsMenuItem
        };
    }
}

That would give you this look:

Your layout view should look something like this to have the Optimizely menu to render:

@using EPiServer.Framework.Web.Resources
@using EPiServer.Shell.Navigation

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>My Plugin</title>

        <!-- Shell -->
        @ClientResources.RenderResources("ShellCore")

        <!-- LightTheme -->
        @ClientResources.RenderResources("ShellCoreLightTheme")
    </head>

    <body>
        @Html.CreatePlatformNavigationMenu()
        <div @Html.ApplyPlatformNavigation()>
            @RenderBody()
        </div>
    </body>
</html>

When this is done you can easily work with your dashboard and settings functions.

Thanks Scott Reed for enlighting me in this forum post:
https://world.optimizely.com/forum/developer-forum/CMS/Thread-Container/2021/12/admin-plugin--tool-in-cms-12/

You can read more here:
https://world.optimizely.com/documentation/developer-guides/CMS/user-interface/extending-the-navigation/using-menu-providers/

/Kristoffer

Dec 08, 2021

Comments

Please login to comment.
Latest blogs
Looking back at Optimizely in 2025

Explore Optimizely's architectural shift in 2025, which removed coordination cost through a unified execution loop. Learn how agentic Opal AI and...

Andy Blyth | Dec 17, 2025 |

Cleaning Up Content Graph Webhooks in PaaS CMS: Scheduled Job

The Problem Bit of a niche issue, but we are building a headless solution where the presentation layer is hosted on Netlify, when in a regular...

Minesh Shah (Netcel) | Dec 17, 2025

A day in the life of an Optimizely OMVP - OptiGraphExtensions v2.0: Enhanced Search Control with Language Support and Synonym Slots

Supercharge your Optimizely Graph search experience with powerful new features for multilingual sites and fine-grained search tuning. As search...

Graham Carr | Dec 16, 2025

A day in the life of an Optimizely OMVP - Optimizely Opal: Specialized Agents, Workflows, and Tools Explained

The AI landscape in digital experience platforms has shifted dramatically. At Opticon 2025, Optimizely unveiled the next evolution of Optimizely Op...

Graham Carr | Dec 16, 2025