Opera/extensions/hello

2010年10月22日 (五) 02:22的版本

创建你的第一个Opera Extension, Opera 11 开始支持扩展机制。

1、创建config.xml文件

 <?xml version="1.0" encoding="utf-8"?>
 <widget xmlns="http://www.w3.org/ns/widgets">
	<name>Hello extensions!</name>
	<description>A simple hello world example</description>
  	<author href="http://huihoo.com" email="[email protected]">Allen Long</author>
  	<icon src="hello.png"/>
 </widget>

2、创建extension图标，64×64大小，hello.png

3、加入按钮到Opera工具栏，创建index.html文件，创建18×18图标，hello-button.png

 <!doctype html>
 <html lang="en">
  <head>
    <script>
       window.addEventListener("load", function(){
        var theButton;
        var ToolbarUIItemProperties = {
          title: "Hello World",
          icon: "hello-button.png",
          popup: {
            href: "popup.html",
            width: 110,
            height: 30
          }
        }
        theButton = opera.contexts.toolbar.createItem(ToolbarUIItemProperties);
        opera.contexts.toolbar.addItem(theButton);
      }, false);
    </script>
  </head>
  <body>
  </body>
 </html>

4、创建显示内容，创建popup.html文件

 <!doctype html>
 <html lang="en">
  <head>
  	<title>Hello World!</title>
  	<style>
  		h1 {
  			font: 14px helvetica, arial, sans-serif;
  			text-align: center;
  		 }
  	</style>
  </head>
  <body>
  	<h1>Hello World!</h1>
  </body>
 </html>

5、打包扩展

将所有文件打包成HelloExtension.zip 并重命名为 HelloExtension.oex

6、安装扩展

file://localhost/C:/extensions/HelloExtension.oex 或 http://192.168.1.100/HelloExtension.oex

7、使用扩展，看浏览器的右上角

安装扩展
使用扩展

<discussion>characters_max=300</discussion>

@@ 第1行： / 第1行： @@
 {{top news}}
-创建你的第一个[[Opera]] Extension
+创建你的第一个[[Opera]] Extension, [[Opera/11|Opera 11]] 开始支持扩展机制。
 、创建config.xml文件

Opera/extensions/hello

2010年10月22日 (五) 02:22的版本

个人工具

名字空间

变换

查看

操作

搜索

导航

工具箱