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

Side by Side Diff: chrome/common/extensions/docs/server2/templates/intros/i18n.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">Internationalization (i18n)</div>
2
3 <!-- 1 <!--
4 [NOTEs for editors: 2 [NOTEs for editors:
5 * 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).
6 --> 4 -->
7 5
8 <!-- BEGIN AUTHORED CONTENT --> 6
9 <p id="classSummary"> 7 <p id="classSummary">
10 An <em>internationalized</em> extension 8 An <em>internationalized</em> extension
11 can be easily 9 can be easily
12 <em>localized</em> &mdash; 10 <em>localized</em> &mdash;
13 adapted to languages and regions 11 adapted to languages and regions
14 that it didn't originally support. 12 that it didn't originally support.
15 </p> 13 </p>
16 14
17 <p> 15 <p>
18 To internationalize your extension, 16 To internationalize your extension,
19 you need to put all of its user-visible strings into a file 17 you need to put all of its user-visible strings into a file
20 named <a href="i18n-messages.html"><code>messages.json</code></a>. 18 named <a href="i18n-messages.html"><code>messages.json</code></a>.
21 Each time you localize your extension 19 Each time you localize your extension
22 you add a messages file 20 you add a messages file
23 under a directory 21 under a directory
24 named <code>_locales/<em>localeCode</em></code>, 22 named <code>_locales/<em>localeCode</em></code>,
25 where <em>localeCode</em> is a code such as 23 where <em>localeCode</em> is a code such as
26 <code>en</code> for English. 24 <code>en</code> for English.
27 </p> 25 </p>
28 26
29 <p> 27 <p>
30 Here's the file hierarchy 28 Here's the file hierarchy
31 for an internationalized extension that supports 29 for an internationalized extension that supports
32 English (<code>en</code>), 30 English (<code>en</code>),
33 Spanish (<code>es</code>), and 31 Spanish (<code>es</code>), and
34 Korean (<code>ko</code>): 32 Korean (<code>ko</code>):
35 </p> 33 </p>
36 34
37 <img src="../images/i18n-hierarchy.gif" 35 <img src="{{static}}/images/i18n-hierarchy.gif"
38 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.' 36 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.'
39 width="385" height="77" /> 37 width="385" height="77" />
40 38
41 39
42 <h2 id="l10">How to support multiple languages</h2> 40 <h2 id="l10">How to support multiple languages</h2>
43 41
44 <p> 42 <p>
45 Say you have an extension 43 Say you have an extension
46 with the files shown in the following figure: 44 with the files shown in the following figure:
47 </p> 45 </p>
48 46
49 <img src="../images/i18n-before.gif" 47 <img src="{{static}}/images/i18n-before.gif"
50 alt='A manifest.json file and a file with JavaScript. The .json file has "name" : "Hello World". The JavaScript file has title = "Hello World";' 48 alt='A manifest.json file and a file with JavaScript. The .json file has "name" : "Hello World". The JavaScript file has title = "Hello World";'
51 width="323" height="148"> 49 width="323" height="148">
52 50
53 <p> 51 <p>
54 To internationalize this extension, 52 To internationalize this extension,
55 you name each user-visible string 53 you name each user-visible string
56 and put it into a messages file. 54 and put it into a messages file.
57 The extension's manifest, 55 The extension's manifest,
58 CSS files, 56 CSS files,
59 and JavaScript code 57 and JavaScript code
60 use each string's name to get its localized version. 58 use each string's name to get its localized version.
61 </p> 59 </p>
62 60
63 <p> 61 <p>
64 Here's what the extension looks like when it's internationalized 62 Here's what the extension looks like when it's internationalized
65 (note that it still has only English strings): 63 (note that it still has only English strings):
66 </p> 64 </p>
67 65
68 <img src="../images/i18n-after-1.gif" 66 <img src="{{static}}/images/i18n-after-1.gif"
69 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".' 67 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".'
70 width="782" height="228"> 68 width="782" height="228">
71 69
72 <p class="note"> 70 <p class="note">
73 <b>Important:</b> 71 <b>Important:</b>
74 If an extension has a <code>_locales</code> directory, 72 If an extension has a <code>_locales</code> directory,
75 the <a href="manifest.html">manifest</a> 73 the <a href="manifest.html">manifest</a>
76 <b>must</b> define "default_locale". 74 <b>must</b> define "default_locale".
77 </p> 75 </p>
78 76
(...skipping 73 matching lines...) Expand 10 before | Expand all | Expand 10 after
152 You copy <code>messages.json</code>, 150 You copy <code>messages.json</code>,
153 translate it, 151 translate it,
154 and put the copy into a new directory under <code>_locales</code>. 152 and put the copy into a new directory under <code>_locales</code>.
155 For example, to support Spanish, 153 For example, to support Spanish,
156 just put a translated copy of <code>messages.json</code> 154 just put a translated copy of <code>messages.json</code>
157 under <code>_locales/es</code>. 155 under <code>_locales/es</code>.
158 The following figure shows the previous extension 156 The following figure shows the previous extension
159 with a new Spanish translation. 157 with a new Spanish translation.
160 </p> 158 </p>
161 159
162 <img src="../images/i18n-after-2.gif" 160 <img src="{{static}}/images/i18n-after-2.gif"
163 alt='This looks the same as the previous figure, but with a new file at _locale s/es/messages.json that contains a Spanish translation of the messages.' 161 alt='This looks the same as the previous figure, but with a new file at _locale s/es/messages.json that contains a Spanish translation of the messages.'
164 width="782" height="358"> 162 width="782" height="358">
165 163
166 164
167 <h2 id="overview-predefined">Predefined messages</h2> 165 <h2 id="overview-predefined">Predefined messages</h2>
168 166
169 <p> 167 <p>
170 The internationalization system provides a few predefined 168 The internationalization system provides a few predefined
171 messages to help you localize your extension. 169 messages to help you localize your extension.
172 These include <code>@@ui_locale</code>, 170 These include <code>@@ui_locale</code>,
(...skipping 176 matching lines...) Expand 10 before | Expand all | Expand 10 after
349 but "extName" is in only two of the locales. 347 but "extName" is in only two of the locales.
350 Wherever a user running Google Chrome in US English sees the label "Colors", 348 Wherever a user running Google Chrome in US English sees the label "Colors",
351 a user of British English sees "Colours". 349 a user of British English sees "Colours".
352 Both US English and British English users 350 Both US English and British English users
353 see the extension name "Hello World". 351 see the extension name "Hello World".
354 Because the default language is Spanish, 352 Because the default language is Spanish,
355 users running Google Chrome in any non-English language 353 users running Google Chrome in any non-English language
356 see the label "Colores" and the extension name "Hola mundo". 354 see the label "Colores" and the extension name "Hola mundo".
357 </p> 355 </p>
358 356
359 <img src="../images/i18n-strings.gif" 357 <img src="{{static}}/images/i18n-strings.gif"
360 alt='Four files: manifest.json and three messages.json files (for es, en, and e n_GB). The es and en files show entries for messages named "extName" and "color es"; the en_GB file has just one entry (for "colores").' 358 alt='Four files: manifest.json and three messages.json files (for es, en, and e n_GB). The es and en files show entries for messages named "extName" and "color es"; the en_GB file has just one entry (for "colores").'
361 width="493" height="488" /> 359 width="493" height="488" />
362 360
363 <h3 id="locales-testing">How to set your browser's locale</h3> 361 <h3 id="locales-testing">How to set your browser's locale</h3>
364 362
365 <p> 363 <p>
366 To test translations, you might want to set your browser's locale. 364 To test translations, you might want to set your browser's locale.
367 This section tells you how to set the locale in 365 This section tells you how to set the locale in
368 <a href="#testing-win">Windows</a>, 366 <a href="#testing-win">Windows</a>,
369 <a href="#testing-mac">Mac OS X</a>, and 367 <a href="#testing-mac">Mac OS X</a>, and
(...skipping 194 matching lines...) Expand 10 before | Expand all | Expand 10 after
564 chrome.i18n.getAcceptLanguages(function(languageList) { 562 chrome.i18n.getAcceptLanguages(function(languageList) {
565 var languages = languageList.join(","); 563 var languages = languageList.join(",");
566 document.getElementById("languageSpan").innerHTML = languages; 564 document.getElementById("languageSpan").innerHTML = languages;
567 }) 565 })
568 } 566 }
569 </pre> 567 </pre>
570 568
571 <p> 569 <p>
572 For details on calling <code>getAcceptLanguages()</code>, see the 570 For details on calling <code>getAcceptLanguages()</code>, see the
573 <a href="#method-getAcceptLanguages">API reference</a>. 571 <a href="#method-getAcceptLanguages">API reference</a>.
574 </p> 572 </p>
575
576 <!-- END AUTHORED CONTENT -->
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698