299 lines
19 KiB
HTML
299 lines
19 KiB
HTML
<!doctype html>
|
||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
|
||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
|
||
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
|
||
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||
<title>Frontend Translation - Home Assistant</title>
|
||
<meta name="author" content="Home Assistant">
|
||
<meta name="description" content="How to translate the frontend for Home Assistant.">
|
||
<meta name="viewport" content="width=device-width">
|
||
<link rel="canonical" href="https://home-assistant.io/developers/frontend_translation/">
|
||
<meta property="fb:app_id" content="338291289691179">
|
||
<meta property="og:title" content="Frontend Translation">
|
||
<meta property="og:site_name" content="Home Assistant">
|
||
<meta property="og:url" content="https://home-assistant.io/developers/frontend_translation/">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:description" content="How to translate the frontend for Home Assistant.">
|
||
<meta property="og:image" content="https://home-assistant.io/images/default-social.png">
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:site" content="@home_assistant">
|
||
<meta name="twitter:title" content="Frontend Translation">
|
||
<meta name="twitter:description" content="How to translate the frontend for Home Assistant.">
|
||
<meta name="twitter:image" content="https://home-assistant.io/images/default-social.png">
|
||
<link href="/stylesheets/screen.css" media="screen, projection, print" rel="stylesheet">
|
||
<link href="/atom.xml" rel="alternate" title="Home Assistant" type="application/atom+xml">
|
||
<link rel='shortcut icon' href='/images/favicon.ico' />
|
||
<link rel='icon' type='image/png' href='/images/favicon-192x192.png' sizes='192x192' />
|
||
</head>
|
||
<body >
|
||
<header class='site-header'>
|
||
<div class="grid-wrapper">
|
||
<div class="grid">
|
||
<div class="grid__item three-tenths lap-two-sixths palm-one-whole ha-title">
|
||
<a href="/" class="site-title">
|
||
<img width='40' src='/demo/favicon-192x192.png'>
|
||
<span>Home Assistant</span>
|
||
</a>
|
||
</div>
|
||
<div class="grid__item seven-tenths lap-four-sixths palm-one-whole">
|
||
<nav>
|
||
<input type="checkbox" id="toggle">
|
||
<label for="toggle" class="toggle" data-open="Main Menu" data-close="Close Menu"></label>
|
||
<ul class="menu pull-right">
|
||
<li><a href="/getting-started/">Getting started</a></li>
|
||
<li><a href="/components/">Components</a></li>
|
||
<li><a href="/docs/">Docs</a></li>
|
||
<li><a href="/cookbook/">Examples</a></li>
|
||
<li><a href="/developers/">Developers</a></li>
|
||
<li><a href="/blog/">Blog</a></li>
|
||
<li><a href="/help/">Need help?</a></li>
|
||
<li><a href='#' class='show-search'><i class="icon-search"></i></a></li>
|
||
</ul>
|
||
</nav>
|
||
<div class='search-container' style='display: none'>
|
||
<div class='search'>
|
||
<i class="icon-search"></i>
|
||
<input id='search' placeholder='Search the docs…'>
|
||
<a href='#' class='close'><i class="icon-remove-sign"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
<div class="grid-wrapper">
|
||
<div class="grid grid-center">
|
||
<div class="grid__item two-thirds lap-one-whole palm-one-whole">
|
||
<article class="page">
|
||
<header>
|
||
<h1 class="title indent">
|
||
Frontend Translation
|
||
</h1>
|
||
</header>
|
||
<hr class="divider">
|
||
<h2><a class="title-link" name="how-to-start" href="#how-to-start"></a> How to start</h2>
|
||
<p><a href="https://lokalise.co/signup/3420425759f6d6d241f598.13594006/all/">Join the translation team</a> and choose your language. Even if your language is completely translated, extra proofreading is a big help! Please feel free to review the existing translations, and vote for alternatives that might be more appropriate.</p>
|
||
<p>First time users may find it helpful to switch between multilanguage and single language view using the <img src="/images/frontend/lokalise-multilanguage-view-button.png" alt="Multilanguage view" style="width: 17px; border: none;" /> button. For more information about the translation workflow, please see the <a href="https://docs.lokalise.co/category/iOzEuQPS53-for-team-leads-and-translators">Lokalise translation workflow documents</a>.</p>
|
||
<p class="note">
|
||
The translation of the Home Assistant frontend is still a work in progress. More phrases will be available for translation soon.
|
||
</p>
|
||
<h2><a class="title-link" name="translation-placeholders" href="#translation-placeholders"></a> Translation placeholders</h2>
|
||
<p>Some translation strings will contain special placeholders that will be replaced later. Placeholders shown in square brackets <code class="highlighter-rouge">[]</code> are <a href="https://docs.lokalise.co/article/KO5SZWLLsy-key-referencing">Lokalise key references</a>. These are primarily used to link translation strings that will be duplicated. Different languages may not have the same duplicates as English, and are welcome to link duplicate translations that are not linked in English. Placeholders shown in curly brackets <code class="highlighter-rouge"><span class="p">{}</span></code> are <a href="https://formatjs.io/guides/message-syntax/">translation arguments</a> that will be replaced with a live value when Home Assistant is running. Any translation argument placeholders present in the original string must be included in the translated string. These may include special syntax for defining plurals or other replacement rules. The linked format.js guide explains the syntax for adding plural definitions and other rules.</p>
|
||
<h2><a class="title-link" name="rules" href="#rules"></a> Rules</h2>
|
||
<ol>
|
||
<li>Only native speakers should submit translations.</li>
|
||
<li>Stick to <a href="https://material.io/guidelines/style/writing.html">Material Design guidelines</a>.</li>
|
||
<li>Don’t translate or change proper nouns like <code class="highlighter-rouge">Home Assistant</code>, <code class="highlighter-rouge">Hass.io</code> or <code class="highlighter-rouge">Hue</code>.</li>
|
||
<li>For a region specific translation, keys that will be the same as the base translation should be filled with <code class="highlighter-rouge">[VOID]</code>. These will be replaced during our translation build process.</li>
|
||
<li>Translations under the <code class="highlighter-rouge">state_badge</code> keys will be used for the notification badge display. These translations should be short enough to fit in the badge label without overflowing. This can be tested in the Home Assistant UI either by editing the label text with your browsers development tools, or by using the States <img src="/images/screenshots/developer-tool-states-icon.png" alt="" class="no-shadow" height="38" /> developer tool in the Home Assistant UI. In the UI, enter a new entity ID (<code class="highlighter-rouge">device_tracker.test</code>), and enter the text you want to test in state.</li>
|
||
<li>If text will be duplicated across different translation keys, make use of the Lokalise key reference feature where possible. The base translation provides examples of this underneath the <code class="highlighter-rouge">states</code> translations. Please see the <a href="https://docs.lokalise.co/article/KO5SZWLLsy-key-referencing">Lokalise key referencing</a> documentation for more details.</li>
|
||
</ol>
|
||
<h2><a class="title-link" name="adding-a-new-language" href="#adding-a-new-language"></a> Adding a new language</h2>
|
||
<p>If your language is not listed you can request it at <a href="https://github.com/home-assistant/home-assistant-polymer/issues/new">GitHub</a>. Please provide both the English name and the native name for your language. For example:</p>
|
||
<div class="highlighter-rouge"><pre class="highlight"><code>English Name: German
|
||
Native Name: Deutsch
|
||
</code></pre>
|
||
</div>
|
||
<p class="note">
|
||
Region specific translations (<code class="highlighter-rouge">en-US</code>, <code class="highlighter-rouge">fr-CA</code>) will only be included if translations for that region need to differ from the base language translation.
|
||
</p>
|
||
<h3><a class="title-link" name="maintainer-steps-to-add-a-new-language" href="#maintainer-steps-to-add-a-new-language"></a> Maintainer steps to add a new language</h3>
|
||
<ol>
|
||
<li>Language tags have to follow <a href="https://tools.ietf.org/html/bcp47">BCP 47</a>. A list of most language tags can be found here: <a href="http://www.iana.org/assignments/language-subtag-registry/language-subtag-registry">IANA sutbtag registry</a>. Examples: <code class="highlighter-rouge">fr</code>, <code class="highlighter-rouge">fr-CA</code>, <code class="highlighter-rouge">zh-Hans</code>. Only include the country code if country specific overrides are being included, and the base language is already translated.</li>
|
||
<li>Add the language tag and native name in <code class="highlighter-rouge">src/translations/translationMetadata.json</code>. Examples: “Français”, “Français (CA)”</li>
|
||
<li>Add the new language in Lokalize.
|
||
Note: Sometimes you have to change the tag in Lokalise (Language -> Language settings -> custom ISO code).</li>
|
||
</ol>
|
||
</article>
|
||
</div>
|
||
<aside id="sidebar" class="grid__item one-third lap-one-whole palm-one-whole">
|
||
<div class="grid">
|
||
<section class="aside-module grid__item one-whole lap-one-half">
|
||
<div class='edit-github'><a href='https://github.com/home-assistant/home-assistant.github.io/tree/current/source/developers/frontend_translation.markdown'>Edit this page on GitHub</a></div>
|
||
<div class='section'>
|
||
<h1 class="title delta">Development Guide</h1>
|
||
<ul class='divided sidebar-menu'>
|
||
<li>
|
||
<a href='/developers/'>Introduction </a>
|
||
<ul>
|
||
<li><a href='/developers/architecture/'>Architecture </a></li>
|
||
<li><a href='/developers/architecture_components/'>Components </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/development/'>Starting with Development </a>
|
||
<ul>
|
||
<li><a href='/developers/development_environment/'>Setting up Environment </a></li>
|
||
<li><a href='/developers/development_submitting/'>Submit your Work </a></li>
|
||
<li><a href='/developers/development_checklist/'>Checklist </a></li>
|
||
<li><a href='/developers/development_guidelines/'>Style guidelines </a></li>
|
||
<li><a href='/developers/development_testing/'>Testing </a></li>
|
||
<li><a href='/developers/development_catching_up/'>Catching up with Reality </a></li>
|
||
<li><a href='/developers/development_validation/'>Validation </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/development_101/'>Development 101 </a>
|
||
<ul>
|
||
<li><a href='/developers/development_hass_object/'>Hass object </a></li>
|
||
<li><a href='/developers/development_events/'>Events </a></li>
|
||
<li><a href='/developers/development_states/'>States </a></li>
|
||
<li><a href='/developers/development_services/'>Services </a></li>
|
||
<li><a href='/developers/development_config/'>Config </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/add_new_platform/'>Creating a new platform (to support a new device) </a>
|
||
<ul>
|
||
<li><a href='/developers/code_review_platform/'>Checklist creating a platform </a></li>
|
||
<li><a href='/developers/platform_example_sensor/'>Example sensor platform </a></li>
|
||
<li><a href='/developers/platform_example_light/'>Example light platform </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/creating_components/'>Adding a new component </a>
|
||
<ul>
|
||
<li><a href='/developers/code_review_component/'>Checklist creating a component </a></li>
|
||
<li><a href='/developers/component_loading/'>Loading components </a></li>
|
||
<li><a href='/developers/component_deps_and_reqs/'>Requirements & Dependencies </a></li>
|
||
<li><a href='/developers/component_events/'>Handling events </a></li>
|
||
<li><a href='/developers/component_states/'>States </a></li>
|
||
<li><a href='/developers/component_visibility/'>Visibility </a></li>
|
||
<li><a href='/developers/component_generic_discovery/'>Loading Platforms </a></li>
|
||
<li><a href='/developers/component_discovery/'>Component Discovery </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/intent/'>Intents (handling voice responses) </a>
|
||
<ul>
|
||
<li><a href='/developers/intent/firing/'>Firing intents </a></li>
|
||
<li><a href='/developers/intent/handling/'>Handling intents </a></li>
|
||
<li><a href='/developers/intent/conversation/'>Registering sentences </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/asyncio/'>Asynchronous Programming </a>
|
||
<ul>
|
||
<li><a href='/developers/asyncio_101/'>Introduction to asyncio </a></li>
|
||
<li><a href='/developers/asyncio_categorizing_functions/'>Categorizing Functions </a></li>
|
||
<li><a href='/developers/asyncio_working_with_async/'>Working with Async </a></li>
|
||
<li><a href='/developers/asyncio_misc/'>Miscellaneous </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/frontend/'>Frontend Development </a>
|
||
<ul>
|
||
<li><a href='/developers/frontend_add_card/'>Add State Card </a></li>
|
||
<li><a href='/developers/frontend_add_more_info/'>Add More Info Dialog </a></li>
|
||
<li><a href='/developers/frontend_creating_custom_panels/'>Add Custom Panels </a></li>
|
||
<li><a href='/developers/frontend_creating_custom_ui/'>Add Custom UI </a></li>
|
||
<li><a class='active' href='/developers/frontend_translation/'>Translation </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/hassio/architecture/'>Hass.io architecture </a>
|
||
<ul>
|
||
<li><a href='/developers/hassio/debugging/'>Debugging Hass.io </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/hassio/addon_development/'>Hass.io Add-on Development </a>
|
||
<ul>
|
||
<li><a href='/developers/hassio/addon_tutorial/'>Tutorial: Making your first add-on </a></li>
|
||
<li><a href='/developers/hassio/addon_config/'>Configuration </a></li>
|
||
<li><a href='/developers/hassio/addon_communication/'>Communication </a></li>
|
||
<li><a href='/developers/hassio/addon_testing/'>Local Testing </a></li>
|
||
<li><a href='/developers/hassio/addon_publishing/'>Publishing </a></li>
|
||
<li><a href='/developers/hassio/addon_presentation/'>Presentation </a></li>
|
||
<li><a href='/developers/hassio/addon_repository/'>Repositories </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/api/'>API </a>
|
||
<ul>
|
||
<li><a href='https://dev-docs.home-assistant.io/en/dev/'>Python API </a></li>
|
||
<li><a href='/developers/websocket_api/'>Websocket API </a></li>
|
||
<li><a href='/developers/rest_api/'>REST API </a></li>
|
||
<li><a href='/developers/python_api/'>Python REST API </a></li>
|
||
<li><a href='/developers/server_sent_events/'>Server-sent events </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/documentation/'>Website/Documentation </a>
|
||
<ul>
|
||
<li><a href='/developers/documentation/standards/'>Standards </a></li>
|
||
<li><a href='/developers/documentation/create_page/'>Create a new page </a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href='/developers/helpers/'>Online helpers </a></li>
|
||
<li><a href='/developers/releasing/'>Releasing </a></li>
|
||
<li><a href='/developers/maintenance/'>Maintenance </a></li>
|
||
<li>
|
||
Governance
|
||
<ul>
|
||
<li><a href='/developers/cla/'>Contributor License Agreement </a></li>
|
||
<li><a href='/privacy/'>Privacy Policy </a></li>
|
||
<li><a href='/tos/'>Terms of Service </a></li>
|
||
<li><a href='/code_of_conduct/'>Code of Conduct </a></li>
|
||
<li><a href='/developers/credits/'>Credits </a></li>
|
||
<li><a href='/developers/license/'>License </a></li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
</div>
|
||
<footer>
|
||
<div class="grid-wrapper">
|
||
<div class="grid">
|
||
<div class="grid__item">
|
||
<div class="copyright">
|
||
<a rel="me" href='https://twitter.com/home_assistant'><i class="icon-twitter"></i></a>
|
||
<a rel="me" href='https://facebook.com/homeassistantio'><i class="icon-facebook"></i></a>
|
||
<a rel="me" href='https://plus.google.com/110560654828510104551'><i class="icon-google-plus"></i></a>
|
||
<a rel="me" href='https://github.com/home-assistant/home-assistant'><i class="icon-github"></i></a>
|
||
<div class="credit">
|
||
Contact us at <a href='mailto:hello@home-assistant.io'>hello@home-assistant.io</a> (no support!).<br>
|
||
Website powered by <a href='http://jekyllrb.com/'>Jekyll</a> and the <a href='https://github.com/coogie/oscailte'>Oscalite theme</a>.<br />
|
||
Hosted by <a href='https://pages.github.com/'>GitHub</a> and served by <a href='https://cloudflare.com'>CloudFlare</a>.
|
||
</div>
|
||
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">home-assistant.io</span> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License</a>.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
<script>
|
||
var _gaq=[['_setAccount','UA-57927901-1'],['_trackPageview']];
|
||
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
|
||
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
|
||
s.parentNode.insertBefore(g,s)}(document,'script'));
|
||
</script>
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
|
||
<script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||
<script type="text/javascript">
|
||
docsearch({
|
||
apiKey: 'ae96d94b201c5444c8a443093edf3efb',
|
||
indexName: 'home-assistant',
|
||
inputSelector: '#search',
|
||
debug: false // Set debug to true if you want to inspect the dropdown
|
||
});
|
||
document.querySelector('.search .close').addEventListener('click', function(ev) {
|
||
ev.preventDefault();
|
||
document.querySelector('.search-container').style.display = 'none';
|
||
});
|
||
document.querySelector('.show-search').addEventListener('click', function(ev) {
|
||
ev.preventDefault();
|
||
document.querySelector('.search-container').style.display = 'block';
|
||
document.getElementById('toggle').checked = false;
|
||
document.querySelector('.search-container input').focus();
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|