251 lines
No EOL
12 KiB
HTML
251 lines
No EOL
12 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>Customizing devices and services - Home Assistant</title>
|
||
<meta name="author" content="Home Assistant">
|
||
<meta name="description" content="Simple customization for devices and services in the frontend.">
|
||
|
||
<meta name="viewport" content="width=device-width">
|
||
<link rel="canonical" href="https://home-assistant.io/getting-started/customizing-devices/">
|
||
|
||
<meta property="fb:app_id" content="338291289691179">
|
||
<meta property="og:title" content="Customizing devices and services">
|
||
<meta property="og:site_name" content="Home Assistant">
|
||
<meta property="og:url" content="https://home-assistant.io/getting-started/customizing-devices/">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:description" content="Simple customization for devices and services in the frontend.">
|
||
<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="Customizing devices and services">
|
||
<meta name="twitter:description" content="Simple customization for devices and services in the frontend.">
|
||
<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">
|
||
Customizing Devices and Services
|
||
</h1>
|
||
</header>
|
||
<hr class="divider">
|
||
|
||
|
||
<p>By default, all of your devices will be visible and have a default icon determined by their domain. You can customize the look and feel of your front page by altering some of these parameters. This can be done by adding the following configuration inside the <code>homeassistant:</code> section.</p>
|
||
|
||
<p>Devices that you don’t want to have visible can be hidden with <code>hidden</code>.</p>
|
||
|
||
<p><code>entity_picture</code>entries, badges, <code>device_tracker</code> pictures, etc. can either be external URLs (e.g. <code>http://example.com/example.jpg</code>) or of the form <code>/local/filename.jpg</code>, where <code>/local</code> represents the directory <code>www</code> in the HASS configuration directory. You may have to create the <code>www</code> directory yourself as it is not made automatically.</p>
|
||
|
||
<p>You can also use <code>icon</code> and refer to any icon from <a href="http://MaterialDesignIcons.com">MaterialDesignIcons.com</a>.</p>
|
||
|
||
<p>For switches with an assumed state two buttons are shown (turn off, turn on) instead of a switch. By setting <code>assumed_state</code> to <code>false</code> you will get the default switch icon.</p>
|
||
|
||
<div class="highlighter-coderay"><div class="CodeRay">
|
||
<div class="code"><pre><span class="comment"># Example configuration.yaml entry</span>
|
||
<span class="key">homeassistant</span>:
|
||
|
||
<span class="comment"># Add this to your existing configuration</span>
|
||
<span class="comment"># Only the `entity_id` is required. All other options are optional.</span>
|
||
<span class="key">customize</span>:
|
||
<span class="key">sensor.living_room_motion</span>:
|
||
<span class="key">hidden</span>: <span class="string"><span class="content">true</span></span>
|
||
<span class="key">thermostat.family_roomfamily_room</span>:
|
||
<span class="key">entity_picture</span>: <span class="string"><span class="content">https://dl.dropboxusercontent.com/u/12345/images/nest.jpg</span></span>
|
||
<span class="key">friendly_name</span>: <span class="string"><span class="content">Nest</span></span>
|
||
<span class="key">switch.wemo_switch_1</span>:
|
||
<span class="key">friendly_name</span>: <span class="string"><span class="content">Toaster</span></span>
|
||
<span class="key">entity_picture</span>: <span class="string"><span class="content">/local/toaster.jpg</span></span>
|
||
<span class="key">switch.wemo_switch_2</span>:
|
||
<span class="key">friendly_name</span>: <span class="string"><span class="content">Kitchen kettle</span></span>
|
||
<span class="key">icon</span>: <span class="string"><span class="content">mdi:kettle</span></span>
|
||
<span class="key">switch.rfxtrx_switch</span>:
|
||
<span class="key">assumed_state</span>: <span class="string"><span class="content">false</span></span>
|
||
</pre></div>
|
||
</div>
|
||
</div>
|
||
|
||
<h3><a class="title-link" name="reloading-customize" href="#reloading-customize"></a> Reloading customize</h3>
|
||
|
||
<p>Home Assistant offers a service to reload the core configuration while Home Assistant is running called <code>homeassistant/reload_core_config</code>. This allows you to change your customize section and see it being applied without having to restart Home Assistant. To call this service, go to the <img src="/images/screenshots/developer-tool-services-icon.png" alt="service developer tool icon" class="no-shadow" height="38" /> service developer tools, select the service <code>homeassistant/reload_core_config</code> and click “Call Service”.</p>
|
||
|
||
<p class="note warning">
|
||
New customize information will be applied the next time the state of the entity gets updated.
|
||
</p>
|
||
|
||
<h3><a href="/getting-started/presence-detection/">Next step: Setting up presence detection »</a></h3>
|
||
|
||
|
||
</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.io/tree/master/source/getting-started/customizing-devices.markdown'>Edit this page on GitHub</a></div>
|
||
<div class='section'>
|
||
<h1 class="title delta">Getting Started Guide</h1>
|
||
<ul class='divided sidebar-menu'>
|
||
<li>
|
||
<a href='/getting-started/'>Installation </a>
|
||
<ul>
|
||
<li><a href='/getting-started/installation-raspberry-pi/'>Raspberry Pi </a></li>
|
||
<li><a href='/getting-started/installation-raspberry-pi-all-in-one/'>Raspberry Pi All-In-One Installer </a></li>
|
||
<li><a href='/getting-started/installation-docker/'>Docker </a></li>
|
||
<li><a href='/getting-started/installation-vagrant/'>Vagrant </a></li>
|
||
<li><a href='/getting-started/installation-synology/'>Synology NAS </a></li>
|
||
<li><a href='/getting-started/installation-virtualenv/'>Virtualenv Linux </a></li>
|
||
<li><a href='/getting-started/updating/'>Updating </a></li>
|
||
<li><a href='/getting-started/troubleshooting/'>Troubleshooting </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/getting-started/configuration/'>Configuration </a>
|
||
<ul>
|
||
<li><a href='/getting-started/yaml/'>YAML </a></li>
|
||
<li><a href='/getting-started/basic/'>Basic information </a></li>
|
||
<li><a href='/getting-started/devices/'>Setting up devices </a></li>
|
||
<li><a class='active' href='/getting-started/customizing-devices/'>Customizing devices and services </a></li>
|
||
<li><a href='/getting-started/presence-detection/'>Presence Detection </a></li>
|
||
<li><a href='/getting-started/troubleshooting-configuration/'>Troubleshooting </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/getting-started/automation/'>Automation </a>
|
||
<ul>
|
||
<li><a href='/getting-started/automation-create-first/'>Tutorial </a></li>
|
||
<li><a href='/getting-started/automation-trigger/'>Triggers </a></li>
|
||
<li><a href='/getting-started/automation-condition/'>Conditions </a></li>
|
||
<li><a href='/getting-started/automation-action/'>Actions </a></li>
|
||
<li><a href='/getting-started/automation-templating/'>Templates </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/getting-started/scripts/'>Scripts </a>
|
||
<ul>
|
||
<li><a href='/getting-started/scripts-service-calls/'>Service Calls </a></li>
|
||
<li><a href='/getting-started/scripts-conditions/'>Conditions </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/getting-started/z-wave/'>Z-Wave </a>
|
||
<ul>
|
||
<li><a href='/getting-started/z-wave-controllers/'>USB Controllers </a></li>
|
||
<li><a href='/getting-started/z-wave-settings/'>Modifying Settings </a></li>
|
||
<li><a href='/getting-started/z-wave-device-specific/'>Device Specific </a></li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<a href='/getting-started/autostart/'>Autostart </a>
|
||
<ul>
|
||
<li><a href='/getting-started/autostart-systemd/'>Linux - systemd </a></li>
|
||
<li><a href='/getting-started/autostart-upstart/'>Linux - Upstart </a></li>
|
||
<li><a href='/getting-started/autostart-macos/'>OS X </a></li>
|
||
<li><a href='/getting-started/autostart-synology/'>Synology NAS </a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href='/topics/'>Advanced Topics </a></li>
|
||
<li><a href='/getting-started/android/'>Add to Android Homescreen </a></li>
|
||
<li><a href='/getting-started/browsers/'>Browser Compatibility List </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> |