1.在磁盘上创建一个目录,用来放应用的代码和资源

2.在这个目录中,创建一个文本文件,命名为manifest.json,其内容为:

{
  "manifest_version": 2,

  "name": "Getting started example",
  "description": "This extension shows a Google Image search result for the current page",
  "version": "1.0",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "permissions": [
    "activeTab",
    "https://ajax.googleapis.com/"
  ]
}

(这里有360浏览器插件制作教程:据说是翻译的chrome浏览器的)

360浏览器应用开放平台

chrome浏览器插件制作官网

3.在应用(扩展)目录中,创建一个名为popup.html的文本文件,增加一些代码

4.回到扩展管理页面,点击“立即更新扩展程序”按钮,这时会重新加载修改后的应用(扩展)

5.点击应用(扩展)的图标,会弹出一个气泡窗口,显示popup.html文件的内容。

完成!!!

给知乎网站插入一段JavaScript代码:配置json如下:

{

"manifest_version": 2,

"name": "知乎头像放大器",

"description": "查看知乎用户头像的原始尺寸图片",

"version": "1.2.1",

"content_scripts": [{
    "matches": ["https://*.zhihu.com/*"],
    "js": ["js/jquery-2.1.4.min.js", "content_action.js"]
  }],

"permissions": [
    "https://*.zhihu.com/*"
  ],

"icons" : {
    "48" : "icon/48.png",
    "128" : "icon/128.png"
  }
}

chrome谷歌浏览器插件制作简易教程的更多相关文章

  1. chrome 谷歌浏览器插件损坏

      Axure RP Extension for Chrome已停用 CreateTime--2017年7月4日10:19:34Author:Marydon 参考地址:http://blog.csdn ...

  2. woocommerce模板制作简易教程

    woocommerce是wordpress里比较好用的电商解决方案,但是制作woocommerce模板相对比较复杂,如果想用woocommerce来建一个展示型的网站,不带下单功能,我们可以很快就能把 ...

  3. Chrome谷歌浏览器插件-小结

    1.小插件库: Tampermonkey https://chrome.google.com/webstore/detail/tampermonkey-beta/gcalenpjmijncebpfij ...

  4. WordPress插件制作教程概述

    接下来的一段时间里,开始为大家讲解WordPress插件制作系列教程,这篇主要是对WordPress插件的一些介绍和说明,还有一些我们需要注意的地方,以及需要掌握的知识. WordPress插件允许你 ...

  5. 阿里巴巴Java开发规约插件p3c详细教程及使用感受

    阿里巴巴Java开发手册 在进入正题介绍这款插件之前,首先来谈一下<阿里巴巴Java开发手册>,2017年年初,首次公开的阿里官方Java代码规范标准手册可以说是引起了全民(IT界)代码规 ...

  6. Chrome插件制作

    由于网上很难找到关于Chrome插件制作的中文教程,为了总结和方便更多的开发者,本文以最常见的显示效果为browser_action的二维码插件为例,进行相关阐述.前端童鞋开发的话应该很简单的,鄙人是 ...

  7. yformater - chrome谷歌浏览器json格式化json高亮json解析插件

    yformater是一款chrome浏览器插件,用来格式化(高亮)服务端接口返回的json数据. 实际上小菜并不是第一个写这种插件的,但是现有的chrome json格式化插件实在是不太好用,索性小菜 ...

  8. WordPress插件制作教程(八): 最后总结

    WordPress插件教程最后一篇,还是为大家简单的做下总结.这次插件制作教程讲的内容和知识点个人觉得不是很多,因为插件制作不单单是这些内容,它涉及的知识很多很多,不是说你会一些函数就可以做出一个好的 ...

  9. WordPress插件制作教程(一): 如何创建一个插件

    上一篇还是按照之前的教程流程,写了一篇WordPress插件制作教程概述,从这一篇开始就为大家具体讲解WordPress插件制作的内容.这一篇主要说一下插件的创建方法. 相信大家都知道插件的安装文件在 ...

随机推荐

  1. jmeter之连接mysql和SQL Server配置

    下载jdbc驱动 在使用jmeter做性能或自动化测试的时候,往往需要直接对数据库施加压力,或者某些参数只能从数据库获取,这时候就必须使用jmeter连接数据库. 1.下载对应的驱动包 mysql驱动 ...

  2. ubuntu kylin 14.04安装配置MongoDB v2.6.1(转)

    1.获取最新版本 https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-2.6.1.tgz 2.解压并进入bin目录 tar zxvf mongo ...

  3. (转)NIO与AIO,同步/异步,阻塞/非阻塞

    原文地址: http://www.cnblogs.com/enjoy-ourselves/p/3793771.html 1.flip(),compact(),与clear()的使用 flip()内部实 ...

  4. python爬虫学习(6) —— 神器 Requests

    Requests 是使用 Apache2 Licensed 许可证的 HTTP 库.用 Python 编写,真正的为人类着想. Python 标准库中的 urllib2 模块提供了你所需要的大多数 H ...

  5. L2-011. 玩转二叉树

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA28AAAHQCAIAAAC5rsUiAAAgAElEQVR4nO3dzYts953n+foXcpUL0Q

  6. CSS中一些常见的兼容性问题

    CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...

  7. NHibernate之映射文件配置说明

    NHibernate之映射文件配置说明 1. hibernate-mapping 这个元素包括以下可选的属性.schema属性,指明了这个映射所引用的表所在的schema名称.假若指定了这个属性, 表 ...

  8. [开源].NET数据库访问框架Chloe.ORM

    扯淡 13年毕业之际,进入第一家公司实习,接触了 EntityFramework,当时就觉得这东西太牛了,访问数据库都可以做得这么轻松.优雅!毕竟那时还年轻,没见过世面.工作之前为了拿个实习机会混个工 ...

  9. [LeetCode] Serialize and Deserialize BST 二叉搜索树的序列化和去序列化

    Serialization is the process of converting a data structure or object into a sequence of bits so tha ...

  10. NPOI导出数据,设置格式,锁定单元格

    代码包括: 1:导出多个sheet    2:设置单元格格式   3:合并单元格   4:下拉框选项   5:输入数字限制   6:锁定单元格 static void Main(string[] ar ...