GG's Flash Blog

12/09/09

Hello, Google Chrome World! Log for my first Google Chrome extension test.

Permalink 05:51:24 pm, Categories: Google Chrome Extensions, 296 words

Google Chrome now has extensions, and GG now want to have create some Google Chrome extensions ^^

By referring to the Getting Started tutorial and samples on Google Code Labs, I've created my first Google Chrome "Hello, World!" extension. It was much easier than expected.

Steps:

1) Create a folder called mygc_ext01.

2) Create a text file called manifest.json inside mygc_ext01 folder, contains code:

{
"name": "My First Extension",
"version": "1.0",
"description": "The first extension that I made.",
"browser_action": {
"default_icon": "icon.png"
},
"permissions": [
"http://api.flickr.com/"
]
}

3) Prepare an PNG icon called icon.png put into the same folder.
I've tested it with .ico file in my Windows 7, it works.
If we use a .ico icon, we should also change the value for default_icon to our .ico filename (e.g. filename.ico).

4)Now load the extension into Google Chrome.
Click on Tools Google Chrome Tools menu and choose Extensions.
Enable Developer Mode.
Click Load unpacked extension...
Browse for the mygc_ext01 folder, and press OK.
My icon successfully displayed as an extension button on Google Chrome Google Chrome Extension.

5) Edit manifest.json, add popup parameter below default_icon

...
"browser_action": {
"default_icon": "icon.png",
"popup": "mypage.html"
},
...

6) Create a new file called "mypage.html" put into the same folder.
Display something in the html page body.

7) On Google Chrome Extensions Developer Mode, press the Reload link behind My First Extension. And now if I click on my extension button, mypage.html will be displayed in a popup.

I'm planning to create some Google Chrome extension, but for now still need to sort my bunch of idea.

Below is an working example mygc_ext01 where mypage.html contains code to retrieve and display some picture from flickr.

Download:
Google Chrome extension sample code

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

Permalink Share/Save/Bookmark Subscribe Send feedback

Comments, Pingbacks:

No Comments/Pingbacks for this post yet...

Your email address will not be displayed on this site.
Your URL will be displayed.

Allowed XHTML tags: <p, ul, ol, li, dl, dt, dd, address, blockquote, ins, del, span, bdo, br, em, strong, dfn, code, samp, kdb, var, cite, abbr, acronym, q, sub, sup, tt, i, b, big, small>
(Line breaks become <br />)
(Set cookies for name, email and url)
(Allow users to contact you through a message form (your email will NOT be displayed.))

Previous post: It took long path to be approved

XeerSoft - Web-based Integrated Global Business Solution Provider

Accounting, Inventory, Reservation, Transportation, Commission, Point of Sale (POS), CRM, Membership, Time Attendance, Payroll, Human Resource, Manufacturing, Merchandising, Financial, Workflow...
http://www.xeersoft.com


Your ads here

Flash Extensions

GG Components, GG Tools, GG Book pf2, GG Commands, GG FLV Player Panel (FLVpp), GG Key Info Panel (KIP), GG jsWindow...

 << <March 2010> >>
Sun Mon Tue Wed Thu Fri Sat
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      

Search

Categories

Archives

Who's Online?

Account

Syndicate

Donation

If you find GG's Flash extensions or any of our resources useful, help support future development by making a donation.

Ads

Valid XHTML || Valid CSS || Valid RSS || Valid Atom

Copyright © 2006-2009 GGSHOW. All Rights Reserved.
GGSHOW.COM | GGSHOW.NET
eBoaY | tuBabe | syndicater | Nobody's Website | NeverTheLink | NiShiZuiHaoDeNiZhiDaoMa | WorldCoin