Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(308)

Side by Side Diff: chrome/common/extensions/docs/server2/templates/articles/getstarted.html

Issue 10834130: Extensions Docs Server: Doc conversion script - SVN (Closed) Base URL: https://src.chromium.org/chrome/trunk/src/
Patch Set: Created 8 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <div id="pageData-name" class="pageData">Tutorial: Getting Started (Hello, World !)</div> 1 <h1>Tutorial: Getting Started (Hello, World!)</h1>
2 <div id="pageData-showTOC" class="pageData">true</div> 2
3 3
4 <p> 4 <p>
5 This tutorial walks you through creating a simple extension. You'll add an 5 This tutorial walks you through creating a simple extension. You'll add an
6 icon to Google Chrome that, when clicked, displays an automatically generated 6 icon to Google Chrome that, when clicked, displays an automatically generated
7 page. The icon and page will look something like this: 7 page. The icon and page will look something like this:
8 </p> 8 </p>
9 9
10 <img src="../images/hello-world-small.png" 10 <img src="{{static}}/images/hello-world-small.png"
11 width="300" 11 width="300"
12 height="221" 12 height="221"
13 alt="a window with a grid of images related to 'Hello World'"> 13 alt="a window with a grid of images related to 'Hello World'">
14 14
15 <p> 15 <p>
16 You can develop extensions using any release of Google Chrome, on Windows, 16 You can develop extensions using any release of Google Chrome, on Windows,
17 Mac, or Linux. Extensions you develop on one platform should run without 17 Mac, or Linux. Extensions you develop on one platform should run without
18 change on every platform Chrome supports. 18 change on every platform Chrome supports.
19 </p> 19 </p>
20 20
(...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after
62 Download icon.png 62 Download icon.png
63 </a> 63 </a>
64 </div> 64 </div>
65 </li> 65 </li>
66 <li id="load-ext"> 66 <li id="load-ext">
67 <p>Load the extension.</p> 67 <p>Load the extension.</p>
68 <ol type="a"> 68 <ol type="a">
69 <li style="margin-top:0" /> 69 <li style="margin-top:0" />
70 Bring up the extensions management page 70 Bring up the extensions management page
71 by clicking the wrench icon 71 by clicking the wrench icon
72 <img src="../images/toolsmenu.gif" width="29" height="29" alt="" 72 <img src="{{static}}/images/toolsmenu.gif" width="29" height="29" alt=""
73 style="margin-top:0" /> 73 style="margin-top:0" />
74 and choosing <b>Tools > Extensions</b>. 74 and choosing <b>Tools > Extensions</b>.
75 </li> 75 </li>
76 76
77 <li> 77 <li>
78 If <b>Developer mode</b> has a + by it, 78 If <b>Developer mode</b> has a + by it,
79 click the + to add developer information to the page. 79 click the + to add developer information to the page.
80 The + changes to a -, 80 The + changes to a -,
81 and more buttons and information appear. 81 and more buttons and information appear.
82 </li> 82 </li>
(...skipping 13 matching lines...) Expand all
96 96
97 <p> 97 <p>
98 If your extension is valid, 98 If your extension is valid,
99 its icon appears next to the address bar, 99 its icon appears next to the address bar,
100 and information about the extension 100 and information about the extension
101 appears in the extensions page, 101 appears in the extensions page,
102 as the following screenshot shows. 102 as the following screenshot shows.
103 </p> 103 </p>
104 104
105 <p> 105 <p>
106 <a href="../images/load_after.png"><img 106 <a href="{{static}}/images/load_after.png"><img
107 src="../images/load_after_small.png" 107 src="{{static}}/images/load_after_small.png"
108 width="300" height="132" /></a> 108 width="300" height="132" /></a>
109 </p> 109 </p>
110 110
111 <h2 id="code">Add code to the extension</h2> 111 <h2 id="code">Add code to the extension</h2>
112 <p> 112 <p>
113 In this step, you'll make your extension <em>do</em> something besides just 113 In this step, you'll make your extension <em>do</em> something besides just
114 look good. 114 look good.
115 </p> 115 </p>
116 116
117 <ol> 117 <ol>
(...skipping 21 matching lines...) Expand all
139 <li> 139 <li>
140 Return to the extensions management page, 140 Return to the extensions management page,
141 and click the <b>Reload</b> button 141 and click the <b>Reload</b> button
142 to load the new version of the extension.</li> 142 to load the new version of the extension.</li>
143 <li>Click the extension's icon. 143 <li>Click the extension's icon.
144 A popup should appear that displays the contents of 144 A popup should appear that displays the contents of
145 <code>popup.html</code>. </li> 145 <code>popup.html</code>. </li>
146 </ol> 146 </ol>
147 <p> It should look something like this:</p> 147 <p> It should look something like this:</p>
148 148
149 <img src="../images/hello-world.png" 149 <img src="{{static}}/images/hello-world.png"
150 width="500" height="369" 150 width="500" height="369"
151 alt="a popup with a grid of images related to HELLO WORLD" /> 151 alt="a popup with a grid of images related to HELLO WORLD" />
152 152
153 <p> If you don't see the popup, 153 <p> If you don't see the popup,
154 try the instructions again, 154 try the instructions again,
155 following them exactly. 155 following them exactly.
156 Don't try loading an HTML file that isn't in the extension's folder &mdash; 156 Don't try loading an HTML file that isn't in the extension's folder &mdash;
157 it won't work! </p> 157 it won't work! </p>
158 158
159 <h2 id="summary">Now what?</h2> 159 <h2 id="summary">Now what?</h2>
160 160
161 <!-- [PENDING: Summarize what we did, what it means, what else we would've done if this were a real extension (e.g. package/zip it), and where to find more info rmation.] --> 161
162 162
163 <p> 163 <p>
164 Here are some suggestions for what to read next: 164 Here are some suggestions for what to read next:
165 </p> 165 </p>
166 166
167 <ul> 167 <ul>
168 <li> 168 <li>
169 The <a href="overview.html">Overview</a>, 169 The <a href="overview.html">Overview</a>,
170 which has important conceptual and practical information 170 which has important conceptual and practical information
171 </li> 171 </li>
(...skipping 22 matching lines...) Expand all
194 </li> 194 </li>
195 <li> 195 <li>
196 Look at some 196 Look at some
197 <a href="samples.html">sample extensions</a> 197 <a href="samples.html">sample extensions</a>
198 </li> 198 </li>
199 <li> 199 <li>
200 Watch some 200 Watch some
201 <a href="http://www.youtube.com/view_play_list?p=CA101D6A85FE9D4B">videos</a >, such as 201 <a href="http://www.youtube.com/view_play_list?p=CA101D6A85FE9D4B">videos</a >, such as
202 <a href="http://www.youtube.com/watch?v=e3McMaHvlBY&feature=PlayList&p=CA101 D6A85FE9D4B&index=3">How to build an extension</a> 202 <a href="http://www.youtube.com/watch?v=e3McMaHvlBY&feature=PlayList&p=CA101 D6A85FE9D4B&index=3">How to build an extension</a>
203 </li> 203 </li>
204 </ul> 204 </ul>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698