认识 Dreamweaver 的插件机制
一、初步了解 Dreamweaver 的插件机制 Dreamweaver 各种类型的插件是由 HTML 文件与 JavaScript 脚本构成。
Dreamweaver 的插件制作并不困难,只要熟悉 HTML 言语,对 JavaScript 和 XML 有所认识,就可以创建自己的对象、命令、修改快捷键,扩充新的行为,甚至制作完全属于自己的属性面板。
深奥的东西在这里不作深入的探讨,有兴趣的朋友可以写信给我,与我讨论,共同提高。
现在以简单的实例来介绍制作 Dreamweaver 插件的整个过程。
二、Dreamweaver 插件的制作
在日常的工作中,常常使用到非常多的相同元素,而每次都要手工重复输入或者反复拷贝,这样增加了不少劳动量,浪费了不少时间。
有两种办法可以解决,一把常用的元素做成库元素,二制成插件。此文只介绍插件的制作。有关库元素的知识请网友看相关的文章。
制作 HTML 文件
笔者在某大型网络媒体工作,反复用到的元素分别为下面五个:
1.启动 Dreamweaver 新建一个网页文件,在文件中输入文字并插入图象,设置好需要的链接,如:
注意,请不要设定网页背景颜色、文字格式等,最好任何格式都不设置。标题(Title)是必须的,方便在使用时找寻,如第一个原创图标标题为“原创图标_made by TNT”。
2.为网页取名为 origin.htm ,并保存到 Dreameaver 安装目录下的 ConfigurationObjectsuperTNT 目录中,最后的目录可按个人需要改名。
3.关闭 Dreamweaver 并重新打开,或者按住 Ctrl 键,用鼠标选择 Objects 面板底部的 Reload Extensions 命令, 重新装载插件。
4.按 Ctrl + F2 打开 Object 对象面板,点击 Common 的黑色下拉三角形,发现 Object 增加了一个 superTNT 类。
在第5步中有这样的一个图标,这是因为没有为对象插件按钮指定图象时,Dreamweaver 会以缺省的图标对象图标显示。
我们可以为它制作一个更加漂亮的小图标,只要制作一个 width = 18 pix,Height = 18 pix 的gif图象,取与 HTML 网页文件相同的名字,然后保存到相同的目录就可以了。这个是笔者制作的小图标:
用相同的方法做余下几个常用元素,图标也都一起做好:
打包
1.制作 .mxi 打包文件。
用文本编辑器(如window自带的记事本或者ultraEdit)写一个插件打包文件 .mxi,笔者取名为 editor.mxi,具体代码如下:
<!-- 注释:安装的插件属性、版本信息等 -->
<macromedia-package
name="PConline Objects"
version="1.0"
id="01730"
type="object">
<!-- 注释:作者名称 -->
<author name="superTNT DNA TNTST" />
<!-- 注释:插件适用版本 -->
<products>
<product name="Dreamweaver" version="3" primary="true" required="true" />
</products>
<!-- 注释:显示在 Extension Manage 面板的插件注释 -->
<description>
<![CDATA[
编辑网页中常常用到的标记与文字:原创图标、太平洋网络学院、enet、责编、上下页
]]>
</description>
<ui-access>
<![CDATA[
查找路径: objects -> superTNT -> 图标
]]>
</ui-access>
<!-- 注释:安装文件定义 -->
<files>
<file source="mark.htm" destination="$dreamweaver/Configuration/objects/superTNT" />
<file source="mark.gif" destination="$dreamweaver/configuration/objects/superTNT" />
</files>
<files>
<file source="editor.htm" destination="$dreamweaver/Configuration/objects/superTNT" />
<file source="editor.gif" destination="$dreamweaver/configuration/objects/superTNT" />
</files>
<files>
<file source="enet.htm" destination="$dreamweaver/Configuration/objects/superTNT" />
<file source="enet.gif" destination="$dreamweaver/configuration/objects/superTNT" />
</files>
<files>
<file source="next.htm" destination="$dreamweaver/Configuration/objects/superTNT" />
<file source="next.gif" destination="$dreamweaver/configuration/objects/superTNT" />
</files>
<files>
<file source="origin.htm" destination="$dreamweaver/Configuration/objects/superTNT" />
<file source="origin.gif" destination="$dreamweaver/configuration/objects/superTNT" />
</files>
<configuration-changes>
</configuration-changes>
</macromedia-package>
打包
2.用插件管理器 Extensions Manage 打包封装,做成 .mxp 文件。
打开插件管理器 Extensions Manage File菜单,选择Package Extension命令,找到 editor.mxi 文件,用鼠标点击 OK 按钮。
打包时大家要注意,务使 editor.mxi 和其它的 html 文件与及 gif 图片处于相同的目录中,否则系统提示找不到文件。
3.打包封装完成,弹出打包成功面板:
安装测试
使用插件管理器 Extensions Manage 把 editor.mxp 文件安装进来,以测试插件是否正常运行。安装完成后插件管理器显示如下图:
让我们再来看看安装后的对象面板 superTNT 类:
效果不错吧,有没有心动呢?插件制作如此容易,你还不试着做一个?