Chrome eXtension!

I have been learning and watch about chrome extensions, Where as I thought it may be something difficult. I got the result of even a  Mid-School student can write their own chrome extensions.

Let me start with what is "Chrome Extension". Chrome Extensions are like tiny add-ons where it gives a way to customize your chrome browser.

In this blog I will explain how to create a "Hello World" extension — where we used to hear this first session of the college.

Chrome Extension is just a combined package which contains just a web page. Those who are well and good in web apps., can easily write there own extension.

Manifest.JSON:

Manifest.JSON is the manifest file which contain the configurations like icon, popup page etc…

Here is the manifest.json file of Hello World extension.

manifest.json

Name: Name of the extension

Version: Current version of the extension, which helps to update from the browser.

Default_icon : Will be display in the tool bar.

popup : Its just a html page, will be displayed when click on the "default_icon".

popup.html

popup.html

Creating these two files, store it under a folder with the "default_icon" which here we specified as "icon.png".

We are almost finished with the code part.

What’s next ? Need to load the extension to your browser.

  1. Go to Tools menu -> extensions.
  2. Click on "Develop mode" which you will find in right side.
  3. Click "load unpackaged extension" and select the folder which you saved the files

Thats it ! The extension was ready. And you will find the icon being displayed on right side of the address bar. Click on it and you will find the hello world extension works Cooooool.

helloworld extension

Wow ! We have created a hello world extension.

Isn’t it easy to write your own extension, Then what you waiting for start writing your own extension’s which you feel to have in your browser and make it publish so that other also will get benefit of it.

Here is a nice video, where I have learned :

Here are some link which helps to learn more about chrome extensions.

http://code.google.com/chrome/extensions/getstarted.html

http://blog.chromium.org/

Advertisements