308 lines
No EOL
13 KiB
HTML
308 lines
No EOL
13 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>Website home-assistant.io - Home Assistant</title>
|
||
<meta name="author" content="Home Assistant">
|
||
<meta name="description" content="home-assistant.io web presence">
|
||
|
||
<meta name="viewport" content="width=device-width">
|
||
<link rel="canonical" href="https://home-assistant.io/developers/website/">
|
||
|
||
<meta property="fb:app_id" content="338291289691179">
|
||
<meta property="og:title" content="Website home-assistant.io">
|
||
<meta property="og:site_name" content="Home Assistant">
|
||
<meta property="og:url" content="https://home-assistant.io/developers/website/">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:description" content="home-assistant.io web presence">
|
||
<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="Website home-assistant.io">
|
||
<meta name="twitter:description" content="home-assistant.io web presence">
|
||
<meta name="twitter:image" content="https://home-assistant.io/images/default-social.png">
|
||
|
||
<link href="/stylesheets/screen.css" media="screen, projection" 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>
|
||
<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='/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>
|
||
</ul>
|
||
</nav>
|
||
</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">
|
||
Website home-assistant.io
|
||
</h1>
|
||
</header>
|
||
<hr class="divider">
|
||
|
||
|
||
<p>The website you’re reading now is the home of Home Assistant: <a href="https://home-assistant.io">https://home-assistant.io</a>. This is the place where we provide documentation and additional details about Home Assistant for end users and developers.</p>
|
||
|
||
<p>home-assistant.io is built using <a href="http://github.com/mojombo/jekyll">Jekyll</a>. The pages are written in <a href="http://daringfireball.net/projects/markdown/">markdown</a>; to add a page you don’t need to know about HTML or the like.</p>
|
||
|
||
<p>The link “<strong>Edit this page on GitHub</strong>” allows one to edit pages without creating a fork.</p>
|
||
|
||
<p>For larger changes, we suggest that you clone the website repository. This has the advantage that you can review your changes locally. The process for working on the website is no different from working on Home Assistant itself. You work on your change and propose it via a pull request.</p>
|
||
|
||
<p>To test your changes locally, you need to install the <strong>Ruby</strong> dependencies (gems):</p>
|
||
|
||
<ul>
|
||
<li><a href="https://www.ruby-lang.org/en/documentation/installation/">Install Ruby</a> if you don’t have it already.</li>
|
||
<li>Install <code class="highlighter-rouge">bundler</code>, which is a dependency manager for Ruby: <code class="highlighter-rouge">gem install bundler</code></li>
|
||
<li>In your home-assistant.github.io root directory, run <code class="highlighter-rouge">bundle</code> to install the gems you need.</li>
|
||
</ul>
|
||
|
||
<p>Then you can work on the documentation:</p>
|
||
|
||
<ul>
|
||
<li>Fork home-assistant.io <a href="https://github.com/home-assistant/home-assistant.github.io">git repository</a>.</li>
|
||
<li>Create/edit/update a page in the directory <code class="highlighter-rouge">source/_components/</code> for your platform/component.</li>
|
||
<li>Test your changes to home-assistant.io locally: run <code class="highlighter-rouge">rake preview</code> and navigate to <a href="http://127.0.0.1:4000">http://127.0.0.1:4000</a></li>
|
||
<li>Create a Pull Request (PR) against the <strong>next</strong> branch of home-assistant.github.io if your documentation is for a new feature, platform, or component.</li>
|
||
<li>Create a Pull Request (PR) against the <strong>current</strong> branch of home-assistant.github.io if you fix stuff, create Cookbook entries, or expand existing documentation.</li>
|
||
</ul>
|
||
|
||
<h3><a class="title-link" name="create-a-page" href="#create-a-page"></a> Create a page</h3>
|
||
|
||
<p>For a platform page, the fastest way is to make a copy of an existing page and edit it. The <a href="/components/">Component overview</a> and the <a href="/cookbook/">Examples section</a> are generated automatically, so there is no need to add a link to those pages.</p>
|
||
|
||
<p>If you start from scratch with a page, you need to add a header. Different sections of the doumentation may need different headers.</p>
|
||
|
||
<div class="language-text highlighter-rouge"><pre class="highlight"><code>---
|
||
layout: page
|
||
title: "Website home-assistant.io"
|
||
description: "home-assistant.io web presence"
|
||
date: 2015-06-17 08:00
|
||
sidebar: true
|
||
comments: false
|
||
sharing: true
|
||
footer: true
|
||
---
|
||
|
||
Content...Written in markdown.
|
||
|
||
### {% linkable_title Linkable Header %}
|
||
...
|
||
</code></pre>
|
||
</div>
|
||
|
||
<p>There are <a href="https://jekyllrb.com/docs/variables/">pre-definied variables</a> available but usually it’s not necessary to use them when writing documentation.</p>
|
||
|
||
<h3><a class="title-link" name="embedding-code" href="#embedding-code"></a> Embedding Code</h3>
|
||
|
||
<p>You can use the default markdown syntax to generate syntax highlighted code. For inline code wrap your code in `. For multi line syntax wrap your code as shown below.</p>
|
||
|
||
<div class="language-text highlighter-rouge"><pre class="highlight"><code> ```yaml
|
||
sensor:
|
||
platform: template
|
||
```
|
||
</code></pre>
|
||
</div>
|
||
|
||
<p>If you are using templates then those parts needs to be <a href="http://stackoverflow.com/a/24102537">escaped</a>. Otherwise they will be rendered and appear blank on the website.</p>
|
||
|
||
<p>Note that you can replace <code class="highlighter-rouge">yaml</code> next to ``` with the language that is within the block.</p>
|
||
|
||
<p>When you’re writing code that is to be executed on the terminal, prefix it with <code class="highlighter-rouge">$</code>.</p>
|
||
|
||
<h3><a class="title-link" name="html" href="#html"></a> HTML</h3>
|
||
|
||
<p>The direct usage of HTML is supported but not recommanded. The note boxes are an exception.</p>
|
||
|
||
<div class="language-html highlighter-rouge"><pre class="highlight"><code><span class="nt"><p</span> <span class="na">class=</span><span class="s">'note warning'</span><span class="nt">></span>
|
||
You need to enable telnet on your router.
|
||
<span class="nt"></p></span>
|
||
</code></pre>
|
||
</div>
|
||
|
||
<h3><a class="title-link" name="images-icons-and-logos" href="#images-icons-and-logos"></a> Images, icons, and logos</h3>
|
||
|
||
<p>The images which are displayed on the pages are stored in various directories according to their purpose.</p>
|
||
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th style="text-align: left">Type</th>
|
||
<th style="text-align: left">Location</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td style="text-align: left">screenshots</td>
|
||
<td style="text-align: left">source/images/screenshots</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left">logos</td>
|
||
<td style="text-align: left">source/images/supported_brands</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<p>Not everything (product, component, etc.) has a logo. To show something for internal parts of Home Assistant we are using the <a href="https://materialdesignicons.com/">Material Design Icons</a>.</p>
|
||
|
||
|
||
</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/website.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_testing/'>Testing </a></li>
|
||
<li><a href='/developers/development_catching_up/'>Catching up with Reality </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/developers/add_new_platform/'>Support a new device (as a platform) </a>
|
||
<ul>
|
||
<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/component_loading/'>Loading components </a></li>
|
||
<li><a href='/developers/component_deps_and_reqs/'>Requirements & Dependencies </a></li>
|
||
<li><a href='/developers/component_initialization/'>Initialization </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>
|
||
Frontend Development
|
||
<ul>
|
||
<li><a href='/developers/frontend/'>Setup Frontend Environment </a></li>
|
||
<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>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
API
|
||
<ul>
|
||
<li><a href='/developers/rest_api/'>RESTful API </a></li>
|
||
<li><a href='/developers/python_api/'>Python API </a></li>
|
||
<li><a href='/developers/server_sent_events/'>Server-sent events </a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href='/developers/helpers/'>Online helpers </a></li>
|
||
<li><a href='/developers/multiple_instances/'>Multiple Instances </a></li>
|
||
<li><a class='active' href='/developers/website/'>Home-Assistant.io </a></li>
|
||
<li><a href='/developers/credits/'>Credits </a></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>.<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>
|
||
</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>
|
||
</body>
|
||
</html> |