请注意,本站并不支持低于IE8的浏览器,为了获得最佳效果,请下载最新的浏览器,推荐下载 Chrome浏览器
欢迎光临。交流群:166852192

学会使用设计帮助工作来定制Orchard主题


副标题:自定义Orchard站点辅助工具——Shape Tracing

  Orchard提供了一个Shape Tracing的工具,它可以帮助你定制你的Orchard站点。Designer Tools模块提供了这个工具,你可以通过这个工具来查看网站的各个部分都是怎么呈现的。

Shape Tracing工具入门(Getting Started with Shape Tracing)



若要使用Shape Tracing工具,首先你需要在管理后台中启用Shape Tracing功能。Shape Tracing功能在Designer Tools模块中,如果你还没有安装可以点击这里来下载安装此模块(注意:安装版本和当前Orchard版本相一致,比如我Orchard版本是1.4.0,那就下载和此相对应的版本,如果安装了不适合的版本可以把模块用命令删除,或者直接删除,然后删除dll再重新编译,然后安装合适的版本)。
 
此功能安装并启用后,你再访问网站页面时,你可以在页面底部发现一个Shape Tracing功能区,类似如下:
Shape Tracing功能区通常是折叠的,只有当然点击展开按钮时,Shape Tracing功能区才会显示。比如:
 
打开辅助工具,然后鼠标在页面区域划过,相应位置就会显示高亮显示,如下图所示:
鼠标双击当前区域,就可以在辅助工具中定位当前的位置zone。
在Shape Tracing功能区域的左边一栏显示了你所选的形状。你也可以在这个树形导航中选择其他形状。

在Shape Tracing功能区域的右边显示了你所选形状的一些信息。
如下图所示:

在形状信息窗格中显示了以下信息:
  • 形状(Shape):显示当前所选形状的名称、当前所用模板、当前显示类型,以及可以用候补模板和所用包装。
  • 模型(Model):当前所选形状对应的数据信息。
  • 位置信息(Placement):当前所选形状对应的placement.info文件。
  • 模板(Template):当前所选形状对应的模板代码。
  • Html代码(Html):呈现当前所选形状的Html代码。

列表项说明

1、形状(Shape)



内容说明:
Shape:当前模板名称
Active Template:当前作用的模板名称及地址
Alternate:直接创建候补模板的功能,直接点击“Create”就可以创建相应的候补模板了。点击“Create”后,系统会把当前所用的模板复制到相应目录中,这你就可以通过修改这个模板来定制不同的呈现了。如果你使用Visual Studio,你需将所添加的模板包含到你的项目中,这就更方便编辑了。
想了解形状和候补的信息可查看Orchard是如何呈现内容Orchard中的形状候补(Alternates)


2、模型(Model)

Model中显示了当前所选形状对应的数据信息。 html,conterItem,ConterPart.
点击ConterItem,在栏目导航显示当前Model的地址,然后可以查看当前ConterItem的数据信息。
点击相应属性,可以查看属性下包含的内容及信息,查看当前模板包含的元素 。

3、位置信息(Placement)

当前所选形状对应的placement.info文件。

4、模板(Template)







当前所选形状对应的模板代码。

5、Html代码(Html)

呈现当前所选形状的Html代码
 



可以查看当前页面布局,及html代码等信息。
参考文档:http://docs.orchardproject.net/Documentation/Customizing-Orchard-using-Designer-Helper-Tools

作者原创内容不容易,如果觉得内容不错,请点击右侧“打赏”,赏俩给作者花花,也算是对作者付出的肯定,也可以鼓励作者原创更多更好内容。
更多详情欢迎到QQ群 166852192 交流。