如何在 Kentico 12 Page Builder 中创建 MVC 小部件

Question

上一个上下文问题（上一个问题无处可去，所以我创建了这个新问题来重新开始）：

我正在尝试创建一个名为“带摘要的图像”的小部件。现在，我只是想添加一个属性到它（一个摘要属性将有一个富文本编辑器）。

当我向页面构建器添加新的小部件时，它没有显示为小部件选项：

从这里，您可以看到我已经正确配置了页面构建器（已经添加了一个“富文本”小部件），您可以看到可以添加小部件（“富文本”小部件来自 NuGet我安装的包名为“Kentico.EMS12.MvcComponents.Widget.RichText”)，您可以看到我只有两个可用的小部件（“表单”和“富文本”），这两个都不是我要添加的小部件.

我需要你的帮助来弄清楚为什么我的新小部件没有出现在这个对话框中。

Visual Studio 中的解决方案资源管理器显示了我为这个新小部件创建的所有文件：

这是我的属性 class 的样子：

// ImageWithSummaryProperties.cs
namespace RhythmAgency.KenticoWebsite.Widgets.ImageWithSummary
{
    using Kentico.PageBuilder.Web.Mvc;

    public class ImageWithSummaryProperties : IWidgetProperties
    {
        public string Summary { get; set; }
    }
}

这是我的视图模型的样子：

// ImageWithSummaryViewModel.cs
namespace RhythmAgency.KenticoWebsite.Widgets.ImageWithSummary
{
    public class ImageWithSummaryViewModel
    {
        public string Summary { get; set; }
    }
}

这是我的控制器的样子：

// ImageWithSummaryController.cs
using System.Web.Mvc;
using Kentico.PageBuilder.Web.Mvc;
using RhythmAgency.KenticoWebsite.Widgets.ImageWithSummary;

[assembly: RegisterWidget(
    identifier: "Rhythm.ImageWithSummary",
    controllerType: typeof(ImageWithSummaryController),
    name: "Image with Summary",
    Description = "An image with summary text.",
    IconClass = "icon-l-img-3-cols-3")]

namespace RhythmAgency.KenticoWebsite.Widgets.ImageWithSummary
{
    public class ImageWithSummaryController : WidgetController<ImageWithSummaryProperties>
    {
        public ActionResult Index()
        {
            var properties = GetProperties();
            return PartialView("Widgets/_Rhythm.ImageWithSummary", new ImageWithSummaryViewModel()
            {
                Summary = properties.Summary
            });
        }
    }
}

这是我的观点：

@* _Rhythm.ImageWithSummary.cshtml *@
@using Kentico.PageBuilder.Web.Mvc
@using RhythmAgency.KenticoWebsite.Widgets.ImageWithSummary
@using Kentico.Components.Web.Mvc.InlineEditors
@model ImageWithSummaryViewModel

@if (Context.Kentico().PageBuilder().EditMode)
{
    Html.Kentico().RichTextEditor(nameof(ImageWithSummaryProperties.Summary), null);
}
else
{
    <div class="fr-view">
        @Html.Raw(Html.Kentico().ResolveRichText(Model.Summary))
    </div>
}

我不会过多地关注视图文件，因为我什至无法将小部件添加到页面构建器，所以视图甚至没有机会被调用。

这是我的主视图文件：

@* Views/Home/Index.cshtml *@
@using Kentico.PageBuilder.Web.Mvc
@using Kentico.Web.Mvc

<h1>Rhythm Agency</h1>

@Html.Kentico().EditableArea("main")

我真的不知道为什么这个小部件没有出现在要添加到页面部分的可用小部件列表中。这里有一些额外的上下文：

我正在使用 Kentico 12.0.77。
我试过没有控制器的小部件，现在有控制器。
如您所见，我在控制器 class 文件中注册了小部件（作为程序集属性）。
站点的前端可以很好地呈现富文本小部件。
我在错误日志中没有看到任何相关问题。
我正在使用默认部分。
当我调用EditableArea时，您可以看到我没有对可以使用的小部件进行任何限制。
我使用的是免费版的 Kentico。我怀疑这是一个因素，但以防万一（“升级许可证的好处”link 目前是 404）。
我在 Chrome 的控制台中没有看到任何错误。
我已经阅读了 10 遍有关创建小部件的各种说明。不知道我错过了什么。
我在 Windows 10 上使用 Chrome。
我之前将小部件称为“图像摘要部分”，但我将其重命名为“部分”是一个保留字。

编辑：

有人很好奇为什么这个问题和上一个问题不同，所以这次编辑澄清了这一点。上一个问题是关于我试图仅使用属性 class 来实现的小部件。这个较新的问题使用不同的方法（即使用控制器），这是在 Kentico 中实现小部件的另一种方法。

编辑#2：

有人建议我将小部件注册程序集属性放在 App_Start 文件夹中，我这样做了，但没有帮助：

所以为什么这不起作用仍然是个谜。

Answer 1

要识别控制器和小部件，您需要将控制器放在“/Controllers”文件夹中。我的小部件控制器位于“/Controllers/Widgets”文件夹中。

我遇到的问题包括没有在 class 名称中添加后缀 'Controller' 以及小部件控制器不在“/Controllers”文件夹中的问题。

你不是在单独的项目中工作吗？因为这需要您在 'AssemblyInfo.cs'

中使用以下内容

using CMS;
[assembly: AssemblyDiscoverable]

并确保您已在您的 kentico 项目中启用页面构建器功能。例如：

protected void Application_Start()
{
    ...

    // Gets the ApplicationBuilder instance
    // Allows you to enable and configure Kentico MVC features
    ApplicationBuilder builder = ApplicationBuilder.Current;

    // Enables the preview feature
    builder.UsePreview();

    // Enables the page builder feature
    builder.UsePageBuilder();

    ...
}

如何在 Kentico 12 Page Builder 中创建 MVC 小部件

How to Create an MVC Widget in Kentico 12 Page Builder

kentico

kentico-12

kentico-mvc