Loading

Orchard Core 文档翻译 (六)HTML

Body (OrchardCore.Html)

Theming

Shapes

将HtmlBodyPart附加到内容类型时,将呈现以下形状(Shapes)

NameDisplay TypeDefault LocationModel Type
HtmlBodyPart Detail Content:5 HtmlBodyPartViewModel
HtmlBodyPart Summary Content:10 HtmlBodyPartViewModel

HtmlBodyPartViewModel

HtmlBodyPartViewModel类提供以下属性。

PropertyTypeDescription
Body string The content that was edited. It might contain tokens.
Html string The HTML content once all tokens have been processed
ContentItem ContentItem The content item of the part
HtmlBodyPart HtmlBodyPart The HtmlBodyPartinstance
TypePartSettings HtmlBodyPartSettings The settings of the part

HtmlBodyPart

HtmlBodyPart上提供了以下属性

NameTypeDescription
Body string The HTML content in the body. It can contain Liquid tags so using it directly might result in unexpected results. Prefer rendering the HtmlBodyPart shape instead
Content The raw content of the part  
ContentItem The content item containing this part  

Editors 

HtmlBody Part编辑器对于每种内容类型可以是不同的。 在内容类型的HtmlBody Part 设置中,只需选择需要使用的设置即可。

有两个预定义的编辑器名称:

  • Default是默认使用的编辑器
  • Wysiwyg是提供WYSIWYG体验的编辑器

Custom Editors

自定义编辑器可能意味着用不同的体验替换预定义的编辑器,或者为用户提供可供选择的新选项。

要创建新的自定义编辑器,需要提供两个形状模板( shape templates),一个用于提供编辑器的名称(如果要覆盖现有编辑器,则为可选),以及用于呈现编辑器的实际HTML格式。

Declaration

要声明新编辑器,请创建名为HtmlBody_Option__{Name}的格式,其中{Name}是您选择的值。 这将由一个名为的文件表示 HtmlBody-{Name}.Option.cshtml.

Sample content:

 

@{
    string currentEditor = Model.Editor;
}
<option value="Wysiwyg" selected="@(currentEditor == "Wysiwyg")">@T["Wysiwyg editor"]</option>

 

HTML Editor

要定义从设置中选择编辑器时要呈现的HTML,可以创建与文件Body-{Name} .Editor.cshtml 对应的名为HtmlBody_Editor __ {Name}的格式。

Sample content:

 

@using OrchardCore.Html.ViewModels;
@model HtmlBodyPartViewModel

<fieldset class="form-group">
    <label asp-for="Body">@T["Body"]</label>
    <textarea asp-for="Body" rows="5" class="form-control"></textarea>
    <span class="hint">@T["The body of the content item."]</span>
</fieldset>

 

覆盖预定义的编辑器

您可以通过创建名为HtmlBody.Editor.cshtml的文件来覆盖默认编辑器的HTML编辑器。 Wysiwyg编辑器是使用名为HtmlBody-Wysiwyg.Editor.cshtml的文件定义的。

鸣谢

Trumbowyg

https://github.com/Alex-D/Trumbowyg
Copyright (c) 2012-2016 Alexandre Demode (Alex-D)
License: MIT

 

原文链接:https://www.cnblogs.com/Qbit/p/9746477.html 

posted @ 2018-10-06 01:27  韩严重  阅读(659)  评论(0编辑  收藏  举报