
* Add headers & footers docs
* Add screenshots
* ✏️ Tweak
Co-authored-by: Franck Nijhof <frenck@frenck.nl>
3.9 KiB
title, description
title | description |
---|---|
Headers & Footers for Lovelace cards | Decorate your Lovelace cards with header and footer widgets. |
Some Lovelace cards have support for header and footer widgets. These widgets fill up the whole available space in a card.
Picture header & footer
Widget to show a picture as a header or a footer. A picture can have touch actions associated with it.
Screenshot of an entities card with a picture header.
type: picture
image: 'https://www.home-assistant.io/images/lovelace/header-footer/balloons-header.png'
{% configuration header-footer %}
type:
required: true
description: picture
type: string
image:
required: true
description: The URL of an image.
type: string
tap_action:
required: false
description: Action to take on tap
type: map
keys:
action:
required: true
description: "Action to perform (more-info
, toggle
, call-service
, navigate
, url
, none
)"
type: string
default: "toggle
"
navigation_path:
required: false
description: "Path to navigate to (e.g. /lovelace/0/
) when action
defined as navigate
"
type: string
default: none
url_path:
required: false
description: "Path to navigate to (e.g. https://www.home-assistant.io
) when action
defined as url
"
type: string
default: none
service:
required: false
description: "Service to call (e.g. media_player.media_play_pause
) when action
defined as call-service
"
type: string
default: none
service_data:
required: false
description: "Service data to include (e.g. entity_id: media_player.bedroom
) when action
defined as call-service
"
type: string
default: none
hold_action:
required: false
description: Action to take on tap-and-hold
type: map
keys:
action:
required: true
description: "Action to perform (more-info
, toggle
, call-service
, navigate
, url
, none
)"
type: string
default: "more-info
"
navigation_path:
required: false
description: "Path to navigate to (e.g. /lovelace/0/
) when action
defined as navigate
"
type: string
default: none
url_path:
required: false
description: "Path to navigate to (e.g. https://www.home-assistant.io
) when action
defined as url
"
type: string
default: none
service:
required: false
description: "Service to call (e.g. media_player.media_play_pause
) when action
defined as call-service
"
type: string
default: none
service_data:
required: false
description: "Service data to include (e.g. entity_id: media_player.bedroom
) when action
defined as call-service
"
type: string
default: none
double_tap_action:
required: false
description: Action to take on double tap
type: map
keys:
action:
required: true
description: "Action to perform (more-info
, toggle
, call-service
, navigate
, url
, none
)"
type: string
default: "more-info
"
navigation_path:
required: false
description: "Path to navigate to (e.g. /lovelace/0/
) when action
defined as navigate
"
type: string
default: none
url_path:
required: false
description: "Path to navigate to (e.g. https://www.home-assistant.io
) when action
defined as url
"
type: string
default: none
service:
required: false
description: "Service to call (e.g. media_player.media_play_pause
) when action
defined as call-service
"
type: string
default: none
service_data:
required: false
description: "Service data to include (e.g. entity_id: media_player.bedroom
) when action
defined as call-service
"
type: string
default: none
{% endconfiguration %}