主题使得Orchard用户可以按照他们的需要和设计目标自定义渲染网站。模板可以通过Orchard模块执行重写样式表，图片，布局或者任何内容模板的目标。
主题在哪里
一个主题是一个包含一套合适文件的文件夹。这个文件夹必须处在位于你网站根目录的Themes文件夹下面。
TheThemeMachine
名称叫做TheThemeMachine的主题是一个Orchard内置主题。你可以通过这个主题来学习Orchard的主题相关知识。同一些主题一样，你可以在 Themes 文件夹下找到它。
TheThemeMachine.PNG
TheThemeMachine 被设计为一个干净的，时尚的主题。并且是一个不错的学些如何订制或开发新主题的切入点。这篇文章将使用此主题作为例子。
主题的组成结构
这部分将描述一个主题的必备和可选元素。
描述清单
一个有效的主题必须包含一个描述清单（mainfest）。描述清单是一个叫做 Theme.txt 的文本文件，你可以在该主题的根目录下找到它。下面是 TheThemeMachine 的描述清单（mainfest）：
Name: The Theme Machine
Author: jowall, mibach, loudej, heskew
Description: Orchard Theme Machine is a flexible multi-zone theme that provides a solid foundation to build your site. It features 20 collapsible widget zones and is flexible enough to cover a wide range of layouts.
Version: 1.8.1
Tags: Awesome
Website: http://orchardproject.net
Zones: Header, Navigation, Featured, BeforeMain, AsideFirst, Messages, BeforeContent, Content, AfterContent, AsideSecond, AfterMain, TripelFirst, TripelSecond, TripelThird, FooterQuadFirst, FooterQuadSecond, FooterQuadThird, FooterQuadFourth, Footer
这个文件的开始部分给了主题一个有好的名称，描述，作者，和标签。Zones字段提供了一个所有可以被添加到模板或层的空间（zones）名称。各种各样的界面元素可以被注入到空间（zones）中，但是最常用的是部件（widgets）。不是所有的空间都需要列在清单文件中，只有那些打算使用的部件（widgets）。
TheThemeMachineZoneScreenshot.PNG
这个图例展示了19个空间（zones），这比你一般情况下站点所用到的要多。这些空间包header和footer，他们是位于页面顶部和底部的区域。这里有一个导航空间，通常情况下导航菜单会插入到这个空间中。Featured空间通常情况下你会放一个网站的banner在此处。BeforeMain和AfterMain在main zones的上面和下面。AsideFirst 和 AsideSecond都是位于边上的工具条通常位于main content的左边和右边。在页面的正中央有一个Messages 空间是用来发送通知的。跟着BeforeContent的是Content和 AfterContent空间。在页面的底部是TripelFirst，TripelSecond, 和 TripelThird。如果你想有3列在底部的话你可以使用他们。FooterQuad*空间是当你希望有4列的时候使用的。
所有在TheThemeMachine主题中的空间都是可装配的，这意味着将只渲染那些包含内容的空间。
图标或者缩略图
所有的主题都应该包含一个 Theme.png文件。这个图片应该至少为 400x400像素并且代表这个主题在主题画廊（theme gallery）或者在主题管理页面中显示。它通常是一个网站页面所用主题的缩略图。
部件空间预览
部件（widget）区域的预览图片可以被添加到主题中。这个图片应当被放置在主题的根目录中，并且名称需要为ThemeZonePreview.png。这应当是一个400像素宽的显示不同空间和他们名称的图片。你可以在TheThemeMachine中找到例子。
WidgetZonePreview.PNG
静态资源
一个主题通常包含许多静态资源，不如 CSS 样式文件，js，或者图片。这些文件必须在下面文件夹中:
- CSS 文件必须在该主题的 \Styles 文件夹中。
- js文件应当在该主题的 \Scripts 文件夹中。任何放在这个文件夹下的js文件应当是仅和你的主题有关系的自定义脚本文件，不应当是可复用的。可复用的脚本文件应当包含在一个不同的模块中。比如jQuery模块。
- Images should be in \Content\Images folders. If your theme contains few images,
- 图片应当被放在\Content\Images文件夹中。如果你的主题包含少量图片，可以将他们保存在同一层。但是，如果你有大量的图片，推荐你将他们组织在子文件中。
Note 启用文件，每个包含静态资源的文件夹，比如样式文件，图片文件，js都需要包含一个web.config 文件，它包含如下内容：
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="7.00:00:00" />
</staticContent>
<handlers accessPolicy="Script,Read">
<!--
iis7 - for any request to a file exists on disk, return it via native http module.
accessPolicy 'Script' is to allow for a managed 404 page.
-->
<add name="StaticFile" path="*" verb="*" modules="StaticFileModule" preCondition="integratedMode" resourceType="File" requireAccess="Read" />
</handlers>
</system.webServer>
</configuration>
文档
Document.cshtml文件通常不会在主题中被找到，因为需要改动这个文件的情况很少。如文档类型（DOCTYPE）、<head>标签等。主题中如果不包含此文件，默认调用~\Core\Shapes\Views\下的Document.cshtml文件，当然我们也可以把这个文件复制到主题的Views目录下，来重写文档定义
布局
布局是body元素中的最外层形状。举个例子来说，这是一个标准的定义一个主组件区域的位置。你可以在这篇文章中的Markup部分阅读到有关markup在布局中的细节。
一个主题可以包含许多布局文件，即便如此当前布局仅能有一个被支持并且包含在TheThemeMachine主题中，即 Layout.cshtml。举例来说，一个主题可以添加专门的布局，如Layout-Blog.cshtml或者Layout-HomePage.cshtml，他们会被在blog或homepage中被用来代替默认layout。这有一个扩展提供这些布局的形状后补。
对于自己拥有的模块和主题如何提供一个基于订制标准的布局候补例子请看Switching the Layout in Orchard CMS.
形状模板
在Orchard中，当一个Web页面呈现为Html时，出现的
在Orchard中，在一个页面被渲染到HTML之前，它是作为一个树型结构的形状shapes集合（Shapes）建立的。 Shapes相当于一个页面的Model，它里面包含了这个页面上的所有对象，如：区域、菜单、菜单项和Widgets等
每一个shape都可以通过模板渲染，可以在主题中重写。模板与形状有着相同的名字，举个例子，如果Menu.cshtml存在，它用来渲染一个Menu形状。
TheThemeMachine主题有着两套形状模板，BadgeOfHonor 和 Branding，他们使用下面的代码从Layout.cshtml构建并注入到 Header 和 Footer区域中。
// Site name and link to the home page
WorkContext.Layout.Header.Add(New.Branding(), "5");
// Powered by Orchard
WorkContext.Layout.Footer.Add(New.BadgeOfHonor(), "5");
Note 模板是渲染形状的两种方法中的一种。除模板之外，你还可以通过代码定义如何渲染，通过定义一个包含
Shape属性的方法。你可以在CoreShapes.cs中找到这种方法。这通常在模块中完成，但是主题也可以很好的完成。
内容项模板
主题可以通过在它下面的\Views\Items_文件夹中添加模板重写内容项渲染。模板名称应当是 Content-{content type name}.cshtml 或者 Content-{content type name}.{display type}.cshtml.举个例子来说，一个重写博客提交渲染的模板应当为\Views\Items\Content-BlogPost.cshtml，一个重写博客摘要的模板应当为\Views\Items\Content-BlogPost.Summary.cshtml.
部分模板
主题可以重写部分内容的渲染。惯例原则与内容项模板一致。部分模板必须在\Views\Parts中，并且名字为该部分形状的名字。比如，评论的渲染可以通过创建\Views\Parts\Comments.cshtml文件进行重写。
字段模板
字段渲染同样可以被重写。你可以重写一个文本字段（text field）的展现但不能重写一个特殊文本（specific text field）字段的展现。重写一个字段模板，需要在\Views\Fields下创建{field type name}.cshtml 或 {field type name}.{display type}.cshtml 文件。比如，文本字段可以被\Views\Fields\Common.Text.cshtml模板重写。
候补
候补是一个有关系的形状集合，有着相应的模板或者层文件可以使你在主题中控制不同类型内容的渲染。比如，你可以使用候补让home page应用一个层，让子页面使用另一个层，或者你可以使用两种不同的方式渲染元素，一种是元素都在一个页面中，另一种是他们都在一个博客帖子中。
想获取更多信息, 见 Alternates.
重写部件
部件的渲染同样可以被重写。在\Views 中创建一个叫做widget-{widget type}.的模板。举个例子，你可以通过将widget-htmlwidget.cshtml放到 你主题的\Views文件夹中 重写HTML 部件的渲染并且在内容周围添加一个红色的框框。
<div style="border:1px red solid">
@Display(Model.Content)
</div>
OverridingWidgetRendering.PNG
注意这仅仅是一个简单的例子，正常情况下添加一个框架最好用CSS。
布局文件
一个主题可以通过在根目录中包含一个placement.info文件来改变形状的渲染。 placement.info 文件是一个XML文件。下面是一个例子：
<Placement>
<!-- widgets -->
<Place Parts_Blogs_BlogArchives="Content:before"/>
<Place Parts_Blogs_RecentBlogPosts="Content:after"/>
<!-- default positioning -->
<Match ContentType="Blog">
<Match DisplayType="Summary">
<Place Parts_Blogs_Blog_Description="Content:before"
Parts_Blogs_Blog_BlogPostCount="Meta:3"/>
</Match>
</Match>
</Placement>
标记
在每个文件中的标记受你选择的视图引擎约束。在Orchard中的默认视图引擎是Razor (.cshtml files)，
快速指导可以在Template File Syntax Guide.中找到。
在模板内部，Model对象代表当前形状被渲染。这意味着如果你在使用消息形状，它有一个Message 属性，你可以通过在模板内部写@Model.Message来显示它。
Orchard提供Display方法，它可以渲染一个形状。举个例子来说，如果你看到 layout.cshtml文件，你可以看看那些空间是如何用诸如@Display(Model.Content)渲染的。
最后，你同样可以查看看诸如@Html.RegisterScript("mystyle.css") 或者 @Html.RegisterScript("myscript.js")等各种模板。这些注册是必须的因为这些脚本和样式文件是共享资源。相同的link 或者 script元素不应该渲染两次即使是在多种模块或在不同示例中需要相同文件的相同组件中。
主题和代码
多数主题会由一个样式表，少量模板（通常是layouts），和少许图片组成。他们除了在模板文件中包含简单代码之外不存在额外代码。对于更高级的主题，你可能需要提供设置，创建个性化形状，或者在代码中重写形状。
为了解决这些情况，可能需要创建一个类似于模块的主题，并且包含一个.csproj工程文件。它将描述如何编译包含在其中的代码。想要获取更多有关模块开发的信息请看Walkthrough: Writing An Orchard Module 和 Creating a Module with a Simple Text Editor。
网友评论