一步一步教你如何制件 ZKEACMS 的扩展组件/插件
前言
如果你还不知道ZKEACMS,不妨先了解一下。
ASP.NET MVC 开源建站系统 ZKEACMS 推荐,从此网站“拼”起来
官方地址:http://www.zkea.net/zkeacms
下载地址:https://github.com/SeriaWei/ASP.NET-MVC-CMS/releases
GitHub:https://github.com/SeriaWei/ASP.NET-MVC-CMS
开源中国社区:http://git.oschina.net/seriawei/ASP.NET-MVC-CMS
用户名,密码:admin
做一个路径导航的组件:
添加一个组件项目
打开Modules目录(~/Modules),找到Standard文件夹,这个是一个标准的组件项目,复制一份,并把名称改为Breadcrumb
进入Breadcrumb文件夹,并把项目名称改为Easy.CMS.Breadcrumb.csproj
使用Visual Studio打开解决方案(ZKEASOFT.CMS.Web),在Modues目录下添加一个已有项目:
找到Easy.CMS.Breadcrumb.csproj并添加:
修改名空间组件名等相关信息
打开Easy.CMS.Breadcrumb的属性,修改程序集名称和名空间为:Easy.CMS.Breadcrumb
把StandardPlug类名改为BreadcrumbPlug,并删除注册路由代码,因为现在要加的这个导航组件不需要
方法说明:
RegistRoute() 这个方法用来注册组件的路由
AdminMenu() 这个方法用来添加后端左测的菜单
InitScript() 这个方法用来整合注册脚本,方便在View中使用
InitStyle() 这个方法用来整合注册样式,方便在View中使用
接下来打开CopyItems.xml文件,并修改内容:
这个文件的作用是把DLL复制到web的bin目录,方便调试,或者也可以直接改生成目录到web的bin目录。
接下来就要开始Coding了
在Models目录下,添加一个BreadcrumbWidget的类,并添加如下代码:
namespace Easy.CMS.Breadcrumb.Models
{
[DataConfigure(typeof(BreadcrumbWidgetMetaData))]
public class BreadcrumbWidget : WidgetBase
{
public bool IsLinkAble { get; set; }
} class BreadcrumbWidgetMetaData : WidgetMetaData<BreadcrumbWidget>
{
protected override void ViewConfigure()
{
base.ViewConfigure();
ViewConfig(m => m.IsLinkAble).AsHidden();
}
}
}
BreadcrumbWidget继承自WidgetBase,并拥有一个自己的属性IsLinkAble,由于现在IsLinkAble暂时没用,所以把它隐藏了。
BreadcrumbWidget这个Entity,默认会对应一个名称为BreadcrumbWidget的表,该表必须要有的字段是:ID和IsLinkAble。
在Service目录下面,添加一个BreadcrumbWidgetService的类,并添加以下代码:
namespace Easy.CMS.Breadcrumb.Service
{
public class BreadcrumbWidgetService : WidgetService<BreadcrumbWidget>
{
private IPageService _pageService; public IPageService PageService
{
get { return _pageService ?? (_pageService = ServiceLocator.Current.GetInstance<IPageService>()); }
} private List<PageEntity> _parentPages; public List<PageEntity> ParentPages
{
get { return _parentPages ?? (_parentPages = new List<PageEntity>()); }
}
public override WidgetPart Display(WidgetBase widget, HttpContextBase httpContext)
{
GetParentPage(httpContext.GetLayout().Page);
return widget.ToWidgetPart(ParentPages);
} void GetParentPage(PageEntity page)
{
ParentPages.Insert(, page);
if (page.ParentId.IsNotNullAndWhiteSpace() && page.ParentId != "#")
{
var parentPage = PageService.Get(m => m.ID == page.ParentId).FirstOrDefault();
if (parentPage != null)
{
GetParentPage(parentPage);
}
}
}
}
}
代码比较简单,目的就是为了取出当前页面的所有父页面,然后将这些页面显示出来,所以,为了,显示,我们需要添加一个View。
在Views目录下,添加一个名为Widget.Breadcrumb的视图:
@model List<Easy.Web.CMS.Page.PageEntity>
<ol class="breadcrumb">
@for (int i = ; i < Model.Count; i++)
{
if (i == Model.Count - )
{
<li class="active">@Model[i].PageName</li>
}
else
{
<li><a href="@Url.Content(Model[i].Url)">@Model[i].PageName</a></li>
}
}
</ol>
与系统整合
添加一个Content目录并往里面添加一张256x256的图片作为该组件的缩略图,该缩略图将会在选择组件时看到。
创建BreadcrumbWidget表
CREATE TABLE BreadcrumbWidget
(
ID NVARCHAR() PRIMARY KEY
NOT NULL ,
IsLinkAble BIT NULL
);
往CMS_WidgetTemplate表里面添加一条记录,告诉系统有一个新的组件:
INSERT INTO dbo.CMS_WidgetTemplate
( Title ,
GroupName ,
PartialView ,
AssemblyName ,
ServiceTypeName ,
ViewModelTypeName ,
Thumbnail ,
[Order] ,
Status
)
VALUES ( N'路径导航' ,
N'1.通用' ,
N'Widget.Breadcrumb' ,
N'Easy.CMS.Breadcrumb' ,
N'Easy.CMS.Breadcrumb.Service.BreadcrumbWidgetService' ,
N'Easy.CMS.Breadcrumb.Models.BreadcrumbWidget' ,
N'~/Modules/Breadcrumb/Content/breadcrumb.png' ,
, )
运行程序试一下吧:
组件字段显示英文怎么办?直接到Language表里面去Update吧,怎么找到它们呢?
SELECT * FROM dbo.Language WHERE Module=N'BreadcrumbWidget'
或者在运行程序之前,用以下脚本初始化多语言文本
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@ActionType', , N'ActionType', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@AssemblyName', , N'AssemblyName', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@CreateBy', , N'CreateBy', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@CreatebyName', , N'创建人', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@CreateDate', , N'创建日期', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@CustomClass', , N'CustomClass', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@CustomStyle', , N'CustomStyle', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@Description', , N'描述', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@FormView', , N'FormView', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@ID', , N'ID', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@IsLinkAble', , N'IsLinkAble', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@IsSystem', , N'IsSystem', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@IsTemplate', , N'保存为模板', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@LastUpdateBy', , N'LastUpdateBy', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@LastUpdateByName', , N'更新人', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@LastUpdateDate', , N'更新日期', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@LayoutID', , N'布局', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@PageID', , N'页面', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@PartialView', , N'模版', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@Position', , N'排序', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@ServiceTypeName', , N'ServiceTypeName', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@Status', , N'状态', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@StyleClass', , N'自定义样式', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@Thumbnail', , N'模板缩略图', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@Title', , N'标题', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@ViewModelTypeName', , N'ViewModelTypeName', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@WidgetName', , N'组件名称', N'BreadcrumbWidget', N'EntityProperty')
INSERT [dbo].[Language] ([LanKey], [LanID], [LanValue], [Module], [LanType]) VALUES (N'BreadcrumbWidget@ZoneID', , N'区域', N'BreadcrumbWidget', N'EntityProperty')
该插件已开放下载:
http://www.zkea.net/zkeacms/extend/detail?id=118
源代码:
https://github.com/SeriaWei/ASP.NET-MVC-CMS/tree/master/Easy.CMS.Web/Modules/Breadcrumb
还有什么不明白的吗?加入我们进一步为你解答
一步一步教你如何制件 ZKEACMS 的扩展组件/插件的更多相关文章
- 一步一步教你如何在linux下配置apache+tomcat(转)
一步一步教你如何在linux下配置apache+tomcat 一.安装前准备. 1. 所有组件都安装到/usr/local/e789目录下 2. 解压缩命令:tar —vxzf 文件名(. ...
- 一步一步教你将普通的wifi路由器变为智能广告路由器
一步一步教你将普通的wifi路由器变为智能广告路由器 相信大家对WiFi智能广告路由器已经不再陌生了,现在很多公共WiFi上网,都需要登录并且验证,这也就是WiFi广告路由器的最重要的功能.大致就是下 ...
- 一步一步教你使用Git
一步一步教你使用Git 互联网给我们带来方便的同时,也时常让我们感到困惑.随便搜搜就出一大堆结果,然而总是有大量的重复和错误.小妖发出的内容,都是自己实测过的,有问题请留言. 现在,你已经安装了Git ...
- 使用WPF教你一步一步实现连连看
使用WPF教你一步一步实现连连看(一) 第一步: 问题,怎样动态的建立一个10*10的grid(布局) for (int i = 0; i < 10; i++){ RowDefinition r ...
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app 转载 作者:jrainlau 链接:https://segmentfault.com/a/1190000005844155 ...
- Ace教你一步一步做Android新闻客户端(一)
复制粘贴了那么多博文很不好意思没点自己原创的也说不出去,现在写一篇一步一步教你做安卓新闻客户端,借此机会也是让自己把相关的技术再复习一遍,大神莫笑,专门做给新手看. 手里存了两篇,一个包括软件视图 和 ...
- 一步一步教你实现iOS音频频谱动画(二)
如果你想先看看最终效果再决定看不看文章 -> bilibili 示例代码下载 第一篇:一步一步教你实现iOS音频频谱动画(一) 本文是系列文章中的第二篇,上篇讲述了音频播放和频谱数据计算,本篇讲 ...
- 一步一步教你实现iOS音频频谱动画(一)
如果你想先看看最终效果再决定看不看文章 -> bilibili 示例代码下载 第二篇:一步一步教你实现iOS音频频谱动画(二) 基于篇幅考虑,本次教程分为两篇文章,本篇文章主要讲述音频播放和频谱 ...
- 通过Dapr实现一个简单的基于.net的微服务电商系统(四)——一步一步教你如何撸Dapr之订阅发布
之前的章节我们介绍了如何通过dapr发起一个服务调用,相信看过前几章的小伙伴已经对dapr有一个基本的了解了,今天我们来聊一聊dapr的另外一个功能--订阅发布 目录:一.通过Dapr实现一个简单的基 ...
随机推荐
- Linux命令详解1--文件和目录管理之文件查找和比较
1. 文件查找 1.1 strings命令 ------- 在对象文件或二进制文件中查找可打印的字符串.字符串是4个或更多可打印的任意序列,以换行或空字符结束. strings命令对识别随机对象文件很 ...
- MySQL数据库篇之索引原理与慢查询优化之一
主要内容: 一.索引的介绍 二.索引的原理 三.索引的数据结构 四.聚集索引与辅助索引 五.MySQL索引管理 六.测试索引 七.正确使用索引 八.联合索引与覆盖索引 九.查询优化神器--explai ...
- Git 将本地代码推到 Coding 远程仓库
1 首先创建文件夹,将要推的项目文件夹拷贝过来,进入文件夹 右键 Git Bash Here 输入以下代码 把这个目录变成git管理的仓库 git init 2 把文件添加到版本库中,使用命令 git ...
- 使用jQuery解析JSON数据-已验证
本文来源于:http://www.cnblogs.com/codeplus/archive/2011/07/18/2109544.html 上例中得到的JSON数据如下,是一个嵌套JSON: {&qu ...
- 解剖Nginx·模块开发篇(2)ngx_http_hello_world_module 模块基本结构定义
elloWorld 是一个典型的 location 模块.什么是 location 模块?在 Nginx 中,根据作用域,有 main 模块.server 模块.location 模块. 1 模块定义 ...
- 关于IOS新手在安装cocoa pods失败,因为ruby版本过低的解决方法+ (void) {升级ruby}
http://blog.csdn.net/zhaoen95/article/details/51995520 现在: 使用 OS 系统, 正在学习iOS 需要配置cocoapods 命令行中显 ...
- java-tip-关于StringBuilder的使用
当我们需要拼接字符串时,通常会使用StringBuilder,这里简单分析下StringBuilder的内部结构. StringBuilder内部是一个char数组,当调用append方法连接字符串时 ...
- jQuery开发者眼中的AngularJS
文章来源:http://blog.jobbole.com/76265/ AngualrJS是一个很贴心的web应用框架.它有很不错的官方文档和示例:经过在现实环境中的测试著名的TodoMVC proj ...
- 基于HTML5的RDP访问实战
基于HTML5的RDP访问实战 1.安装guacamole 2.下载源码 3.安装服务端 安装报错 错误 参考 http://www.remotespark.com/html5.html ...
- Redis学习(2)—— 实例与注释说明[转]
import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.Set; import ...