标题:认识 Dreamweaver 的插件机制
只看楼主
tml327
Rank: 1
等 级:新手上路
帖 子:510
专家分:0
注 册:2007-10-30
 问题点数:0 回复次数:0 
认识 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 类:



  效果不错吧,有没有心动呢?插件制作如此容易,你还不试着做一个?
搜索更多相关主题的帖子: Dreamweaver 机制 插件 认识 
2007-12-03 17:13



参与讨论请移步原网站贴子:https://bbs.bccn.net/thread-190115-1-1.html




关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.152355 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved