| OLD | NEW |
| 1 <div id="pageData-title" class="pageData">Tutorial: Getting Started (Hello, Worl
d!)</div> | 1 <div id="pageData-title" class="pageData">Tutorial: Getting Started (Hello, Worl
d!)</div> |
| 2 <div id="pageData-showTOC" class="pageData">true</div> | 2 <div id="pageData-showTOC" class="pageData">true</div> |
| 3 | 3 |
| 4 <p> | 4 <p> |
| 5 This tutorial walks you through creating a simple extension. | 5 This tutorial walks you through creating a simple extension. |
| 6 You'll add a button to Google Chrome | 6 You'll add a button to Google Chrome |
| 7 that, when clicked, displays an automatically generated page. | 7 that, when clicked, displays an automatically generated page. |
| 8 The button and page will look something like this: | 8 The button and page will look something like this: |
| 9 </p> | 9 </p> |
| 10 | 10 |
| (...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 44 <li> | 44 <li> |
| 45 Inside your extension's folder, | 45 Inside your extension's folder, |
| 46 create a text file called <strong><code>manifest.json</code></strong>, | 46 create a text file called <strong><code>manifest.json</code></strong>, |
| 47 and put this in it: | 47 and put this in it: |
| 48 <pre>{ | 48 <pre>{ |
| 49 "name": "My First Extension", | 49 "name": "My First Extension", |
| 50 "version": "1.0", | 50 "version": "1.0", |
| 51 "description": "The first extension that I made.", | 51 "description": "The first extension that I made.", |
| 52 "toolstrips": [ | 52 "toolstrips": [ |
| 53 "my_toolstrip.html" | 53 "my_toolstrip.html" |
| 54 ], |
| 55 "permissions": [ |
| 56 "http://api.flickr.com/" |
| 54 ] | 57 ] |
| 55 }</pre> | 58 }</pre> |
| 56 </li> | 59 </li> |
| 57 <li> | 60 <li> |
| 58 In the same folder, create a text file called | 61 In the same folder, create a text file called |
| 59 <strong><code>my_toolstrip.html</code></strong>, | 62 <strong><code>my_toolstrip.html</code></strong>, |
| 60 and put this in it: | 63 and put this in it: |
| 61 <pre><div class="toolstrip-button"> | 64 <pre><div class="toolstrip-button"> |
| 62 <span>Hello, World!</span> | 65 <span>Hello, World!</span> |
| 63 </div></pre> | 66 </div></pre> |
| (...skipping 130 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 194 <li> | 197 <li> |
| 195 Learn more about | 198 Learn more about |
| 196 <a href="toolstrip.html">toolstrips</a> | 199 <a href="toolstrip.html">toolstrips</a> |
| 197 </li> | 200 </li> |
| 198 <li> | 201 <li> |
| 199 <a href="packaging.html">Package</a> | 202 <a href="packaging.html">Package</a> |
| 200 your extension into a <code>.crx</code> file | 203 your extension into a <code>.crx</code> file |
| 201 so you can share it with your friends | 204 so you can share it with your friends |
| 202 </li> | 205 </li> |
| 203 </ul> | 206 </ul> |
| OLD | NEW |