开发者

Writing a simple chrome extension

开发者 https://www.devze.com 2023-03-14 10:47 出处:网络
I\'m trying to write a simple Chrome extension. I learnt how to write the \"hello world\" extension that Google put out, but how do I write an extension that will actually do something? Nothing online

I'm trying to write a simple Chrome extension. I learnt how to write the "hello world" extension that Google put out, but how do I write an extension that will actually do something? Nothing online seems to explain it well. I know it involves HTML and CSS(? ), but what do I do? Say I want to write an extension that will enlarge everything--do I write an HTML file that does this and stick it in my extension folder? And what do I write in the manifest.json fi开发者_JAVA技巧le so that it actually uses the HTML file?

Also, I'm a total beginner (I don't know HTML, all I know is a bit of Java) if you couldn't tell from the basic-ness of my questions.


In order to interact with the DOM of the site the user is viewing once the extension is installed you need to use content scripts. Look at the added lines in the manifest here: http://code.google.com/chrome/extensions/content_scripts.html

Those lines let you indicate what js and css you want to use for the site and also specify what specific domains with 'matches':

"content_scripts": [
  {
    "matches": ["http://www.google.com/*"],
    "css": ["mystyles.css"],
    "js": ["jquery.js", "myscript.js"]
  }
],


Files needed:

icon.png ( http://www.mediafire.com/imageview.php?quickkey=37phkkdmd1dv1zf&thumb=4 )

manifest.json

popup.html Put all in a folder together.

.

in the manifest.json:

{
  "name": "My First Extension",
  "version": "1.0",
  "description": "The first extension that I made.",
    "browser_action": {
    "default_icon": "icon.png"
  },
  "browser_action": {
    "default_icon": "icon.png",
    "popup": "popup.html"
  }

}

put in popup.html:

hello world

Save both files. go to extentions ( chrome://extensions/ )

And click developer mode. http://snpr.cm/HBuhYF.jpg

Click "load unpacked extention". and locate the folder. It should load fine.

Click on the new extention and see the glory :)


edit, just read your post - you learned a hello world /facepalm

0

精彩评论

暂无评论...
验证码 换一张
取 消