创建Hello World扩展,需要分为以下几步:
创建一个名为helloworld的目录,
在目录中创建名为manifest.xml的文件,并写入以下内容(需注意,manifest.xml需使用UTF-8无BOM头方式编码)
- <?xml version="1.0" encoding="utf-8"?>
- <extension>
- <id>com.companyname.helloworld</id>
- <name>你好地球</name>
- <show_icon>true</show_icon>
- <description>点击按钮后在气泡中显示Hello World</description>
- <version>0.1</version>
- <request_api_version>1</request_api_version>
- <author>yourname</author>
- </extension>
其中:
- id为扩展的唯一标示,同时用作扩展安装后的目录,要求id格式为类Java库名的命名格式,要求每个扩展在名字前面都要有公司
- 名之类的命名空间。
- name是扩展的名称。
- show_icon为bool类型,表示扩展是否会在工具箱中显示图标。
- description为扩展的简单描述。
- version表示扩展的版本,将作为升级的依据。
- request_api_version值为扩展需要用户浏览器api_version的最小值。如果api_version大于用户浏览器本身的
- api_version,则扩展无法安装。
- author为扩展作者的名字
- 将名为default.ico(1616)以及default-big.png(3232)的图标文件放到文件夹中。最好都是32位色,以达到最佳显示效果。
4.扩展打包 将扩展目录中的所有文件压缩为一个zip文件,并且将后缀名改名为.sext,在搜狗浏览器中双击即可安装
找到安装后的扩展 安装后扩展会被安装在搜狗浏览器数据目录中的Extension目录中(通常为%appdata%\SogouExplorer\Extension)。找到对应你的扩展id的目录,即为扩展的安装目录。后续的开发调试可以在这个目录中进行
为扩展添加点击弹出气泡的功能 编辑扩展安装目录中的manifest.xml,并为extension标签添加popup子标签,添加后如下.并在目录中创建名为popup.html的文件。
- <?xml version="1.0" encoding="utf-8"?>
- <extension>
- <id>com.companyname.helloworld</id>
- <name>你好地球</name>
- <show_icon>true</show_icon>
- <description>点击按钮后在气泡中显示Hello World</description>
- <popup page="popup.html" width="100" height="100"/>
- <author>yourname</author>
- <version>0.1</version>
- <request_api_version>1</request_api_version>
- </extension>
popup标签中的page属性代表气泡使用的html页面(该文件路径为相对扩展所在文件夹的相对路径)width 和height分别代表弹出气泡的初始宽度和高度。
- 编辑popup.html 气泡中的html会用webkit内核展示,因此可以使用html5和css3中的高级功能及特效。但是针对helloworld扩展,似乎不需要这些功能,只需在文件中写入以下代码
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/
- DTD/xhtml1-transitional.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
- </head>
- <body>
- <p>Hello World</p>
- </body>
- </html>
- 大功告成 重启搜狗浏览器后,在工具箱中找到对应你的扩展的图标,左键点击!大功告成~