Home | History | Annotate | Download | only in docs
      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
      3        across api docs and should be edited only with knowledge of the
      4        templating mechanism.
      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
      7        authored overview content.
      8     4) The <body>.innerHTML is also generated by an offline step so that this
      9        page may easily be indexed by search engines.
     10 --><html xmlns="http://www.w3.org/1999/xhtml"><head>
     11     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
     12     <link href="css/ApiRefStyles.css" rel="stylesheet" type="text/css">
     13     <link href="css/print.css" rel="stylesheet" type="text/css" media="print">
     14     <script type="text/javascript" src="../../../third_party/jstemplate/jstemplate_compiled.js">
     15     </script>
     16     <script type="text/javascript" src="js/api_page_generator.js"></script>
     17     <script type="text/javascript" src="js/bootstrap.js"></script>
     18     <script type="text/javascript" src="js/sidebar.js"></script>
     19   <title>Tutorials - Google Chrome Extensions - Google Code</title></head>
     20   <body>  <div id="gc-container" class="labs">
     21       <div id="devModeWarning">
     22         You are viewing extension docs in chrome via the 'file:' scheme: are you expecting to see local changes when you refresh? You'll need run chrome with --allow-file-access-from-files.
     23       </div>
     24       <!-- SUBTEMPLATES: DO NOT MOVE FROM THIS LOCATION -->
     25       <!-- In particular, sub-templates that recurse, must be used by allowing
     26            jstemplate to make a copy of the template in this section which
     27            are not operated on by way of the jsskip="true" -->
     28       <div style="display:none">
     29 
     30         <!-- VALUE -->
     31         <div id="valueTemplate">
     32           <dt>
     33             <var>paramName</var>
     34               <em>
     35 
     36                 <!-- TYPE -->
     37                 <div style="display:inline">
     38                   (
     39                     <span class="optional">optional</span>
     40                     <span class="enum">enumerated</span>
     41                     <span id="typeTemplate">
     42                       <span>
     43                         <a> Type</a>
     44                       </span>
     45                       <span>
     46                         <span>
     47                           array of <span><span></span></span>
     48                         </span>
     49                         <span>paramType</span>
     50                         <span></span>
     51                       </span>
     52                     </span>
     53                   )
     54                 </div>
     55 
     56               </em>
     57           </dt>
     58           <dd class="todo">
     59             Undocumented.
     60           </dd>
     61           <dd>
     62             Description of this parameter from the json schema.
     63           </dd>
     64           <dd>
     65             This parameter was added in version
     66             <b><span></span></b>.
     67             You must omit this parameter in earlier versions,
     68             and you may omit it in any version.  If you require this
     69             parameter, the manifest key
     70             <a href="manifest.html#minimum_chrome_version">minimum_chrome_version</a>
     71             can ensure that your extension won't be run in an earlier browser version.
     72           </dd>
     73 
     74           <!-- OBJECT PROPERTIES -->
     75           <dd>
     76             <dl>
     77               <div>
     78                 <div>
     79                 </div>
     80               </div>
     81             </dl>
     82           </dd>
     83 
     84           <!-- OBJECT METHODS -->
     85           <dd>
     86             <div></div>
     87           </dd>
     88 
     89           <!-- OBJECT EVENT FIELDS -->
     90           <dd>
     91             <div></div>
     92           </dd>
     93 
     94           <!-- FUNCTION PARAMETERS -->
     95           <dd>
     96             <div></div>
     97           </dd>
     98 
     99         </div> <!-- /VALUE -->
    100 
    101         <div id="functionParametersTemplate">
    102           <h5>Parameters</h5>
    103           <dl>
    104             <div>
    105               <div>
    106               </div>
    107             </div>
    108           </dl>
    109         </div>
    110       </div> <!-- /SUBTEMPLATES -->
    111 
    112   <a id="top"></a>
    113     <div id="skipto">
    114       <a href="#gc-pagecontent">Skip to page content</a>
    115       <a href="#gc-toc">Skip to main navigation</a>
    116     </div>
    117     <!-- API HEADER -->
    118     <table id="header" width="100%" cellspacing="0" border="0">
    119       <tbody><tr>
    120         <td valign="middle"><a href="http://code.google.com/"><img src="images/code_labs_logo.gif" height="43" width="161" alt="Google Code Labs" style="border:0; margin:0;"></a></td>
    121         <td valign="middle" width="100%" style="padding-left:0.6em;">
    122           <form action="http://www.google.com/cse" id="cse" style="margin-top:0.5em">
    123             <div id="gsc-search-box">
    124               <input type="hidden" name="cx" value="002967670403910741006:61_cvzfqtno">
    125               <input type="hidden" name="ie" value="UTF-8">
    126               <input type="text" name="q" value="" size="55">
    127               <input class="gsc-search-button" type="submit" name="sa" value="Search">
    128               <br>
    129               <span class="greytext">e.g. "page action" or "tabs"</span>
    130             </div>
    131           </form>
    132 
    133           <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    134           <script type="text/javascript">google.load("elements", "1", {packages: "transliteration"});</script>
    135           <script type="text/javascript" src="http://www.google.com/coop/cse/t13n?form=cse&t13n_langs=en"></script>
    136           <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse&lang=en"></script>
    137         </td>
    138       </tr>
    139     </tbody></table>
    140 
    141     <div id="codesiteContent" class="">
    142 
    143       <a id="gc-topnav-anchor"></a>
    144       <div id="gc-topnav">
    145         <h1>Google Chrome Extensions (<a href="http://code.google.com/labs/">Labs</a>)</h1>
    146         <ul id="home" class="gc-topnav-tabs">
    147           <li id="home_link">
    148             <a href="index.html" title="Google Chrome Extensions home page">Home</a>
    149           </li>
    150           <li id="docs_link">
    151             <a href="docs.html" title="Official Google Chrome Extensions documentation">Docs</a>
    152           </li>
    153           <li id="faq_link">
    154             <a href="faq.html" title="Answers to frequently asked questions about Google Chrome Extensions">FAQ</a>
    155           </li>
    156           <li id="samples_link">
    157             <a href="samples.html" title="Sample extensions (with source code)">Samples</a>
    158           </li>
    159           <li id="group_link">
    160             <a href="http://groups.google.com/a/chromium.org/group/chromium-extensions" title="Google Chrome Extensions developer forum">Group</a>
    161           </li>
    162         </ul>
    163       </div> <!-- end gc-topnav -->
    164 
    165     <div class="g-section g-tpl-170">
    166       <!-- SIDENAV -->
    167       <div class="g-unit g-first" id="gc-toc">
    168         <ul>
    169           <li><a href="getstarted.html">Getting Started</a></li>
    170           <li><a href="overview.html">Overview</a></li>
    171           <li><a href="whats_new.html">What's New?</a></li>
    172           <li><h2><a href="devguide.html">Developer's Guide</a></h2>
    173             <ul>
    174               <li>Browser UI
    175                 <ul>
    176                   <li><a href="browserAction.html">Browser Actions</a></li>
    177                   <li><a href="contextMenus.html">Context Menus</a></li>
    178                   <li><a href="notifications.html">Desktop Notifications</a></li>
    179                   <li><a href="omnibox.html">Omnibox</a></li>
    180                   <li><a href="options.html">Options Pages</a></li>
    181                   <li><a href="override.html">Override Pages</a></li>
    182                   <li><a href="pageAction.html">Page Actions</a></li>
    183                 </ul>
    184               </li>
    185               <li>Browser Interaction
    186                 <ul>
    187                   <li><a href="bookmarks.html">Bookmarks</a></li>
    188                   <li><a href="cookies.html">Cookies</a></li>
    189                   <li><a href="events.html">Events</a></li>
    190                   <li><a href="history.html">History</a></li>
    191                   <li><a href="management.html">Management</a></li>
    192                   <li><a href="tabs.html">Tabs</a></li>
    193                   <li><a href="windows.html">Windows</a></li>
    194                 </ul>
    195               </li>
    196               <li>Implementation
    197                 <ul>
    198                   <li><a href="a11y.html">Accessibility</a></li>
    199                   <li><a href="background_pages.html">Background Pages</a></li>
    200                   <li><a href="content_scripts.html">Content Scripts</a></li>
    201                   <li><a href="xhr.html">Cross-Origin XHR</a></li>
    202                   <li><a href="idle.html">Idle</a></li>
    203                   <li><a href="i18n.html">Internationalization</a></li>
    204                   <li><a href="messaging.html">Message Passing</a></li>
    205                   <li><a href="npapi.html">NPAPI Plugins</a></li>
    206                 </ul>
    207               </li>
    208               <li>Finishing
    209                 <ul>
    210                   <li><a href="hosting.html">Hosting</a></li>
    211                   <li><a href="external_extensions.html">Other Deployment Options</a></li>
    212                 </ul>
    213               </li>
    214             </ul>
    215           </li>
    216           <li><h2><a href="apps.html">Packaged Apps</a></h2></li>
    217           <li><h2><a href="tutorials.html">Tutorials</a></h2>
    218             <ul>
    219               <li><a href="tut_debugging.html">Debugging</a></li>
    220               <li><a href="tut_analytics.html">Google Analytics</a></li>
    221               <li><a href="tut_oauth.html">OAuth</a></li>
    222             </ul>
    223           </li>
    224           <li><h2>Reference</h2>
    225             <ul>
    226               <li>Formats
    227                 <ul>
    228                   <li><a href="manifest.html">Manifest Files</a></li>
    229                   <li><a href="match_patterns.html">Match Patterns</a></li>
    230                 </ul>
    231               </li>
    232               <li><a href="permission_warnings.html">Permission Warnings</a></li>
    233               <li><a href="api_index.html">chrome.* APIs</a></li>
    234               <li><a href="api_other.html">Other APIs</a></li>
    235             </ul>
    236           </li>
    237           <li><h2><a href="samples.html">Samples</a></h2></li>
    238           <div class="line"> </div>
    239           <li><h2>More</h2>
    240             <ul>
    241               <li><a href="http://code.google.com/chrome/webstore/docs/index.html">Chrome Web Store</a></li>
    242               <li><a href="http://code.google.com/chrome/apps/docs/developers_guide.html">Hosted Apps</a></li>
    243               <li><a href="themes.html">Themes</a></li>
    244             </ul>
    245           </li>
    246         </ul>
    247       </div>
    248       <script>
    249         initToggles();
    250       </script>
    251 
    252     <div class="g-unit" id="gc-pagecontent">
    253       <div id="pageTitle">
    254         <h1 class="page_title">Tutorials</h1>
    255       </div>
    256         <!-- TABLE OF CONTENTS -->
    257         <div id="toc" style="display: none; ">
    258           <h2>Contents</h2>
    259           <ol>
    260             <li>
    261               <a>h2Name</a>
    262               <ol>
    263                 <li>
    264                   <a>h3Name</a>
    265                 </li>
    266               </ol>
    267             </li>
    268               <li>
    269                 <a href="#apiReference">API reference</a>
    270                 <ol>
    271                   <li>
    272                     <a href="#properties">Properties</a>
    273                     <ol>
    274                       <li>
    275                         <a href="#property-anchor">propertyName</a>
    276                       </li>
    277                     </ol>
    278                   </li>
    279                   <li>
    280                     <a>Methods</a>
    281                     <ol>
    282                       <li>
    283                         <a href="#method-anchor">methodName</a>
    284                       </li>
    285                     </ol>
    286                   </li>
    287                   <li>
    288                     <a>Events</a>
    289                     <ol>
    290                       <li>
    291                         <a href="#event-anchor">eventName</a>
    292                       </li>
    293                     </ol>
    294                   </li>
    295                   <li>
    296                     <a href="#types">Types</a>
    297                     <ol>
    298                       <li>
    299                         <a href="#id-anchor">id</a>
    300                       </li>
    301                     </ol>
    302                   </li>
    303                 </ol>
    304               </li>
    305           </ol>
    306         </div>
    307         <!-- /TABLE OF CONTENTS -->
    308 
    309         <!-- Standard content lead-in for experimental API pages -->
    310         <p id="classSummary" style="display: none; ">
    311           For information on how to use experimental APIs, see the <a href="experimental.html">chrome.experimental.* APIs</a> page.
    312         </p>
    313 
    314         <!-- STATIC CONTENT PLACEHOLDER -->
    315         <div id="static"><div id="pageData-name" class="pageData">Tutorials</div>
    316 
    317 <p>
    318 Follow these to get started
    319 developing Google Chrome Extensions:
    320 </p>
    321 
    322 <ul>
    323   <li> <a href="getstarted.html">Getting Started</a> </li>
    324   <li> <a href="tut_debugging.html">Debugging</a> </li>
    325 </ul>
    326 
    327 <p>
    328 The remaining tutorials cover
    329 more specialized topics:
    330 </p>
    331 
    332 <ul>
    333   <li> <a href="tut_analytics.html">Google Analytics</a> -
    334   Track the usage of your extension.
    335   </li>
    336   <li> <a href="tut_oauth.html">OAuth</a> -
    337   Learn how your extension can use APIs
    338   (such as <a href="http://code.google.com/apis/gdata/">Google Data APIs</a>)
    339   that support OAuth.
    340   This tutorial features an OAuth library
    341   that you can reuse in your extension.
    342   </li>
    343 </ul>
    344 </div>
    345 
    346         <!-- API PAGE -->
    347         <div class="apiPage" style="display: none; ">
    348         <a name="apiReference"></a>
    349         <h2>API reference: chrome.apiname </h2>
    350 
    351           <!-- PROPERTIES -->
    352           <div class="apiGroup">
    353             <a name="properties"></a>
    354             <h3 id="properties">Properties</h3>
    355 
    356             <div>
    357               <a></a>
    358               <h4>getLastError</h4>
    359               <div class="summary">
    360                 <!-- Note: intentionally longer 80 columns -->
    361                 <span>chrome.extension</span><span>lastError</span>
    362               </div>
    363               <div>
    364               </div>
    365             </div>
    366 
    367           </div> <!-- /apiGroup -->
    368 
    369           <!-- METHODS -->
    370           <div id="methodsTemplate" class="apiGroup">
    371             <a></a>
    372             <h3>Methods</h3>
    373 
    374             <!-- iterates over all functions -->
    375             <div class="apiItem">
    376               <a></a> <!-- method-anchor -->
    377               <h4>method name</h4>
    378 
    379               <div class="summary"><span>void</span>
    380                   <!-- Note: intentionally longer 80 columns -->
    381                   <span>chrome.module.methodName</span>(<span><span>, </span><span></span>
    382                       <var><span></span></var></span>)</div>
    383 
    384               <div class="description">
    385                 <p class="todo">Undocumented.</p>
    386                 <p>
    387                   A description from the json schema def of the function goes here.
    388                 </p>
    389 
    390                 <!-- PARAMETERS -->
    391                 <h4>Parameters</h4>
    392                 <dl>
    393                   <div>
    394                     <div>
    395                     </div>
    396                   </div>
    397                 </dl>
    398 
    399                 <!-- RETURNS -->
    400                 <h4>Returns</h4>
    401                 <dl>
    402                   <div>
    403                     <div>
    404                     </div>
    405                   </div>
    406                 </dl>
    407 
    408                 <!-- CALLBACK -->
    409                 <div>
    410                   <div>
    411                   <h4>Callback function</h4>
    412                   <p>
    413                     The callback <em>parameter</em> should specify a function
    414                     that looks like this:
    415                   </p>
    416                   <p>
    417                     If you specify the <em>callback</em> parameter, it should
    418                     specify a function that looks like this:
    419                   </p>
    420 
    421                   <!-- Note: intentionally longer 80 columns -->
    422                   <pre>function(<span>Type param1, Type param2</span>) <span class="subdued">{...}</span>;</pre>
    423                   <dl>
    424                     <div>
    425                       <div>
    426                       </div>
    427                     </div>
    428                   </dl>
    429                   </div>
    430                 </div>
    431 
    432                 <!-- MIN_VERSION -->
    433                 <p>
    434                   This function was added in version <b><span></span></b>.
    435                   If you require this function, the manifest key
    436                   <a href="manifest.html#minimum_chrome_version">minimum_chrome_version</a>
    437                   can ensure that your extension won't be run in an earlier browser version.
    438                 </p>
    439               </div> <!-- /description -->
    440 
    441             </div>  <!-- /apiItem -->
    442 
    443           </div>  <!-- /apiGroup -->
    444 
    445           <!-- EVENTS -->
    446           <div id="eventsTemplate" class="apiGroup">
    447             <a></a>
    448             <h3>Events</h3>
    449             <!-- iterates over all events -->
    450             <div class="apiItem">
    451               <a></a>
    452               <h4>event name</h4>
    453 
    454               <div class="summary">
    455                 <!-- Note: intentionally longer 80 columns -->
    456                 <span class="subdued">chrome.bookmarks</span><span>onEvent</span><span class="subdued">.addListener</span>(function(<span>Type param1, Type param2</span>) <span class="subdued">{...}</span>);
    457               </div>
    458 
    459               <div class="description">
    460                 <p class="todo">Undocumented.</p>
    461                 <p>
    462                   A description from the json schema def of the event goes here.
    463                 </p>
    464 
    465                 <!-- PARAMETERS -->
    466                 <div>
    467                   <h4>Parameters</h4>
    468                   <dl>
    469                     <div>
    470                       <div>
    471                       </div>
    472                     </div>
    473                   </dl>
    474                 </div>
    475               </div> <!-- /decription -->
    476 
    477             </div> <!-- /apiItem -->
    478 
    479           </div> <!-- /apiGroup -->
    480 
    481           <!-- TYPES -->
    482           <div class="apiGroup">
    483             <a name="types"></a>
    484             <h3 id="types">Types</h3>
    485 
    486             <!-- iterates over all types -->
    487             <div class="apiItem">
    488               <a></a>
    489               <h4>type name</h4>
    490 
    491               <div>
    492               </div>
    493 
    494             </div> <!-- /apiItem -->
    495 
    496           </div> <!-- /apiGroup -->
    497 
    498         </div> <!-- /apiPage -->
    499       </div> <!-- /gc-pagecontent -->
    500     </div> <!-- /g-section -->
    501   </div> <!-- /codesiteContent -->
    502     <div id="gc-footer" --="">
    503       <div class="text">
    504   <p>
    505   Except as otherwise <a href="http://code.google.com/policies.html#restrictions">noted</a>,
    506   the content of this page is licensed under the <a rel="license" href="http://creativecommons.org/licenses/by/3.0/">Creative Commons
    507   Attribution 3.0 License</a>, and code samples are licensed under the
    508   <a rel="license" href="http://code.google.com/google_bsd_license.html">BSD License</a>.
    509   </p>
    510   <p>
    511   2011 Google
    512   </p>
    513 
    514 <!-- begin analytics -->
    515 <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
    516 <script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>
    517 
    518 <script type="text/javascript">
    519   // chrome doc tracking
    520   try {
    521     var engdocs = _gat._getTracker("YT-10763712-2");
    522     engdocs._trackPageview();
    523   } catch(err) {}
    524 
    525   // code.google.com site-wide tracking
    526   try {
    527     _uacct="UA-18071-1";
    528     _uanchor=1;
    529     _uff=0;
    530     urchinTracker();
    531   }
    532   catch(e) {/* urchinTracker not available. */}
    533 </script>
    534 <!-- end analytics -->
    535       </div>
    536     </div> <!-- /gc-footer -->
    537   </div> <!-- /gc-container -->
    538 </body></html>
    539