快速业务通道

DotNetNuke Skinning Whitepaper(皮肤制作部分)

作者 佚名技术 来源 NET编程 浏览 发布时间 2012-05-21

制作皮肤没有特定的顺序,但如果按如下顺序操作会更好。

设置皮肤开发环境

为了简化皮肤的开发并加快后续打包的速度,建议按如下的文件结构组织文件

\Skins
\SkinName ( 你开发的皮肤包的自定义名称 )
… ( 这里放要发布的皮肤包的zip文件)
\containers ( this is a static name to identify the container files for the skin package )
… ( 与容器相关的所有资源文件 )
\skins ( this is a static name to identify the skin files for the skin package
… ( 与皮肤有关的所有文件 )

例如:

DotNetNuke Skinning Whitepaper(皮肤制作部分)

设计皮肤

The free-form nature of skinning provides almost unlimited creative freedom with your design.设计者通常创建一幅图片作为最初的设计原型( 使用PhoteShop或其他的专业设计工具 ).应当注意的是在原型设计当中应包括所有的用户界面元素,包括静态元素如图片和文本,同时也要包含动态元素,如登录链接、导航栏、菜单等。 but it should also include active elements such as Login links, a navigation/menu system, etc… 由于本系统在运行时动态的加载内容,所以在设计是要为这些内容留出空间。Since this is a portal system which injects dynamic content at runtime, you will need to leave room in your design for this content.

设计结束的时候,设计者就要站到下一步:将图片转换为html文档。如何有效的降图形元素转换为html形式涉及到很多技术问题。HTML展示形式要比自由战士的图片要规整很多而且将图片转换为HTML文档对于最终产品的展现形式非常重要。由于HTML文档本身也有很多动态的属性,所以你也需要处理这些动态的问题。例如, 你学要确定皮肤的某一部分是否根据客户端浏览器的屏幕分辨率缩放或者保持固定宽度。

选择HTML 或ASCX编辑器.

如果你熟悉HTML表格和相关属性并且能处理简单的CSS,你就可以制作皮肤。 所见即所得的编辑器是其变得相当容易。 你可以使用 FrontPage, HotMetal, ColdFusion, DreamWeaver, VS.NET等等,任何你喜欢的编辑器。 ’反正都是HTML。

所有的HTML标记必须是"well formed." 就是说所有的HTML标记都必须闭合。 例如, 你有一个 <TABLE> 标记, 就必须用</TABLE> 闭合。所有的标记的属性的“=”边上不留空格, 属性值必须有双引号( 如<TABLE WIDTH=”200”>… </TABLE> ).通常专业的HTML编辑器会自动处理,但是某些参数设置可能是别的形式,一次最好仔细检查一下。

管理图片

图片是皮肤设计内在的一部分。为了让皮肤引擎能找到你的图片文件,在引用图片的时候你需要使用特殊的格式。将图片文件和皮肤文件放在同一个文件夹里是个好办法。当然也不是必须这么做,因为皮肤引擎能识别你所指定的任何文件夹。

为了让DotNetNuke找到你的图片文件,皮肤上传工具必须在处理皮肤包的时候将图片引用的URL转换为相对路径。这种路径形式能在加载皮肤图片时有最好的性能 (相对路径不需要在运行时每次请求都要进行检测).

皮肤上传工具将会将如下的HTML标记转化为相对路径( 包含在HTML或ASCX 文件中的 ): IMG SRC, TD BACKGROUND, SCRIPT SRC.同时也会处理叠层样式表( CSS )标记: BACKGROUND-IMAGE:URL().为了支持众多HTML编辑器产生的代码,各标记的顺序对于皮肤上传工具并不重要。

DotNetNuke 包含一些静态的图片并不能自皮肤包中设定。这些图片代表应用程序的全局管理功能,存储在网站的/images文件夹下。 在完全灵活的皮肤架构中绝对不应该有静态图片。也就是说在灵活和性能之间应该有一个折中,在这方面DotNetNuke选择了后者。使用静态的管理图片主要有如下几点好处

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号