Orchard之模版开发

简介: 生成新模版之后(参看:Orchard之生成新模板),紧接着就是模版开发了。   一:开发必备之 Shape Tracing 到了这一步,非常依赖一个工具,当然,它也是 Orchard 项目本身的一个 Module,这个工具就是 Shape Tracing。

生成新模版之后(参看:Orchard之生成新模板),紧接着就是模版开发了。

 

一:开发必备之 Shape Tracing

到了这一步,非常依赖一个工具,当然,它也是 Orchard 项目本身的一个 Module,这个工具就是 Shape Tracing。

Shape Tracing:Displays all currently displayed shapes and some information to customize them

好了,不管怎么说,首先,我们来到 Orchard 的后台,Enable 之。这个时候,如果再刷新我们的页面,我们就会见到网页下步存在一个小标签:

image

点击之,出现:

image

举个例子来说 shape tracing 的重要性,比如,我们创建了一个 List(参考:Orchard之创建列表),现在显式为:

image

我们需要修改该页面的显式效果,就需要在新模版下创建对应 content 或 part 的 cshtml,然后在这个 view 中修改显式,这个时候,我们就得知道怎么创建它,这包括:

1:视图名字怎么命名?

2:视图的Model都有些什么样的属性?

而利用 Shape Tracing 的 Shape 页签的 Alternate 下的 Create 就会很容易创建这个视图,比如,在这里,我们要创建的是列表视图,那么我们就要创建这个 Content-Event.Summary.cshtml,如下:

image

注意,名称中的 Event 是我创建的列表的 Id 号,在 Orchard 后台的 Content 定义中可以看到。

点击 Create 后,在新模版的 Views 文件夹下就生成了这个文件,

image

现在,我们只要把这个文件在解决方案中引入进来。

 

二:修改 View

接下来,事情就变得简单了,我们可以看到代码如下:

@using Orchard.Utility.Extensions;
@{
    if (Model.Title != null) {
        Layout.Title = Model.Title;
    }

    Model.Classes.Add("content-item");
    var contentTypeClassName = ((string)Model.ContentItem.ContentType).HtmlClassify();
    Model.Classes.Add(contentTypeClassName);
    var tag = Tag(Model, "article");
}
@tag.StartElement
<span style="color:red;"> @Display(Model.Header)</span>
<a href="@Model.ContentItem.AutoroutePart.Path" style="color:red;"> @Model.ContentItem.AutoroutePart.DisplayAlias</a>
        @*@if (Model.Meta != null) {
            <div class="metadata">
                @Display(Model.Meta)
            </div>
        }*@
    @*@Display(Model.Content)*@
    @if(Model.Footer != null) {
        <footer>
            @Display(Model.Footer)
        </footer>
    }
@tag.EndElement

我们只要修改代码文件,这跟修改普通的 HTML 没什么区别了!比如,上面我就注释了不要内容显式,并且把内容标题的文字改成红色,然后效果就能如下了:

image

 

2.1 关于 Display 方法

注意,上面的代码以及上面的图片效果中,我们看到了有两个标题的显式。

要注意,第一个标题,在视图中,我们使用了 orchard 自己提供的 Display 方法来显式的。这样一来,它的样式是什么,怎么显式,就只能由 Orchard 说了算了。

而第二个标题,我们通过 Shape Tracing,跟踪到了 Model 的信息,直接绕开 Display 方法,自己加样式的方式,就灵活了很多了。

image

这样一来,有了 Model 自己的数据,我们就可以爱咋显式就咋显式了。

 

三:主题如何起作用

其实,原理也很简单:

ORCHARD会根据自己的命名规则,去查找对应主题下的视图文件,即 cshtml 文件,如果存在,就以这个 alternate 去展现

当然,这里非常依赖我们视图的名字不能随便瞎起,如果不按照 Orchard 的规则,则 Orchard 找不到合法的文件,就不会正确呈现视图了。那么,如何正确命名文件呢,本文开头第一段已经说了哦。

Creative Commons License本文基于 Creative Commons Attribution 2.5 China Mainland License发布,欢迎转载,演绎或用于商业目的,但是必须保留本文的署名 http://www.cnblogs.com/luminji(包含链接)。如您有任何疑问或者授权方面的协商,请给我留言。
目录
相关文章
|
13天前
|
存储 弹性计算 人工智能
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
2025年9月24日,阿里云弹性计算团队多位产品、技术专家及服务器团队技术专家共同在【2025云栖大会】现场带来了《通用计算产品发布与行业实践》的专场论坛,本论坛聚焦弹性计算多款通用算力产品发布。同时,ECS云服务器安全能力、资源售卖模式、计算AI助手等用户体验关键环节也宣布升级,让用云更简单、更智能。海尔三翼鸟云服务负责人刘建锋先生作为特邀嘉宾,莅临现场分享了关于阿里云ECS g9i推动AIoT平台的场景落地实践。
【2025云栖精华内容】 打造持续领先,全球覆盖的澎湃算力底座——通用计算产品发布与行业实践专场回顾
|
5天前
|
云安全 人工智能 安全
Dify平台集成阿里云AI安全护栏,构建AI Runtime安全防线
阿里云 AI 安全护栏加入Dify平台,打造可信赖的 AI
|
12天前
|
人工智能 自然语言处理 自动驾驶
关于举办首届全国大学生“启真问智”人工智能模型&智能体大赛决赛的通知
关于举办首届全国大学生“启真问智”人工智能模型&智能体大赛决赛的通知
|
8天前
|
人工智能 运维 Java
Spring AI Alibaba Admin 开源!以数据为中心的 Agent 开发平台
Spring AI Alibaba Admin 正式发布!一站式实现 Prompt 管理、动态热更新、评测集构建、自动化评估与全链路可观测,助力企业高效构建可信赖的 AI Agent 应用。开源共建,现已上线!
769 23
|
7天前
|
人工智能 Java Nacos
基于 Spring AI Alibaba + Nacos 的分布式 Multi-Agent 构建指南
本文将针对 Spring AI Alibaba + Nacos 的分布式多智能体构建方案展开介绍,同时结合 Demo 说明快速开发方法与实际效果。
495 37
|
7天前
|
机器学习/深度学习 人工智能 搜索推荐
万字长文深度解析最新Deep Research技术:前沿架构、核心技术与未来展望
近期发生了什么自 2025 年 2 月 OpenAI 正式发布Deep Research以来,深度研究/深度搜索(Deep Research / Deep Search)正在成为信息检索与知识工作的全新范式:系统以多步推理驱动大规模联网检索、跨源证据。
476 41
|
1天前
|
文字识别 监控 物联网
这是我写的实施一地两检的跨境高铁站旅客资料预报系统的系统架构
本文设计了一套基于IAPIS理念的高铁跨境旅客预报与边检联动系统,覆盖青青草原内地与喜羊羊特别行政区间“一地两检”场景。系统在旅客购票后即采集证件、生物特征及行程信息,通过Advance Passenger Info Checker等模块,向出发地和目的地移民管理机构实时推送数据,实现出入境许可预审。支持线上/线下购票、检票、退票全流程管控,结合面部识别、行为追踪技术监控旅客状态,防止滞留或非法通行。列车发车前进行最终核验,确保所有跨境旅客获边检许可。若旅行被中途取消,系统自动改签、退票并通知各方,保障安全与效率。(239字)