Execute services clicking on sidebar items

Since the beginning it is possible to assign the href of a sidebar item specificing this property. This property is useful if one wants to go to a dashboard or open an external website when clicking on sidebar items. But since some time, it is also possible to execute a Home Assistant Service (renamed recently to Actions) if we specify the correct action in the on_click proprty of a sidebar item.

Turning on or turning off a light, reload automations, reload templates, among much others, are just some services examples that you can execute from the sidebar items using this feature. Let's check a very practical example, imagine having a sidebar item that once cliked sets a specific scene:

YAML

<config directory>/www/sidebar-config.yaml

order:
  - new_item: true
    item: 'Movie Time'
    icon: 'mdi:led-strip-variant'
    on_click:
      action: 'call-service'
      service: 'scene.turn_on'
      data:
        entity_id: 'scene.movie_time'

JSON

<config directory>/www/sidebar-config.json

{
  "order": [
    {
      "new_item": true,
      "item": "Movie Time",
      "icon": "mdi:led-strip-variant",
      "on_click": {
        "action": "call-service",
        "service": "scene.turn_on",
        "data": {
          "entity_id": "scene.movie_time"
        }
      }
    }
  ]
}