| OLD | NEW |
| 1 <!DOCTYPE html><!-- This page is a placeholder for generated extensions api doc.
Note: | 1 <!DOCTYPE html><!-- This page is a placeholder for generated extensions api doc.
Note: |
| 2 1) The <head> information in this page is significant, should be uniform | 2 1) The <head> information in this page is significant, should be uniform |
| 3 across api docs and should be edited only with knowledge of the | 3 across api docs and should be edited only with knowledge of the |
| 4 templating mechanism. | 4 templating mechanism. |
| 5 3) All <body>.innerHTML is genereated as an rendering step. If viewed in a | 5 3) All <body>.innerHTML is genereated as an rendering step. If viewed in a |
| 6 browser, it will be re-generated from the template, json schema and | 6 browser, it will be re-generated from the template, json schema and |
| 7 authored overview content. | 7 authored overview content. |
| 8 4) The <body>.innerHTML is also generated by an offline step so that this | 8 4) The <body>.innerHTML is also generated by an offline step so that this |
| 9 page may easily be indexed by search engines. | 9 page may easily be indexed by search engines. |
| 10 --><html xmlns="http://www.w3.org/1999/xhtml"><head> | 10 --><html xmlns="http://www.w3.org/1999/xhtml"><head> |
| 11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | 11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
| 12 <link href="css/ApiRefStyles.css" rel="stylesheet" type="text/css"> | 12 <link href="css/ApiRefStyles.css" rel="stylesheet" type="text/css"> |
| 13 <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> | 13 <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> |
| 14 <script type="text/javascript" src="../../../third_party/jstemplate/jstempla
te_compiled.js"> | 14 <script type="text/javascript" src="../../../third_party/jstemplate/jstempla
te_compiled.js"> |
| 15 </script> | 15 </script> |
| 16 <script type="text/javascript" src="js/api_page_generator.js"></script> | 16 <script type="text/javascript" src="js/api_page_generator.js"></script> |
| 17 <script type="text/javascript" src="js/bootstrap.js"></script> | 17 <script type="text/javascript" src="js/bootstrap.js"></script> |
| 18 <title>Tutorial: Getting Started (Hello, World!)</title></head><body> <div id
="container"> | 18 <title>Tutorial: Getting Started (Hello, World!)</title></head><body> <div id
="gc-container" class="labs"> |
| 19 <!-- SUBTEMPLATES: DO NOT MOVE FROM THIS LOCATION --> | 19 <!-- SUBTEMPLATES: DO NOT MOVE FROM THIS LOCATION --> |
| 20 <!-- In particular, sub-templates that recurse, must be used by allowing | 20 <!-- In particular, sub-templates that recurse, must be used by allowing |
| 21 jstemplate to make a copy of the template in this section which | 21 jstemplate to make a copy of the template in this section which |
| 22 are not operated on by way of the jsskip="true" --> | 22 are not operated on by way of the jsskip="true" --> |
| 23 <div style="display:none"> | 23 <div style="display:none"> |
| 24 | 24 |
| 25 <!-- VALUE --> | 25 <!-- VALUE --> |
| 26 <div id="valueTemplate"> | 26 <div id="valueTemplate"> |
| 27 <dt> | 27 <dt> |
| 28 <var>paramName</var> | 28 <var>paramName</var> |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 61 <div> | 61 <div> |
| 62 <div> | 62 <div> |
| 63 </div> | 63 </div> |
| 64 </div> | 64 </div> |
| 65 </dl> | 65 </dl> |
| 66 </dd> | 66 </dd> |
| 67 </div> <!-- /VALUE --> | 67 </div> <!-- /VALUE --> |
| 68 | 68 |
| 69 </div> <!-- /SUBTEMPLATES --> | 69 </div> <!-- /SUBTEMPLATES --> |
| 70 | 70 |
| 71 <a name="top"> </a> | 71 <a id="top"></a> |
| 72 <div id="skipto"> |
| 73 <a href="#gc-pagecontent">Skip to page content</a> |
| 74 <a href="#gc-toc">Skip to main navigation</a> |
| 75 </div> |
| 72 <!-- API HEADER --> | 76 <!-- API HEADER --> |
| 73 <div id="pageHeader"> | 77 <div id="gc-header"> |
| 74 <div id="searchbox"> | 78 <div id="logo"> |
| 75 <form action="http://www.google.com/cse" id="cse-search-box"> | 79 |
| 76 <div> | 80 |
| 81 <img src="images/code_labs_logo.gif" height="43" width="161" alt="Googl
e Code Labs" style="border:0;"> |
| 82 |
| 83 |
| 84 </div> |
| 85 <div id="search"> |
| 86 <div id="searchForm" class="searchForm"> |
| 87 <form action="http://www.google.com/cse" id="cse"> |
| 88 <div id="gsc-search-box"> |
| 77 <input type="hidden" name="cx" value="002967670403910741006:61_cvzfq
tno"> | 89 <input type="hidden" name="cx" value="002967670403910741006:61_cvzfq
tno"> |
| 78 <input type="hidden" name="ie" value="UTF-8"> | 90 <input type="hidden" name="ie" value="UTF-8"> |
| 79 <input type="text" name="q" size="31"> | 91 <input type="text" name="q" size="31"> |
| 80 <input type="submit" name="sa" value="Search"> | 92 <input class="gsc-search-button" type="submit" name="sa" value="Sear
ch"> |
| 81 </div> | 93 </div> |
| 82 </form> | 94 </form> |
| 95 <p> </p> |
| 96 </div> <!-- end searchForm --> |
| 83 | 97 |
| 84 <script type="text/javascript" src="http://www.google.com/jsapi"></scrip
t> | 98 <script type="text/javascript" src="http://www.google.com/jsapi"></scrip
t> |
| 85 <script type="text/javascript">google.load("elements", "1", {packages: "
transliteration"});</script> | 99 <script type="text/javascript">google.load("elements", "1", {packages: "
transliteration"});</script> |
| 86 <script type="text/javascript" src="http://www.google.com/coop/cse/t13n?
form=cse-search-box&t13n_langs=en"></script> | 100 <script type="text/javascript" src="http://www.google.com/coop/cse/t13n?
form=cse&t13n_langs=en"></script> |
| 87 <script type="text/javascript" src="http://www.google.com/coop/cse/brand
?form=cse-search-box&lang=en"></script> | 101 <script type="text/javascript" src="http://www.google.com/coop/cse/brand
?form=cse&lang=en"></script> |
| 88 </div> | 102 </div> <!-- end search --> |
| 89 <div id="pageTitle"> | 103 </div> <!-- end gc-header --> |
| 90 <h1>Tutorial: Getting Started (Hello, World!)</h1> | |
| 91 </div> | |
| 92 </div> <!-- /pageHeader --> | |
| 93 | 104 |
| 94 <div id="pageContent"> | 105 <div id="codesiteContent"> |
| 106 |
| 107 <a id="gc-topnav-anchor"></a> |
| 108 <div id="gc-topnav"> |
| 109 <h1>Google Chrome Extensions (<a href="/labs/">Labs</a>)</h1> |
| 110 <ul id="home" class="gc-topnav-tabs"> |
| 111 <li id="home_link"> |
| 112 <a href="index.html" class="selected" title="Google Chrome Extension
s documentation home page">Home</a> |
| 113 </li> |
| 114 <li id="blog_link"> |
| 115 <a href="http://blog.chromium.org/" title="Chromium blog">Blog</a> |
| 116 </li> |
| 117 <li id="faq_link"> |
| 118 <a href="faq.html" title="Google Chrome Extensions FAQ">FAQ</a> |
| 119 </li> |
| 120 <li id="group_link"> |
| 121 <a href="http://groups.google.com/group/chromium-extensions" title="
Chromium-Extensions group">Group</a> |
| 122 </li> |
| 123 <li id="terms_link"> |
| 124 Terms |
| 125 </li> |
| 126 </ul> |
| 127 </div> <!-- end gc-topnav --> |
| 128 |
| 129 <div class="g-section g-tpl-170"> |
| 95 <!-- SIDENAV --> | 130 <!-- SIDENAV --> |
| 96 <div id="leftNav"> | 131 <div class="g-unit g-first" id="gc-toc"> |
| 97 <ul> | 132 <ul> |
| 98 <li> <a href="index.html">Home</a></li> | 133 <li><a href="index.html">Home</a></li> |
| 99 <li class="leftNavSelected">Getting Started </li> | 134 <li class="leftNavSelected">Getting Started</li> |
| 100 <li> <a href="overview.html">Overview</a></li> | 135 <li><a href="overview.html">Overview</a></li> |
| 101 <li> <a href="devguide.html"><div>Developer's Guide</div></a> | 136 <li><h2><a href="devguide.html">Developer's Guide</a></h2> |
| 102 <ul> | 137 <ul> |
| 103 <li> Browser UI | 138 <li>Browser UI |
| 104 <ul> | 139 <ul> |
| 105 <li><a href="browserAction.html">Browser Actions</a></li> | 140 <li><a href="browserAction.html">Browser Actions</a></li> |
| 106 <li><a href="options.html">Options Pages</a></li> | 141 <li><a href="options.html">Options Pages</a></li> |
| 107 <li><a href="override.html">Override Pages</a></li> | 142 <li><a href="override.html">Override Pages</a></li> |
| 108 <li><a href="pageAction.html">Page Actions</a></li> | 143 <li><a href="pageAction.html">Page Actions</a></li> |
| 109 <li><a href="themes.html">Themes</a></li> | 144 <li><a href="themes.html">Themes</a></li> |
| 110 </ul> | 145 </ul> |
| 111 </li> | 146 </li> |
| 112 <li> Browser Interaction | 147 <li>Browser Interaction |
| 113 <ul> | 148 <ul> |
| 114 <li><a href="bookmarks.html">Bookmarks</a></li> | 149 <li><a href="bookmarks.html">Bookmarks</a></li> |
| 115 <li><a href="events.html">Events</a></li> | 150 <li><a href="events.html">Events</a></li> |
| 116 <li><a href="tabs.html">Tabs</a></li> | 151 <li><a href="tabs.html">Tabs</a></li> |
| 117 <li><a href="windows.html">Windows</a></li> | 152 <li><a href="windows.html">Windows</a></li> |
| 118 </ul> | 153 </ul> |
| 119 </li> | 154 </li> |
| 120 <li> Implementation | 155 <li>Implementation |
| 121 <ul> | 156 <ul> |
| 122 <li><a href="background_pages.html">Background Pages</a></li> | 157 <li><a href="background_pages.html">Background Pages</a></li> |
| 123 <li><a href="content_scripts.html">Content Scripts</a></li> | 158 <li><a href="content_scripts.html">Content Scripts</a></li> |
| 124 <li><a href="xhr.html">Cross-Origin XHR</a></li> | 159 <li><a href="xhr.html">Cross-Origin XHR</a></li> |
| 125 <li><a href="messaging.html">Message Passing</a></li> | 160 <li><a href="messaging.html">Message Passing</a></li> |
| 126 <li><a href="npapi.html">NPAPI Plugins</a></li> | 161 <li><a href="npapi.html">NPAPI Plugins</a></li> |
| 127 </ul> | 162 </ul> |
| 128 </li> | 163 </li> |
| 129 <li> Finishing | 164 <li>Finishing |
| 130 <ul> | 165 <ul> |
| 131 <li><a href="autoupdate.html">Autoupdating</a></li> | 166 <li><a href="autoupdate.html">Autoupdating</a></li> |
| 132 <li><a href="packaging.html">Packaging</a></li> | 167 <li><a href="packaging.html">Packaging</a></li> |
| 133 </ul> | 168 </ul> |
| 134 </li> | 169 </li> |
| 135 </ul> | 170 </ul> |
| 136 </li> | 171 </li> |
| 137 <li><a href="tutorials.html"><div>Tutorials</div></a> | 172 <li><h2><a href="tutorials.html">Tutorials</a></h2> |
| 138 <ul> | 173 <ul> |
| 139 <li><a href="tut_debugging.html">Debugging</a></li> | 174 <li><a href="tut_debugging.html">Debugging</a></li> |
| 140 </ul> | 175 </ul> |
| 141 </li> | 176 </li> |
| 142 <li>Reference | 177 <li><h2>Reference</h2> |
| 143 <ul> | 178 <ul> |
| 144 <li> Formats | 179 <li>Formats |
| 145 <ul> | 180 <ul> |
| 146 <li><a href="manifest.html">Manifest Files</a></li> | 181 <li><a href="manifest.html">Manifest Files</a></li> |
| 147 <li><a href="match_patterns.html">Match Patterns</a></li> | 182 <li><a href="match_patterns.html">Match Patterns</a></li> |
| 148 <!-- <li>Packages (.crx)</li> --> | 183 <!-- <li>Packages (.crx)</li> --> |
| 149 </ul> | 184 </ul> |
| 150 </li> | 185 </li> |
| 151 <li> <a href="api_index.html">chrome.* APIs</a> </li> | 186 <li><a href="api_index.html">chrome.* APIs</a></li> |
| 152 <li> <a href="api_other.html">Other APIs</a> </li> | 187 <li><a href="api_other.html">Other APIs</a></li> |
| 153 </ul> | 188 </ul> |
| 154 </li> | 189 </li> |
| 155 <li><a href="samples.html">Samples</a></li> | 190 <li><h2><a href="samples.html">Samples</a></h2></li> |
| 156 </ul> | 191 </ul> |
| 157 </div> | 192 </div> |
| 158 | 193 |
| 159 <div id="mainColumn"> | 194 <div class="g-unit" id="gc-pagecontent"> |
| 195 <div id="pageTitle"> |
| 196 <h1 class="page_title">Tutorial: Getting Started (Hello, World!)</h1> |
| 197 </div> |
| 160 <!-- TABLE OF CONTENTS --> | 198 <!-- TABLE OF CONTENTS --> |
| 161 <div id="toc"> | 199 <div id="toc"> |
| 162 <p>Contents</p> | 200 <h2>Contents</h2> |
| 163 <ol> | 201 <ol> |
| 164 <li> | 202 <li> |
| 165 <a href="#browser">Get your browser ready</a> | 203 <a href="#browser">Get your browser ready</a> |
| 166 <ol> | 204 <ol> |
| 167 <li style="display: none; "> | 205 <li style="display: none; "> |
| 168 <a>h3Name</a> | 206 <a>h3Name</a> |
| 169 </li> | 207 </li> |
| 170 </ol> | 208 </ol> |
| 171 </li><li> | 209 </li><li> |
| 172 <a href="#load">Create and load an extension</a> | 210 <a href="#load">Create and load an extension</a> |
| (...skipping 113 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 286 "browser_action": { | 324 "browser_action": { |
| 287 "default_icon": "icon.png" | 325 "default_icon": "icon.png" |
| 288 }, | 326 }, |
| 289 "permissions": [ | 327 "permissions": [ |
| 290 "http://api.flickr.com/" | 328 "http://api.flickr.com/" |
| 291 ] | 329 ] |
| 292 }</pre> | 330 }</pre> |
| 293 </li> | 331 </li> |
| 294 <li> | 332 <li> |
| 295 Copy this icon to the same folder:<br> | 333 Copy this icon to the same folder:<br> |
| 296 <table cellpadding="0" cellspacing="0"> | 334 <table cellpadding="0" cellspacing="0" style="border:0"> |
| 297 <tbody><tr> | 335 <tbody><tr> |
| 298 <td style="text-align:center; border:0;"><a href="examples/tutorials/get
started/icon.png"><img src="examples/tutorials/getstarted/icon.png" width="19" h
eight="19" border="0"></a><br> | 336 <td style="text-align:center; border:0;"><a href="examples/tutorials/get
started/icon.png"><img src="examples/tutorials/getstarted/icon.png" width="19" h
eight="19" border="0"></a><br> |
| 299 <a href="examples/tutorials/getstarted/icon.png">Download icon.png</a>
</td> | 337 <a href="examples/tutorials/getstarted/icon.png">Download icon.png</a>
</td> |
| 300 </tr> | 338 </tr> |
| 301 </tbody></table> | 339 </tbody></table> |
| 302 </li> | 340 </li> |
| 303 <li id="load-ext"> Load the extension. | 341 <li id="load-ext"> Load the extension. |
| 304 <ol type="a"> | 342 <ol type="a"> |
| 305 <li> | 343 <li> |
| 306 Bring up the extensions management page | 344 Bring up the extensions management page |
| 307 by clicking the Tools menu | 345 by clicking the Tools menu |
| 308 <img src="images/toolsmenu.gif" width="43" height="34" alt="" align="absmi
ddle"> | 346 <img src="images/toolsmenu.gif" width="43" height="34" alt="" align="absmi
ddle" style="margin:0; padding:0">and |
| 309 and choosing <b>Extensions</b>. | 347 choosing <b>Extensions</b>. |
| 310 </li> | 348 </li> |
| 311 | 349 |
| 312 <li> | 350 <li> |
| 313 If <b>Developer mode</b> has a + by it, | 351 If <b>Developer mode</b> has a + by it, |
| 314 click the + to add developer information to the page. | 352 click the + to add developer information to the page. |
| 315 The + changes to a -, | 353 The + changes to a -, |
| 316 and more buttons and information appear. | 354 and more buttons and information appear. |
| 317 </li> | 355 </li> |
| 318 | 356 |
| 319 <li> | 357 <li> |
| (...skipping 228 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 548 <h4>type name</h4> | 586 <h4>type name</h4> |
| 549 | 587 |
| 550 <div> | 588 <div> |
| 551 </div> | 589 </div> |
| 552 | 590 |
| 553 </div> <!-- /apiItem --> | 591 </div> <!-- /apiItem --> |
| 554 | 592 |
| 555 </div> <!-- /apiGroup --> | 593 </div> <!-- /apiGroup --> |
| 556 | 594 |
| 557 </div> <!-- /apiPage --> | 595 </div> <!-- /apiPage --> |
| 558 </div> <!-- /mainColumn --> | 596 </div> <!-- /gc-pagecontent --> |
| 559 </div> <!-- /pageContent --> | 597 </div> <!-- /g-section --> |
| 560 <div id="pageFooter" --=""> | 598 </div> <!-- /codesiteContent --> |
| 599 <div id="gc-footer" --=""> |
| 600 <div class="text"> |
| 561 <p> | 601 <p> |
| 562 Except as otherwise <a href="http://code.google.com/policies.html#restrictions
">noted</a>, | 602 Except as otherwise <a href="http://code.google.com/policies.html#restrictions
">noted</a>, |
| 563 the content of this page is licensed under the <a rel="license" href="http://c
reativecommons.org/licenses/by/3.0/">Creative Commons | 603 the content of this page is licensed under the <a rel="license" href="http://c
reativecommons.org/licenses/by/3.0/">Creative Commons |
| 564 Attribution 3.0 License</a>, and code samples are licensed under the | 604 Attribution 3.0 License</a>, and code samples are licensed under the |
| 565 <a rel="license" href="http://code.google.com/google_bsd_license.html">BSD Lic
ense</a>. | 605 <a rel="license" href="http://code.google.com/google_bsd_license.html">BSD Lic
ense</a>. |
| 566 </p> | 606 </p> |
| 567 <p> | 607 <p> |
| 568 ©2009 Google | 608 ©2009 Google |
| 569 </p> | 609 </p> |
| 570 | 610 |
| (...skipping 11 matching lines...) Expand all Loading... |
| 582 // code.google.com site-wide tracking | 622 // code.google.com site-wide tracking |
| 583 try { | 623 try { |
| 584 _uacct="UA-18071-1"; | 624 _uacct="UA-18071-1"; |
| 585 _uanchor=1; | 625 _uanchor=1; |
| 586 _uff=0; | 626 _uff=0; |
| 587 urchinTracker(); | 627 urchinTracker(); |
| 588 } | 628 } |
| 589 catch(e) {/* urchinTracker not available. */} | 629 catch(e) {/* urchinTracker not available. */} |
| 590 </script> | 630 </script> |
| 591 <!-- end analytics --> | 631 <!-- end analytics --> |
| 592 | 632 </div> |
| 593 </div> <!-- /pageFooter --> | 633 </div> <!-- /gc-footer --> |
| 594 </div> <!-- /container --> | 634 </div> <!-- /gc-container --> |
| 595 </body></html> | 635 </body></html> |
| 596 | 636 |
| OLD | NEW |