Documentation Menu

Dynamic menu builder documentation

Supported Version

  • Optimizley CMS 12


  • EPiServer.CMS.UI.Core Version = 12.4.0 or later
  • .NET 5 or .NET 6


  • Install the add-on from Optimizley NuGet's source feed
  • Search for the NopStation.DynamicMenuBuilder package from that NuGet. After installing the package, you can see a block named Dynamic Menu Builder.


Usage Guide

  • Create a new single block of Dynamic Menu Builder in the root block folder. It creates a block of Dynamic Menu Builder in the admin UI.

    DynamicMenuBuilder Block

  • Select your desired menu-related settings from Menu Settings such as Text color, Background color, and font weight.
  • From Menu Items, add your menu items which will be visible to the Public UI. Inside the top Menu Url (Master), there can be multiple Sub Menu Urls.

    DynamicMenuBuilder Block Details

  • After all the setup is complete, publish the block.
  • To display the menu, include the @await Component.InvokeAsync("DynamicMenuBuilder") line in your codebase. (Master page is recommended.)

    DynamicMenuBuilder Code

  • Now you're done and ready to go. You can see the menu in the public UI.

    DynamicMenuBuilder PublicUI

  • Customizing Default View Behavior: If you wish to modify the default view behavior, follow these steps:
    1. Extract the zip folder and locate the file at DynamicMenuBuilder/Default.cshtml.
    2. Copy the file to your project's Shared/Components folder.
    3. Customize the design according to your preferences.

      DynamicMenuBuilder CustomizeCode


  • Simplified Dynamic Menu Creation:
    • Aims to streamline the process of creating dynamic menus within Optimizely CMS 12.
    • Minimal developer intervention is required for menu setup.
  • Menu Settings Customization:
    • Configure menu-related settings, including text color, background color, and font weight.
  • Menu Items Management:
    • Add and manage menu items that will be visible in the Public UI.
    • Ability to define multiple sub-menu URLs within the Top Menu URL (Master).
  • Customization of Default View:
    • Option to customize the default view behavior by extracting the view file from the module and placing it in the project's Shared/Components folder.
Book a Meeting