如何在 Sitecore MVC link 字段中添加 Bootstrap 图标

Question

我有以下HTML代码：

<a data-toggle="dropdown">Associate Sites<i class="fa fa-angle-down"></i></a>

使用 Sitecore MVC 字段：

 @Html.Sitecore().BeginField("Link Field", new { @data_toggle = "dropdown" })
 @Html.Sitecore().Field("Destination URL", item.Item, new { @data_toggle = "dropdown" })<i class="fa fa-angle-down"></i>
 @Html.Sitecore().EndField()

结果：

<a href="/en" data_toggle="dropdown">Associate Sites</a> <i class="fa fa-angle-down"></i>

预期结果：

<a href="/en" data_toggle="dropdown">Associate Sites<i class="fa fa-angle-down"></i></a>

请帮助我，如何将 Bootstrap 图标集成到 Sitecore 字段中。

Answer 1

您只需要以下内容：

@Html.Sitecore().BeginField("Destination URL", item.Item, new { @data_toggle = "dropdown" })
    <i class="fa fa-angle-down"></i>
@Html.Sitecore().EndField()

这将输出以下内容 HTML:

<a href="/my-url" data_toggle="dropdown">My Page Name
    <i class="fa fa-angle-down"></i>
</a>

由于您显然在解决方案中使用了 Glass Mapper，因此您应该使用此功能而不是使用 Sitecore Field 助手和 "magic strings"

@Html.Glass().Editable(Model, x => x.DestinationURL, 
    string.Format("<a href=\"{0}\" data-toggle=\"dropdown\">{1}<i class=\"fa fa-angle-down\"></i></a>", x.DestinationURL.Url, x.DestinationURL.Text))

如何在 Sitecore MVC link 字段中添加 Bootstrap 图标

How to add Bootstrap icons in Sitecore MVC link fields

asp.net-mvc-4

sitecore

sitecore8