模版开发手册

基本模版和站点设计

概述

Mambo 模版系统是内容管理系统当中最容易学习的。

模版位于 /templates目录。模版典型的目录结构为:

这是你创建一个模版需要的最少的文件,文件名必须和代码里面的名称保持一致。 注意在 /images目录中没有写出图像的名称,这里一般放置任何的你模版需要的图片, 像背景,banners,等等。让我们大略看一下这些文件。

index.php: 这是模版布局文件。

template_css.css: 模版的 css 样式表。

templateDetails.xml: XML 格式的 metadata 文件。

template_thumbnail.png: 模版的缩略图, 通常大约为 140x90 像素。

布局文件

模版布局文件是一个 PHP 文件,不过大部分是HTML代码,只有少数的PHP代码片段。你不一定精通PHP才能写一个模版文件,你需要的就是能够知道该在哪里引用 Mambo的模版引擎。

模版布局文件主要由 HTML代码组成。在 HTML 框架里面你放入一些可以引用你的网站的数据库的“窗口”。 通常是几个小的“窗口”用来放模块,一个大的“窗口”用来放(类似frontdoor)组件。

鼓励使用 xHTML 语言来写模版。虽然大家还在争论 xHTML是否是未来的主流,但是它很好的符合 XML 标准, HTML 是一个更加宽松的标准。未来 Mambo 的版本将会越来越多的建立在 XML 上,因此现在使用xHTML也许是明智的。

典型的 3栏的布局的index.php 文件一般是:

 

 

让我们大略看一下主要的功能。假设你已经知道一点有关 HTML页面制作的知识,像head tags,body tagstables,等等。

1 : 定义一个有效的 XML 文件。

3 : 避免直接的访问这一个文件,你的模版必须包含这一行。

5-6 : 为页面建立 xHTML 标准。

8 : 配置文件中的站点名称,显示到标题中。

9 : _ISO 是一个特定的常量,用来定义网页的编码方式,它在你的语言文件定义。

10-15 : $my-> id:如果一个用户登录到你的网站,它就是是一个非零的变量。 一个用户登录后,WYSIWYG 编辑器就预先装载。 你可以,如果你愿意, 总是预装载编辑器,但是通常匿名访客不需要添加内容。 这对于你的站点正常浏览在减少了一点代码运行负担。

16 : 插入一些 metadata 区段。

17 : 装载 CSS 样式表。 $mosConfig_live_site 是一个站点绝对网址配置变量。

23 : 在一个表格单元显示站点名字(跨越三栏)

28 : 载入在 "top" 位置中发布的任何模块。 第二个参数的含义:"-1",不依模板CSStablemodule定义,而以模块内部的风格定义显示;  "0"或无参数:默认的而已方式(模板CSS)  "1", 表示模块是水平排列。

33 : 载入在 " left " 位置中发布的任何模块。 这些模块将会在一栏中显示。

36 : 载入组件到你的模版之内,组件由URL来定,例如 index.php?option=com_content将显示内容组件到这个区域中。

39 : 载入在 "right" 位置中被发布的任何模块,这些模块将会在一栏中显示。

CSS样式表

TODO

XML 配置文件

TODO test

缩略图

当你已经完成你的模版, 通过管理后台中的模版管理来安装它。预览站点,做一个屏幕截图,用你喜欢的图形编辑软件编辑,只保留浏览器中看到的部分。 保持成png格式,大小大概140×90象素,保存到你的模版目录(/templates/basic_template)

模版进阶

概述

这一个章包括一些高级功能,比方说隐藏模版栏和管理员模版设计。

隐藏模块

有时如果没有指定给某个区域任何模块,我们应该隐藏这一区域。可以用 mosCountModules 功能隐藏某些区域。

如果 mosCountModules 函数返回大于 1 的值,表格单元格将会被显示。对于某些页面,如果" right" 位置没有放置任何模块,那“right”栏将不显示,这是一个很好的技术,可以增加特定页的水平宽度。

使用CSS类后缀

TODO

文件和函数参考

模版开发人员可以使用下列函数。

mosLoadComponents

语法:

装载一个组件,例如 "横幅广告"

mosCountModules

语法:

计算在 " position_name" 位置中显示模块的个数。

mosLoadModules

语法:

在当前页显示所有指定给 " position_name" 位置的模块。 " style " 参数可以是:


0=(
默认显示) 模块在栏中被显示。 例子如下:

1= 模块水平显示。 每个模块在包装(wrapper)表格的单元格里面显示。例子如下:

-1= 模块原始输出显示,没有标题。 例子如下

-2= 模块以 X- Mambo 的格式显示。 例子如下:

注意,在所有的情形中,可选择的类 " 后缀 " 可以通过模块参数来应用。

mosShowHead

语法:

包含各种不同的header 标签,包括标题标签和一些 meta 标签。

mosMainBody

语法:

显示由URLoption所决定的组件。

后台管理模版

现在管理员模版仍然正在编写。将来的版本中,站点和管理员的模版系统将会合并成同一个API。 然而,下面一些注释作为叁考放在这里。

模块支持

你可以在管理后台模版里面,直接用mosLoadAdminModule载入模块,或在组(group)中, 向网站模版中一样,使用mosLoadAdminModules。举例来说:

mosLoadAdminModule 函数有一个参数, 模块名加上" mod_" 前缀。 例子表格的第一个单元格载入Full Menu模块( 也就是,mod_fullmenu)

在第二个表格单元格里,载入所有的被指定给 " header " 的模块,第二个参数是风格设定:


0=
顺序地显示模块输出

1= "Tab " 中显示每个模块

2= 每个模块放在

标签显示

"header" 模块的格式完全由css控制。举例来说," wrapper1" 风格被定义为:

模块放在简单的 div 标签中。为了在某一栏显示模块,你可以增加一个“宽度属性”并将“显示属性”换成 " inline "

下列的模块对包含在Mambo发行包里面。

  • mod_fullmenu

完整的菜单模块显示传统的 DHTML 后台管理菜单。内容部分和组件动态添加,其他菜单静态地定义。

  • mod_components

组件模块显示组件和其子菜单的完整列表。 当安装了许多组件,多于DHTML菜单可以显示的时候,这个就有用了。

  • mod_latest

最新模块,显示最近添加内容条目。

  • mod_mosmsg

信息模块,显示URL传入的信息。

  • mod_online

用户在线模块,显示登录的用户的数目。

  • mod_pathway

路径模块,显示管理员所在位置。

  • mod_popular

最流行模块,显示最热门的内容条目列表。

  • mod_stats

菜单统计模块,显示一些关于菜单使用的统计。

  • mod_toolbar

工具栏模块,显示图标工具栏。

  • mod_unread

未读信息,显示尚未阅读的私人信息数目。

控制面板

管理后台的控制面板是一个单独的文件, cpanel.php,在模版里面引用。这是一个独立的文件,让你根据不同站点和用户的不同需要,定制个性化屏幕布局配置。

控制面板文件不是必须被引用。 那样的话,控制面板将会只显示任何在 " cpanel" 位置的管理员模块。

cpanel.php 文件可像下列的例子一样的简单:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vip-admin Html v1.0.0.zip 更新时间:2017-01-06 更新日志: 1.该模板最大化保留了原生layui的基础样式,整合行成的一套后台模板。 2.该模板集合了layui插件、datatables插件。 3.该模板使用layui基础样式中的按钮、表单、表格、和选项卡 4.datatables表格和layui表格深度整合,使用更加方便、美观、人性化。 5.扩展了欢迎页面、登录页面。 vip-admin Html v1.0.1.zip 更新时间:2017-02-16 更新日志: 1.优化datatables表格,添加排序图标,点击升序降序更加美观;表格全选优化,全选后所有选中项添加背景颜色,使之选中更加明显。 2.添加echearts图表插件,展示了基本的柱状图和饼图示例。 vip-admin Html v1.1.0.zip 更新时间:2017-02-27 更新日志: 1.登录页面添加头部标题 2.新增tree table 页面 3.新增404页面 4.新增tips提示页面 5.js功能: 具体操作请查看 js/table-tool.js getIds(table对象,获取input为id的属性); deleteAll(ids,请求url,操作成功跳转url,操作失败跳转url); UnixToDate(时间戳,显示年月日时分,加8小时显示正常时间区); 6.该版本已兼容手机浏览 vip-admin Html v1.5.0.zip 更新时间:2017-03-20 1.更新layui框架为最新版1.0.9_rts版本。 2.优化css,样式更加接近vip-admin管理系统v1.0.5。 3.新增效果:导航栏点击栏目右侧添加相应tab选项卡,点击已经生成过的选项卡直接跳转到该选选项卡 4.新增导航栏收缩按钮 5.修改已知BUG vip-admin Html v1.5.1.zip 更新时间:2017-03-21 1.修改浏览器窗口resize时不断闪烁BUG。 感谢:Clannad- vip-admin Html v1.6.0.zip 更新时间:2017-04-25 1.优化CSS、JS 2.新增新的登录、注册页面。 3.新增主题功能,提供默认、纯白、蓝白三种主题配置。 4.导航栏添加图标。 5.修改已知BUG。 vip-admin Html v1.7.0.zip 更新时间:2017-05-21 1.优化主题样式细节。 2.标签新增双击关闭当前标签功能。 3.标签新增右键功能。 4.新增js功能。 详细可查看【frame/static/js】文件夹内的js vip_nav.js 【主页菜单js】 具体功能: 1) main方法 main(请求地址,过滤ID,是否展开,携带参数); 2) top_left方法 top_left(请求地址,过滤ID,是否展开,携带参数); vip_tab.js 【子页面操作父页面选项卡js】 具体功能: 1) add方法 add(操作对象,标签标题,url地址); 2) getThisTabId方法 getThisTabId(); // 返回当前展示页面父级窗口标签的lay-id 3) del方法 del(标签lay-id); vip_table.js 【表格js,该js属于整合】 具体功能: 1) deleteAll方法 deleteAll(ids,请求的url,操作成功跳转url,操作失败跳转url); 2) unixToDate方法 unixToDate(时间戳,是否只显示年月日时分,8); // 返回正常时间 3) getIds方法 getIds(表格对象,每条数据的属性id); // 返回需要的 ids 5.修改已知BUG。 vip-admin Html v1.8.0.zip 更新时间:2017-08-26 1.更新layui-v1.0.9为layui-v2.0.2版本。 2.右键增加关闭全部标签按钮。 3.更新欢迎页面。 4.更新data-table页面和tree-table页面为layui自带table组件。 5.新增js功能。 详细可查看【frame/static/js】文件夹内的js vip_table.js 1) getFullHeight方法 getFullHeight(); // 返回子页面整体高度,用于table组件设置全屏高度 6.修改已知BUG。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值