| OLD | NEW |
| 1 <!-- | 1 <!-- |
| 2 [NOTEs for editors: | 2 [NOTEs for editors: |
| 3 * Try to be consistent about string vs. message (it's probably not yet). | 3 * Try to be consistent about string vs. message (it's probably not yet). |
| 4 --> | 4 --> |
| 5 | 5 |
| 6 <p> | 6 <p> |
| 7 You need to put all of its user-visible strings into a file | 7 You need to put all of its user-visible strings into a file |
| 8 named <a href="i18n-messages.html"><code>messages.json</code></a>. | 8 named <a href="i18n-messages"><code>messages.json</code></a>. |
| 9 Each time you add a new locale, | 9 Each time you add a new locale, |
| 10 you add a messages file | 10 you add a messages file |
| 11 under a directory | 11 under a directory |
| 12 named <code>_locales/<em>localeCode</em></code>, | 12 named <code>_locales/<em>localeCode</em></code>, |
| 13 where <em>localeCode</em> is a code such as | 13 where <em>localeCode</em> is a code such as |
| 14 <code>en</code> for English. | 14 <code>en</code> for English. |
| 15 </p> | 15 </p> |
| 16 | 16 |
| 17 <p> | 17 <p> |
| 18 Here's the file hierarchy | 18 Here's the file hierarchy |
| 19 for an internationalized extension that supports | 19 for an internationalized extension that supports |
| 20 English (<code>en</code>), | 20 English (<code>en</code>), |
| 21 Spanish (<code>es</code>), and | 21 Spanish (<code>es</code>), and |
| 22 Korean (<code>ko</code>): | 22 Korean (<code>ko</code>): |
| 23 </p> | 23 </p> |
| 24 | 24 |
| 25 <img src="{{static}}/images/i18n-hierarchy.gif" | 25 <img src="{{static}}/images/i18n-hierarchy.gif" |
| 26 alt='In the extension directory: manifest.json, *.html, *.js, _locales director
y. In the _locales directory: en, es, and ko directories, each with a messages.j
son file.' | 26 alt='In the extension directory: manifest.json, *, *.js, _locales directory. In
the _locales directory: en, es, and ko directories, each with a messages.json f
ile.' |
| 27 width="385" height="77" /> | 27 width="385" height="77" /> |
| 28 | 28 |
| 29 | 29 |
| 30 <h2 id="l10">How to support multiple languages</h2> | 30 <h2 id="l10">How to support multiple languages</h2> |
| 31 | 31 |
| 32 <p> | 32 <p> |
| 33 Say you have an extension | 33 Say you have an extension |
| 34 with the files shown in the following figure: | 34 with the files shown in the following figure: |
| 35 </p> | 35 </p> |
| 36 | 36 |
| (...skipping 16 matching lines...) Expand all Loading... |
| 53 (note that it still has only English strings): | 53 (note that it still has only English strings): |
| 54 </p> | 54 </p> |
| 55 | 55 |
| 56 <img src="{{static}}/images/i18n-after-1.gif" | 56 <img src="{{static}}/images/i18n-after-1.gif" |
| 57 alt='In the manifest.json file, "Hello World" has been changed to "__MSG_extNam
e__", and a new "default_locale" item has the value "en". In the JavaScript file
, "Hello World" has been changed to chrome.i18n.getMessage("extName"). A new fil
e named _locales/en/messages.json defines "extName".' | 57 alt='In the manifest.json file, "Hello World" has been changed to "__MSG_extNam
e__", and a new "default_locale" item has the value "en". In the JavaScript file
, "Hello World" has been changed to chrome.i18n.getMessage("extName"). A new fil
e named _locales/en/messages.json defines "extName".' |
| 58 width="782" height="228"> | 58 width="782" height="228"> |
| 59 | 59 |
| 60 <p class="note"> | 60 <p class="note"> |
| 61 <b>Important:</b> | 61 <b>Important:</b> |
| 62 If an extension has a <code>_locales</code> directory, | 62 If an extension has a <code>_locales</code> directory, |
| 63 the <a href="manifest.html">manifest</a> | 63 the <a href="manifest">manifest</a> |
| 64 <b>must</b> define "default_locale". | 64 <b>must</b> define "default_locale". |
| 65 </p> | 65 </p> |
| 66 | 66 |
| 67 <p> | 67 <p> |
| 68 Some notes about internationalizing: | 68 Some notes about internationalizing: |
| 69 </p> | 69 </p> |
| 70 | 70 |
| 71 <ul> | 71 <ul> |
| 72 <li><p> | 72 <li><p> |
| 73 You can use any of the <a href="#overview-locales">supported locales</a>. | 73 You can use any of the <a href="#overview-locales">supported locales</a>. |
| (...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 122 { | 122 { |
| 123 "search_string": { | 123 "search_string": { |
| 124 "message": "hello%20world", | 124 "message": "hello%20world", |
| 125 "description": "The string we search for. Put %20 between words that go toge
ther." | 125 "description": "The string we search for. Put %20 between words that go toge
ther." |
| 126 }, | 126 }, |
| 127 ... | 127 ... |
| 128 }</pre> | 128 }</pre> |
| 129 | 129 |
| 130 <p> | 130 <p> |
| 131 For more information, see | 131 For more information, see |
| 132 <a href="i18n-messages.html">Formats: Locale-Specific Messages</a>. | 132 <a href="i18n-messages">Formats: Locale-Specific Messages</a>. |
| 133 </p> | 133 </p> |
| 134 </li> | 134 </li> |
| 135 </ul> | 135 </ul> |
| 136 | 136 |
| 137 <p> | 137 <p> |
| 138 Once an extension or app is internationalized, | 138 Once an extension or app is internationalized, |
| 139 translating it is simple. | 139 translating it is simple. |
| 140 You copy <code>messages.json</code>, | 140 You copy <code>messages.json</code>, |
| 141 translate it, | 141 translate it, |
| 142 and put the copy into a new directory under <code>_locales</code>. | 142 and put the copy into a new directory under <code>_locales</code>. |
| (...skipping 12 matching lines...) Expand all Loading... |
| 155 <h2 id="overview-predefined">Predefined messages</h2> | 155 <h2 id="overview-predefined">Predefined messages</h2> |
| 156 | 156 |
| 157 <p> | 157 <p> |
| 158 The internationalization system provides a few predefined | 158 The internationalization system provides a few predefined |
| 159 messages to help you localize. | 159 messages to help you localize. |
| 160 These include <code>@@ui_locale</code>, | 160 These include <code>@@ui_locale</code>, |
| 161 so you can detect the current UI locale, | 161 so you can detect the current UI locale, |
| 162 and a few <code>@@bidi_...</code> messages | 162 and a few <code>@@bidi_...</code> messages |
| 163 that let you detect the text direction. | 163 that let you detect the text direction. |
| 164 The latter messages have similar names to constants in the | 164 The latter messages have similar names to constants in the |
| 165 <a href="http://code.google.com/apis/gadgets/docs/i18n.html#BIDI"> | 165 <a href="http://code.google.com/apis/gadgets/docs/i18n#BIDI"> |
| 166 gadgets BIDI (bi-directional) API</a>. | 166 gadgets BIDI (bi-directional) API</a>. |
| 167 </p> | 167 </p> |
| 168 | 168 |
| 169 <p> | 169 <p> |
| 170 The special message <code>@@extension_id</code> | 170 The special message <code>@@extension_id</code> |
| 171 can be used in the CSS and JavaScript files, | 171 can be used in the CSS and JavaScript files, |
| 172 whether or not the extension or app is localized. | 172 whether or not the extension or app is localized. |
| 173 This message doesn't work in manifest files. | 173 This message doesn't work in manifest files. |
| 174 </p> | 174 </p> |
| 175 | 175 |
| (...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 277 including some (such as <code>en</code>) | 277 including some (such as <code>en</code>) |
| 278 that let a single translation support multiple variations of a language | 278 that let a single translation support multiple variations of a language |
| 279 (such as <code>en_GB</code> and <code>en_US</code>). | 279 (such as <code>en_GB</code> and <code>en_US</code>). |
| 280 </p> | 280 </p> |
| 281 | 281 |
| 282 | 282 |
| 283 <h3 id="locales-supported">Supported locales</h3> | 283 <h3 id="locales-supported">Supported locales</h3> |
| 284 | 284 |
| 285 <p> | 285 <p> |
| 286 You can use any of the | 286 You can use any of the |
| 287 <a href="http://code.google.com/chrome/webstore/docs/i18n.html#localeTable">loca
les that the Chrome Web Store supports</a>. | 287 <a href="http://code.google.com/chrome/webstore/docs/i18n#localeTable">locales t
hat the Chrome Web Store supports</a>. |
| 288 </p> | 288 </p> |
| 289 | 289 |
| 290 | 290 |
| 291 <h3 id="locales-usage">Searching for messages</h3> | 291 <h3 id="locales-usage">Searching for messages</h3> |
| 292 | 292 |
| 293 <p> | 293 <p> |
| 294 You don't have to define every string for every supported locale. | 294 You don't have to define every string for every supported locale. |
| 295 As long as the default locale's <code>messages.json</code> file | 295 As long as the default locale's <code>messages.json</code> file |
| 296 has a value for every string, | 296 has a value for every string, |
| 297 your extension or app will run no matter how sparse a translation is. | 297 your extension or app will run no matter how sparse a translation is. |
| (...skipping 182 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 480 | 480 |
| 481 <h2 id="overview-examples">Examples</h2> | 481 <h2 id="overview-examples">Examples</h2> |
| 482 | 482 |
| 483 <p> | 483 <p> |
| 484 You can find simple examples of internationalization in the | 484 You can find simple examples of internationalization in the |
| 485 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/api/i18n/">examples/api/i18n</a> | 485 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/api/i18n/">examples/api/i18n</a> |
| 486 directory. | 486 directory. |
| 487 For a complete example, see | 487 For a complete example, see |
| 488 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news/">examples/extensions/news</a>. | 488 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/extensions/news/">examples/extensions/news</a>. |
| 489 For other examples and for help in viewing the source code, see | 489 For other examples and for help in viewing the source code, see |
| 490 <a href="samples.html">Samples</a>. | 490 <a href="samples">Samples</a>. |
| 491 </p> | 491 </p> |
| 492 | 492 |
| 493 | 493 |
| 494 <h3 id="examples-getMessage">Examples: getMessage</h3> | 494 <h3 id="examples-getMessage">Examples: getMessage</h3> |
| 495 | 495 |
| 496 <!-- | 496 <!-- |
| 497 [PENDING: improve this section. it should probably start with a | 497 [PENDING: improve this section. it should probably start with a |
| 498 one-variable example that includes the messages.json code.] | 498 one-variable example that includes the messages.json code.] |
| 499 --> | 499 --> |
| 500 | 500 |
| (...skipping 27 matching lines...) Expand all Loading... |
| 528 "details": { | 528 "details": { |
| 529 "content": "$1", | 529 "content": "$1", |
| 530 "example": "Failed to fetch RSS feed." | 530 "example": "Failed to fetch RSS feed." |
| 531 } | 531 } |
| 532 } | 532 } |
| 533 } | 533 } |
| 534 </pre> | 534 </pre> |
| 535 | 535 |
| 536 <p> | 536 <p> |
| 537 For more information about placeholders, see the | 537 For more information about placeholders, see the |
| 538 <a href="i18n-messages.html">Locale-Specific Messages</a> page. | 538 <a href="i18n-messages">Locale-Specific Messages</a> page. |
| 539 For details on calling <code>getMessage()</code>, see the | 539 For details on calling <code>getMessage()</code>, see the |
| 540 $(ref:i18n.getMessage API reference). | 540 $(ref:i18n.getMessage API reference). |
| 541 </p> | 541 </p> |
| 542 | 542 |
| 543 <h3 id="example-accept-languages">Example: getAcceptLanguages</h3> | 543 <h3 id="example-accept-languages">Example: getAcceptLanguages</h3> |
| 544 <p> | 544 <p> |
| 545 The following code gets accept-languages from the browser and displays them as a | 545 The following code gets accept-languages from the browser and displays them as a |
| 546 string by separating each accept-language with ','. | 546 string by separating each accept-language with ','. |
| 547 </p> | 547 </p> |
| 548 | 548 |
| 549 <pre> | 549 <pre> |
| 550 function getAcceptLanguages() { | 550 function getAcceptLanguages() { |
| 551 chrome.i18n.getAcceptLanguages(function(languageList) { | 551 chrome.i18n.getAcceptLanguages(function(languageList) { |
| 552 var languages = languageList.join(","); | 552 var languages = languageList.join(","); |
| 553 document.getElementById("languageSpan").innerHTML = languages; | 553 document.getElementById("languageSpan").innerHTML = languages; |
| 554 }) | 554 }) |
| 555 } | 555 } |
| 556 </pre> | 556 </pre> |
| 557 | 557 |
| 558 <p> | 558 <p> |
| 559 For details on calling <code>getAcceptLanguages()</code>, see the | 559 For details on calling <code>getAcceptLanguages()</code>, see the |
| 560 $(ref:i18n.getAcceptLanguages API reference). | 560 $(ref:i18n.getAcceptLanguages API reference). |
| 561 </p> | 561 </p> |
| OLD | NEW |