Question about CMSKit, Blazor Support #9735

5 Answer(s)

• 

  0

  AI-Bot created one month ago

  Support Team ABP Agent

  1. Official Configuration for CMS Kit with Blazor

  • CMS Kit (open source and Pro) is officially supported for MVC/Razor Pages and Blazor Server UIs.
  • For Blazor Server, you must add the CMS Kit module to your Blazor project (typically the admin app). The public website (if present) is usually MVC, but you can use Blazor for both admin and public if desired.
  • In a DDD monolith with both Blazor and MVC, ensure the CMS Kit module is referenced in both the Blazor and MVC projects if you want features available in both.
  • After adding the module, enable the required features in your GlobalFeatureConfigurator (in the Domain.Shared project):

  GlobalFeatureManager.Instance.Modules.CmsKit(cmsKit =>
    {
        cmsKit.EnableAll();
    });
  

  For CMS Kit Pro features:

  GlobalFeatureManager.Instance.Modules.CmsKitPro(cmsKitPro =>
    {
        cmsKitPro.EnableAll();
    });
  

  After enabling features, run database migrations.

  2. Widget Support and Configuration in Blazor

  • Widget support (Dynamic Widgets) is available in both MVC and Blazor UIs, but the UI experience and integration points may differ.
  • For Blazor, ensure you have the correct CMS Kit Pro packages installed and referenced in your Blazor project.
  • Widget configuration is done via the admin UI (CMS > Widgets). If the widget dropdown is empty except for "poll", it usually means no widgets are registered or enabled.
  • To register widgets, you must implement and register your widget providers in the application layer. Example:

  public class MyWidgetProvider : DynamicWidgetProvider
    {
        public override void SetWidgets(IDynamicWidgetDefinitionContext context)
        {
            context.Add(new DynamicWidgetDefinition(
                name: "MyWidget",
                displayName: "My Custom Widget",
                viewComponentType: typeof(MyWidgetViewComponent)
            ));
        }
    }
  

  Register your provider in the module:

  Configure<DynamicWidgetOptions>(options =>
    {
        options.Providers.Add<MyWidgetProvider>();
    });
  

  For Blazor, the widget's UI must be implemented as a Blazor component.

  • Place your widget provider and component in the Blazor project (or a shared project referenced by Blazor).

  3. Widget Support in Blazor Public/MVC Scenarios

  • Widgets are supported in Blazor Server UI, but the admin UI for widget management is more mature in MVC. If you use Blazor for public UI, ensure all widget components and providers are available in the Blazor project.
  • If you use MVC for public and Blazor for admin, widgets configured in admin should be available for rendering in public, provided both reference the same CMS Kit module and share the same database.
  • If you experience issues with widgets not appearing, double-check:
    • Widget providers are registered in the correct project.
    • The database is migrated after enabling features.
    • The correct CMS Kit Pro packages are installed in the Blazor project.

  If you require full parity and stability for widgets in public UI, the MVC public site is currently the most stable and feature-complete. Blazor support is available but may require additional integration work, especially for custom widgets.

  Sources:

  • CMS Kit Module documentation
  • CMS Kit Pro Module documentation
  • Dynamic Widget documentation (open source)
  • Dynamic Widget documentation (Pro)

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Save Cancel
• 

  0

  MartinEhv created one month ago

  DynamicWidgetProvider? nothing of that in the docs listed.

  Save Cancel
• 

  0

  MartinEhv created one month ago

  note: for MVC admin solutions the CMSKit seems far more robust, so trying to find what is supported if blazor is used. Template choces are offered.. etc. But perhaps it's the installation that is wrong due to partial blazor support -- or simply it not supported in full ( such as perhaps Widget)

  Save Cancel
• 

  0

  enisn created 20 days ago

  Support Team .NET Developer

  Hi @MartinEhv

  Here is my findings for your questions below;

  TL;DR

  • Admin UI: Blazor Server admin is supported and actively implemented in Volo.CmsKit.Pro.Admin.Blazor.
  • Public UI: MVC/Razor Pages public site is the most complete and stable for built‑in widgets. Blazor public is possible, but you must provide/plug your own Blazor components and registrations for widget rendering.
  • Why your Blazor admin widget dropdown only shows Poll: In Blazor Admin, the widget picker is populated from CmsKitContentWidgetOptions. By default, only Poll is registered for the Blazor admin editor. MVC/Common registers more widgets by default for the MVC pipeline.

  ---

  1) Official configuration for CMS Kit Pro with Blazor

  • Add the Admin Blazor module to your Blazor Server admin app: Volo.CmsKit.Pro.Admin.Blazor (plus its dependencies). It contributes CMS pages like Pages, Blogs, Polls, etc.
  • For the public site:
    • Prefer MVC/Razor Pages for out‑of‑the‑box widget rendering (more complete today).
    • You can implement a Blazor public site, but you’ll need to wire up content widget rendering with Blazor components (see section 2).
  • Enable the global features you need in your Domain.Shared GlobalFeatureConfigurator:

  // Domain.Shared
  public static class GlobalFeatureConfigurator
  {
      public static void Configure()
      {
          GlobalFeatureManager.Instance.Modules.CmsKitPro(cmsKitPro =>
          {
              cmsKitPro.Contact.Enable();
              cmsKitPro.Newsletters.Enable();
              cmsKitPro.PollsFeature.Enable();
              cmsKitPro.UrlShortingFeature.Enable();
              cmsKitPro.PageFeedbackFeature.Enable();
              cmsKitPro.FaqFeature.Enable();
          });
      }
  }
  

  • Also ensure feature toggles are ON (Feature Management) because Admin APIs are guarded with feature requirements, e.g. Polls:

  [RequiresFeature(CmsKitProFeatures.PollEnable)]
  [RequiresGlobalFeature(typeof(PollsFeature))]
  

  Create and run database migrations after enabling features. This is important to ensure the database schema is updated to support the new features.

  ---

  2) Widget support and the correct pattern in Blazor + MVC

  There are two distinct concepts often called “widgets” in CMS Kit Pro:

  • Content Widgets (inserted via markdown as [Widget Type="..."]) used by the content editor and content renderer.
  • Poll Widget Names (a label/placement value assigned to a Poll entity; the admin UI exposes a “Widget” dropdown fed by configuration).

  2.a) Content Widgets (what the Blazor Admin editor shows in its widget dropdown)

  In Blazor Admin, the markdown editor’s widget list comes from CmsKitContentWidgetOptions. By default, the Blazor Admin module only registers the Poll widget:

  Configure<CmsKitContentWidgetOptions>(options =>
  {
      options.AddWidget(null, "Poll", "CmsPollByCode", "CmsPolls", parameterWidgetType: typeof(PollsComponent));
  });
  

  In contrast, the MVC/Common web module registers multiple widgets for the MVC rendering pipeline (FAQ, Poll, PageFeedback, …):

  Configure<CmsKitContentWidgetOptions>(options =>
  {
      options.AddWidget("Faq", "CmsFaq", "CmsFaqOptions");
      options.AddWidget("Poll", "CmsPollByCode", "CmsPolls");
      options.AddWidget("PageFeedback", "CmsPageFeedback", "CmsPageFeedbacks");
      options.AddWidget("PageFeedbackModal", "CmsPageFeedbackModal", "CmsPageFeedbackModals");
  });
  

  That is why in an MVC admin/public you see more widget types by default, while the Blazor Admin editor shows only Poll unless you add more.

  To add more content widgets to the Blazor Admin editor, register them in your app’s module:

  // In your Blazor Admin AppModule.ConfigureServices
  Configure<CmsKitContentWidgetOptions>(options =>
  {
      // Renders a Blazor component for a CMS widget type
      options.AddWidget<MyFaqDisplayComponent>(
          widgetType: "Faq",
          widgetName: "CmsFaq",
          parameterWidgetName: "CmsFaqOptions" // optional editor parameter UI
      );
  
      options.AddWidget<MyPageFeedbackDisplayComponent>(
          widgetType: "PageFeedback",
          widgetName: "CmsPageFeedback",
          parameterWidgetName: "CmsPageFeedbacks"
      );
  });
  

  Notes:

  • widgetType is the value used inside [Widget Type="..."] tags.
  • The display component must be a Blazor ComponentBase that can render the widget at preview/runtime.
  • If you need a parameter editor (a form shown in the modal when inserting the widget), pass parameterWidgetName and optionally a parameterWidgetType component (see how Polls uses PollsComponent).

  The editor then inserts tokens like [Widget Type="CmsFaq" ...] into content. The Blazor Admin preview renders with ContentRender, which uses a render context to compose a ContentFragmentComponent from the fragments:

  public virtual async Task<string> RenderAsync(string content)
  {
      var contentDto = new DefaultContentDto { ContentFragments = await ContentParser.ParseAsync(content) };
      var contentFragment = RenderContext.RenderComponent<ContentFragmentComponent>(
          parameters => parameters.Add(p => p.ContentDto, contentDto));
  
      return contentFragment.Markup;
  }
  

  If your public site is also Blazor, you must similarly ensure your public app knows how to render these widget types (map them via CmsKitContentWidgetOptions and provide the corresponding components).

  2.b) Poll “Widget” dropdown in the Poll management UI

  This dropdown is fed by CmsKitPollingOptions.WidgetNames and returned by GetWidgetsAsync() in the admin app service:

  public Task<ListResultDto<PollWidgetDto>> GetWidgetsAsync()
  {
      return Task.FromResult(new ListResultDto<PollWidgetDto>()
      {
          Items = _cmsKitPollingOptions.WidgetNames
              .Select(n => new PollWidgetDto { Name = n }).ToList()
      });
  }
  

  And the options type is:

  public class CmsKitPollingOptions
  {
      public List<string> WidgetNames { get; set; } = new();
      public void AddWidget(string name) { /* adds unique names */ }
  }
  

  So in your startup, configure named placements you want to appear in the Poll editor’s Widget dropdown:

  Configure<CmsKitPollingOptions>(options =>
  {
      options.AddWidget("Default");
      options.AddWidget("Sidebar");
      options.AddWidget("HomepageHero");
  });
  

  This is separate from content widgets. One is a Poll’s “placement name”, the other is the markdown‐embedded content widget system.

  ---

  3) Should I use Blazor for Public, or MVC?

  • If you want full, stable coverage of built‑in widgets without extra work, keep the public website in MVC/Razor Pages today. The defaults for content widgets are already registered in CmsKitProCommonWebModule.
  • If you choose Blazor Public, you need to:
    • Implement Blazor components that render each widget type you plan to use.
    • Register them via CmsKitContentWidgetOptions in the public app so that content rendering recognizes [Widget Type="..."] tokens at runtime.
    • Keep global features and feature toggles aligned with what your UI exposes.

  ---

  Troubleshooting checklist for “widget dropdown is empty”

  • Verify you’re looking at the right dropdown:
    • Poll management “Widget” dropdown → requires CmsKitPollingOptions names configured.
    • Content editor widget picker → requires CmsKitContentWidgetOptions registrations in the Blazor Admin app.
  • Ensure global features and CmsKitProFeatures.* are enabled (Feature Management and global features).
  • Ensure your Blazor Admin app references Volo.CmsKit.Pro.Admin.Blazor and your public site references either Volo.CmsKit.Pro.Common.Web (MVC) or you have equivalent Blazor registrations.

  ---

  Key source references

  • Admin Blazor registers only Poll for content widgets:

  Configure<CmsKitContentWidgetOptions>(options =>
  {
      options.AddWidget(null, "Poll", "CmsPollByCode", "CmsPolls", parameterWidgetType: typeof(PollsComponent));
  });
  

  • MVC/Common registers Faq, Poll, PageFeedback, PageFeedbackModal for content widgets:

  Configure<CmsKitContentWidgetOptions>(options =>
  {
      options.AddWidget("Faq", "CmsFaq", "CmsFaqOptions");
      options.AddWidget("Poll", "CmsPollByCode", "CmsPolls");
      options.AddWidget("PageFeedback", "CmsPageFeedback", "CmsPageFeedbacks");
      options.AddWidget("PageFeedbackModal", "CmsPageFeedbackModal", "CmsPageFeedbackModals");
  });
  

  • Poll widgets dropdown is fed by CmsKitPollingOptions/GetWidgetsAsync:

  public Task<ListResultDto<PollWidgetDto>> GetWidgetsAsync() { ... }
  

  • Admin APIs are feature‑gated (example):

  [RequiresFeature(CmsKitProFeatures.PollEnable)]
  [RequiresGlobalFeature(typeof(PollsFeature))]
  

  Save Cancel

  1
• 

  0

  MartinEhv created 12 days ago

  Back from holiday -- will consume response in the next days. But it's clear from a quick-skim I think this post will help many who were poking around the edges of configurations. I thank you for your detailed response! Very enlightening.

  Perhaps this thread can turn in to a (?) help note in Studio to guide users to the tech debt after selecting cms kit in the various combinations.

  Thanks again for now. Most excellent response.

  ---

  Followup: Based on the instructions above about properly configuring Blazor Admin solving for why only Poll shows up seems clear and I can test. But it seems there is one other combination I did not document clearly that the public and myself should about. What about CMSKit + Blazor app itself (not enabling/installing the public site in Studio). I would guess/think the secondary topic of needing to roll-your-own support for Blazor would then be true as well and the fact CMSkit is public or not with Blazor is irrelevant. Would that be a fair assessment? or if not, would there be other configurations for that case that should be noted?

  Save Cancel