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

Side by Side Diff: chrome/common/extensions/docs/i18n.html

Issue 1392002: Update i18n pages to include predefined messages (e.g. @@bidi_dir).... (Closed) Base URL: svn://chrome-svn/chrome/trunk/src/
Patch Set: '' Created 10 years, 9 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 | Annotate | Revision Log
« no previous file with comments | « no previous file | chrome/common/extensions/docs/i18n-messages.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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>
(...skipping 190 matching lines...) Expand 10 before | Expand all | Expand 10 after
201 <h2>Contents</h2> 201 <h2>Contents</h2>
202 <ol> 202 <ol>
203 <li> 203 <li>
204 <a href="#l10">How to support multiple languages</a> 204 <a href="#l10">How to support multiple languages</a>
205 <ol> 205 <ol>
206 <li style="display: none; "> 206 <li style="display: none; ">
207 <a>h3Name</a> 207 <a>h3Name</a>
208 </li> 208 </li>
209 </ol> 209 </ol>
210 </li><li> 210 </li><li>
211 <a href="#overview-predefined">Predefined messages</a>
212 <ol>
213 <li style="display: none; ">
214 <a>h3Name</a>
215 </li>
216 </ol>
217 </li><li>
211 <a href="#overview-locales">Locales</a> 218 <a href="#overview-locales">Locales</a>
212 <ol> 219 <ol>
213 <li> 220 <li>
214 <a href="#locales-supported">Supported locales</a> 221 <a href="#locales-supported">Supported locales</a>
215 </li><li> 222 </li><li>
216 <a href="#locales-usage">How extensions find strings</a> 223 <a href="#locales-usage">How extensions find strings</a>
217 </li><li> 224 </li><li>
218 <a href="#locales-testing">How to set your browser's locale</a > 225 <a href="#locales-testing">How to set your browser's locale</a >
219 </li> 226 </li>
220 </ol> 227 </ol>
(...skipping 96 matching lines...) Expand 10 before | Expand all | Expand 10 after
317 Say you have an extension 324 Say you have an extension
318 with the files shown in the following figure: 325 with the files shown in the following figure:
319 </p> 326 </p>
320 327
321 <img src="images/i18n-before.gif" alt="A manifest.json file and a file with Java Script. The .json file has &quot;name&quot;: &quot;Hello World&quot;. The JavaSc ript file has title = &quot;Hello World&quot;;" width="323" height="148"> 328 <img src="images/i18n-before.gif" alt="A manifest.json file and a file with Java Script. The .json file has &quot;name&quot;: &quot;Hello World&quot;. The JavaSc ript file has title = &quot;Hello World&quot;;" width="323" height="148">
322 329
323 <p> 330 <p>
324 To internationalize this extension, 331 To internationalize this extension,
325 you name each user-visible string 332 you name each user-visible string
326 and put it into a messages file. 333 and put it into a messages file.
327 The extension's manifest and JavaScript code 334 The extension's manifest,
335 CSS files,
336 and JavaScript code
328 use each string's name to get its localized version. 337 use each string's name to get its localized version.
329 </p> 338 </p>
330 339
331 <p> 340 <p>
332 Here's what the extension looks like when it's internationalized 341 Here's what the extension looks like when it's internationalized
333 (note that it still has only English strings): 342 (note that it still has only English strings):
334 </p> 343 </p>
335 344
336 <img src="images/i18n-after-1.gif" alt="In the manifest.json file, &quot;Hello W orld&quot; has been changed to &quot;__MSG_extName__&quot;, and a new &quot;defa ult_locale&quot; item has the value &quot;en&quot;. In the JavaScript file, &quo t;Hello World&quot; has been changed to chrome.i18n.getMessage(&quot;extName&quo t;). A new file named _locales/en/messages.json defines &quot;extName&quot;." wi dth="782" height="228"> 345 <img src="images/i18n-after-1.gif" alt="In the manifest.json file, &quot;Hello W orld&quot; has been changed to &quot;__MSG_extName__&quot;, and a new &quot;defa ult_locale&quot; item has the value &quot;en&quot;. In the JavaScript file, &quo t;Hello World&quot; has been changed to chrome.i18n.getMessage(&quot;extName&quo t;). A new file named _locales/en/messages.json defines &quot;extName&quot;." wi dth="782" height="228">
337 346
338 <p class="note"> 347 <p class="note">
339 <b>Important:</b> 348 <b>Important:</b>
340 If an extension has a <code>_locales</code> directory, 349 If an extension has a <code>_locales</code> directory,
341 the <a href="manifest.html">manifest</a> 350 the <a href="manifest.html">manifest</a>
342 <b>must</b> define "default_locale". 351 <b>must</b> define "default_locale".
343 </p> 352 </p>
344 353
345 <p> 354 <p>
346 Some notes about internationalizing extensions: 355 Some notes about internationalizing extensions:
347 </p> 356 </p>
348 357
349 <ul> 358 <ul>
350 <li><p> 359 <li><p>
351 Use only <a href="#overview-locales">supported locales</a>! 360 You can use any of the <a href="#overview-locales">supported locales</a>.
361 If you use an unsupported locale,
362 Google Chrome ignores it.
352 </p></li> 363 </p></li>
353 364
354 <li> 365 <li>
355 In <code>manifest.json</code>, 366 In <code>manifest.json</code>
367 and CSS files,
356 refer to a string named <em>messagename</em> like this: 368 refer to a string named <em>messagename</em> like this:
357 <pre>__MSG_<em>messagename</em>__</pre> 369 <pre>__MSG_<em>messagename</em>__</pre>
358 </li> 370 </li>
359 371
360 <li> 372 <li>
361 In your extension's JavaScript code, 373 In your extension's JavaScript code,
362 refer to a string named <em>messagename</em> 374 refer to a string named <em>messagename</em>
363 like this: 375 like this:
364 <pre>chrome.i18n.getMessage("<em>messagename</em>")</pre> 376 <pre>chrome.i18n.getMessage("<em>messagename</em>")</pre>
365 377
366 </li><li> <p> 378 </li><li> <p>
367 In each call to <code>getMessage()</code>, 379 In each call to <code>getMessage()</code>,
368 you can supply up to 9 strings 380 you can supply up to 9 strings
369 to be included in the message. 381 to be included in the message.
370 See <a href="#examples-getMessage">Examples: getMessage</a> 382 See <a href="#examples-getMessage">Examples: getMessage</a>
371 for details. 383 for details.
372 </p> 384 </p>
373 </li> 385 </li>
374 386
387 <li><p>
388 Some messages, such as <code>@@bidi_dir</code> and <code>@@ui_locale</code>,
389 are provided by the internationalization system.
390 See the <a href="#overview-predefined">Predefined messages</a> section
391 for a full list of predefined message names.
392 </p>
393 </li>
394
375 <li> 395 <li>
376 In <code>messages.json</code>, 396 In <code>messages.json</code>,
377 each user-visible string has a name, a "message" item, 397 each user-visible string has a name, a "message" item,
378 and an optional "description" item. 398 and an optional "description" item.
379 The name is a key 399 The name is a key
380 such as "extName" or "search_string" 400 such as "extName" or "search_string"
381 that identifies the string. 401 that identifies the string.
382 The "message" specifies 402 The "message" specifies
383 the value of the string in this locale. 403 the value of the string in this locale.
384 The optional "description" 404 The optional "description"
(...skipping 24 matching lines...) Expand all
409 For example, to support Spanish, 429 For example, to support Spanish,
410 just put a translated copy of <code>messages.json</code> 430 just put a translated copy of <code>messages.json</code>
411 under <code>_locales/es</code>. 431 under <code>_locales/es</code>.
412 The following figure shows the previous extension 432 The following figure shows the previous extension
413 with a new Spanish translation. 433 with a new Spanish translation.
414 </p> 434 </p>
415 435
416 <img src="images/i18n-after-2.gif" alt="This looks the same as the previous figu re, but with a new file at _locales/es/messages.json that contains a Spanish tra nslation of the messages." width="782" height="358"> 436 <img src="images/i18n-after-2.gif" alt="This looks the same as the previous figu re, but with a new file at _locales/es/messages.json that contains a Spanish tra nslation of the messages." width="782" height="358">
417 437
418 438
439 <h2 id="overview-predefined">Predefined messages</h2>
440
441 <p>
442 The internationalization system provides a few predefined
443 messages to help you localize your extension.
444 These include <code>@@ui_locale</code>,
445 so you can detect the current UI locale,
446 and a few <code>@@bidi_...</code> messages
447 that let you detect the text direction.
448 The latter messages have similar names to constants in the
449 <a href="http://code.google.com/apis/gadgets/docs/i18n.html#BIDI">
450 gadgets BIDI (bi-directional) API</a>.
451 </p>
452
453 <p>
454 The special message <code>@@extension_id</code>
455 can be used in the CSS and JavaScript files of any extension,
456 whether or not the extension is localized.
457 This message doesn't work in manifest files.
458 </p>
459
460 <p>
461 The following table describes each predefined message.
462 </p>
463
464 <table>
465 <tbody><tr>
466 <th>Message name</th> <th>Description</th>
467 </tr>
468 <tr>
469 <td> <code>@@extension_id</code> </td>
470 <td>The extension ID;
471 you might use this string to construct URLs
472 for resources inside the extension.
473 Even unlocalized extensions can use this message.
474 <br>
475 <b>Note:</b> You can't use this message in a manifest file.
476 </td>
477 </tr>
478 <tr>
479 <td> <code>@@ui_locale</code> </td>
480 <td>The current locale;
481 you might use this string to construct locale-specific URLs. </td>
482 </tr>
483 <tr>
484 <td> <code>@@bidi_dir</code> </td>
485 <td> The text direction for the current locale,
486 either "ltr" for left-to-right languages such as English
487 or "rtl" for right-to-left languages such as Japanese. </td>
488 </tr>
489 <tr>
490 <td> <code>@@bidi_reversed_dir</code> </td>
491 <td> If the <code>@@bidi_dir</code> is "ltr", then this is "rtl";
492 otherwise, it's "ltr". </td>
493 </tr>
494 <tr>
495 <td> <code>@@bidi_start_edge</code> </td>
496 <td> If the <code>@@bidi_dir</code> is "ltr", then this is "left";
497 otherwise, it's "right". </td>
498 </tr>
499 <tr>
500 <td> <code>@@bidi_end_edge</code> </td>
501 <td> If the <code>@@bidi_dir</code> is "ltr", then this is "right";
502 otherwise, it's "left". </td>
503 </tr>
504 </tbody></table>
505
506 <p>
507 Here's an example of using <code>@@extension_id</code> in a CSS file
508 to construct a URL:
509 </p>
510
511 <pre>body {
512 <b>background-image:url('chrome-extension://__MSG_@@extension_id__/background. png');</b>
513 }
514 </pre>
515
516 <p>
517 If the extension ID is abcdefghijklmnopqrstuvwxyzabcdef,
518 then the bold line in the previous code snippet becomes:
519 </p>
520
521 <pre>background-image:url('chrome-extension://abcdefghijklmnopqrstuvwxyzabcdef/b ackground.png');
522 </pre>
523
524 <p>
525 Here's an example of using <code>@@bidi_*</code> messages in a CSS file:
526 </p>
527
528 <pre>body {
529 <b>dir: __MSG_@@bidi_dir__;</b>
530 }
531
532 div#header {
533 margin-bottom: 1.05em;
534 overflow: hidden;
535 padding-bottom: 1.5em;
536 <b>padding-__MSG_@@bidi_start_edge__: 0;</b>
537 <b>padding-__MSG_@@bidi_end_edge__: 1.5em;</b>
538 position: relative;
539 }
540 </pre>
541
542 <p>
543 For left-to-right languages such as English,
544 the bold lines become:
545 </p>
546
547 <pre>dir: ltr;
548 padding-left: 0;
549 padding-right: 1.5em;
550 </pre>
551
552
419 <h2 id="overview-locales">Locales</h2> 553 <h2 id="overview-locales">Locales</h2>
420 554
421 <p> 555 <p>
422 Extensions can use all the locales that Google Chrome supports, 556 Extensions can use all the locales that Google Chrome supports,
423 plus a few (such as <code>en</code>) 557 plus a few (such as <code>en</code>)
424 that let a single translation support multiple variations of a language 558 that let a single translation support multiple variations of a language
425 (such as <code>en_GB</code> and <code>en_US</code>). 559 (such as <code>en_GB</code> and <code>en_US</code>).
426 </p> 560 </p>
427 561
428 562
(...skipping 723 matching lines...) Expand 10 before | Expand all | Expand 10 after
1152 _uff=0; 1286 _uff=0;
1153 urchinTracker(); 1287 urchinTracker();
1154 } 1288 }
1155 catch(e) {/* urchinTracker not available. */} 1289 catch(e) {/* urchinTracker not available. */}
1156 </script> 1290 </script>
1157 <!-- end analytics --> 1291 <!-- end analytics -->
1158 </div> 1292 </div>
1159 </div> <!-- /gc-footer --> 1293 </div> <!-- /gc-footer -->
1160 </div> <!-- /gc-container --> 1294 </div> <!-- /gc-container -->
1161 </body></html> 1295 </body></html>
OLDNEW
« no previous file with comments | « no previous file | chrome/common/extensions/docs/i18n-messages.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698