Mohesles1 can you share your config for this screen shoot? Looks great and I love the buttons on HA section
I have had the Plex Sensor setup but how are you getting the Plex.watching sensor? I can see what is added to Plex through the Upcoming Media Card. Can you share your sensor configs? Thanks
I think I’m using Tautulli for that, will update when I get home.
edit yes
sensors:
plex_watching:
friendly_name: "Plex watching"
value_template: "{{ states.sensor.tautulli.attributes.stream_count }}"
CPU card
cards:
- entity: sensor.glances_cpu_used
severity:
- color: '#238823'
value: 33
- color: '#FFA701'
value: 66
- color: '#D2222D'
value: 100
title: CPU usage
type: 'custom:bar-card'
- entity: sensor.glances_disk_used_percent
severity:
- color: '#238823'
value: 33
- color: '#FFA701'
value: 66
- color: '#D2222D'
value: 100
title: Disk usage
type: 'custom:bar-card'
- entity: sensor.glances_ram_used_percent
severity:
- color: '#238823'
value: 25
- color: '#FFA701'
value: 75
- color: '#D2222D'
value: 100
title: RAM usage
type: 'custom:bar-card'
- entity: sensor.glances_cpu_load
max: 1
min: 0
severity:
- color: '#238823'
value: 0.33
- color: '#FFA701'
value: 0.66
- color: '#D2222D'
value: 1
title: CPU 15 mins
type: 'custom:bar-card'
unit_of_measurement: '%'
type: vertical-stack
Internet card
cards:
- accuracy: 5
align_icon: left
entities:
- entity: sensor.pi_hole_ads_blocked_today
name: Ads blocked
show_state: true
unit: ads
- entity: sensor.pi_hole_dns_queries_today
name: DNS queries
show_state: true
unit: queries
hours_to_show: 168
icon: 'mdi:pi-hole'
line_color: '#0073D4'
name: Pi-hole today
points_per_hour: 0.05
show:
points: false
type: 'custom:mini-graph-card'
- accuracy: 5
align_icon: left
entities:
- entity: sensor.asuswrt_download
show_state: true
unit: Mbit/s
- entity: sensor.asuswrt_upload
show_state: true
unit: Mbit/s
hours_to_show: 12
icon: 'mdi:wan'
name: Internet last 12 hours
points_per_hour: 1
show:
points: false
type: 'custom:mini-graph-card'
- accuracy: 5
align_icon: left
color_thresholds:
- color: '#ff9966'
value: 200
- color: '#ff6600'
value: 400
- color: '#c0392b'
value: 600
entities:
- entity: sensor.deluge_down_speed
show_state: true
- entity: sensor.deluge_up_speed
show_state: true
hours_to_show: 12
icon: 'mdi:cloud-download-outline'
name: Deluge past 12 hours
points_per_hour: 1
show:
points: false
type: 'custom:mini-graph-card'
type: vertical-stack
Internet speed card
cards:
- accuracy: 5
align_icon: left
entities:
- entity: sensor.speedtest_download
show_state: true
unit: Mbit/s
group: true
hours_to_show: 168
icon: 'mdi:arrow-down-bold'
line_color: '#0073D4'
name: Last speed test download
points_per_hour: 0.05
show:
extrema: true
points: false
type: 'custom:mini-graph-card'
- accuracy: 5
align_icon: left
entities:
- entity: sensor.speedtest_upload
show_state: true
unit: Mbit/s
group: true
hours_to_show: 168
icon: 'mdi:arrow-up-bold'
line_color: '#A20F30'
name: Last speed test upload
points_per_hour: 0.05
show:
extrema: true
points: false
type: 'custom:mini-graph-card'
- accuracy: 5
align_icon: left
entities:
- entity: sensor.speedtest_ping
group: true
show_state: true
unit: m/s
hours_to_show: 168
line_color: '#01BEAA'
lower_bound: 0
name: Last speed test ping
points_per_hour: 0.05
show:
extrema: true
graph: bar
points: false
type: 'custom:mini-graph-card'
type: vertical-stack
2 Likes
Shure, this is my current monitoring page:
Meanwhile I have migrated from Docker on Synology NAS to Docker on Ubuntu running on an Intel NUC - so much faster
.I think I have to declutter some parts, but here is my current config for this card:
#################################################
# #
# SYSTEM View #
# #
#################################################
- title: System
path: system
icon: mdi:settings
cards:
##################################
### Card Home Assistant Status ###
##################################
- id: card_haststus
type: vertical-stack
cards:
- type: markdown
content: >
# HA Status:
- type: picture-elements
image: /local/LovalaceUI/home_assistant.png
elements:
# HA Laufzeit
- type: state-icon
entity: sensor.ha_laufzeit
style: {left: 72%, top: 35%}
- type: state-label
entity: sensor.ha_laufzeit
prefix: 'Laufzeit: '
unit_of_measurement: "Stunden"
style: {left: 72%, top: 45%}
# HA Aktuelle Version
- type: state-icon
entity: sensor.installierte_ha_version
style: {left: 59%, top: 60%}
- type: state-label
entity: sensor.installierte_ha_version
prefix: 'Version: '
style: {left: 59%, top: 70%}
# HA Update
- type: state-icon
entity: sensor.hass_update_available
style: {left: 59%, top: 85%}
- type: state-label
entity: sensor.hass_update_available
prefix: 'Update: '
style: {left: 59%, top: 95%}
# HA DB
- type: state-icon
entity: sensor.home_assistant_v2_db
style: {left: 85%, top: 60%}
- type: state-label
entity: sensor.home_assistant_v2_db
prefix: 'DB: '
style: {left: 85%, top: 70%}
# HA Zertifikat Laufzeit
- type: state-icon
entity: sensor.ssl_certificate_expiry
style: {left: 85%, top: 85%}
- type: state-label
entity: sensor.ssl_certificate_expiry
prefix: 'SSL: '
style: {left: 85%, top: 95%}
- type: conditional
conditions:
- entity: sensor.hacs
state_not: "0"
card:
type: entities
entities:
- entity: sensor.hacs
name: Community Updates
# Things That Are Probably Broken Card
- type: custom:monster-card
show_empty: false
card:
type: entities
title: Defekte Objekte
show_header_toggle: false
filter:
include:
- state: "unknown"
exclude:
- entity_id: group.*
##########################
### Card Docker Status ###
##########################
- id: card_dockerstatus
type: vertical-stack
cards:
- type: markdown
content: >
# DockerHub Status:
- type: picture-elements
image: /local/LovalaceUI/intel-nuc2.png
elements:
# CPU
- type: state-icon
entity: sensor.processor_use
style: {left: 20%, top: 75%}
- type: state-label
entity: sensor.processor_use
prefix: 'CPU: '
style: {left: 20%, top: 85%}
- type: state-label
entity: sensor.cpu_temperature
prefix: 'Temp: '
style: {left: 20%, top: 92%}
# Memory
- type: state-icon
entity: sensor.memory_use_percent
style: {left: 50%, top: 75%}
- type: state-label
entity: sensor.memory_use_percent
prefix: 'RAM: '
style: {left: 50%, top: 85%}
- type: state-label
entity: sensor.memory_free
prefix: 'Free: '
style: {left: 50%, top: 92%}
# Disk
- type: state-icon
entity: sensor.disk_use_percent
style: {left: 80%, top: 75%}
- type: state-label
entity: sensor.disk_use_percent
prefix: 'Disk: '
style: {left: 80%, top: 85%}
- type: state-label
entity: sensor.disk_free
prefix: 'Free: '
style: {left: 80%, top: 92%}
- type: entities
# title: Entities card sample
show_header_toggle: false
entities:
- entity: sensor.docker_version
icon: mdi:docker
- type: horizontal-stack
cards:
- type: entity-button
entity: sensor.docker_hass_status
name: HASS
- type: entity-button
entity: sensor.docker_hacc_status
name: HACC
- type: entity-button
entity: sensor.docker_deconz_status
name: deCONZ
- type: entity-button
entity: sensor.docker_portainer_status
name: Portainer
############################
### Card Internet Status ###
############################
- id: card_internetstatus
type: vertical-stack
cards:
- type: markdown
content: >
# Internet Status:
- type: picture-elements
image: /local/LovalaceUI/Internet2.png
elements:
# Internet Status
- type: state-icon
entity: sensor.fritz_netmonitor
style: {left: 20%, top: 75%}
- type: state-label
entity: sensor.fritz_netmonitor
prefix: 'Status: '
style: {left: 20%, top: 85%}
- type: state-label
entity: sensor.verbindungs_typ
prefix: 'Typ: '
style: {left: 20%, top: 92%}
# Internet Speed
- type: state-icon
entity: sensor.speedtest_download
style: {left: 47%, top: 75%}
- type: state-icon
entity: sensor.speedtest_upload
style: {left: 53%, top: 75%}
- type: state-label
entity: sensor.speedtest_download
prefix: 'Down: '
style: {left: 50%, top: 85%}
- type: state-label
entity: sensor.speedtest_upload
prefix: 'Up: '
style: {left: 50%, top: 92%}
# Internet IP-Ping
- type: state-icon
entity: sensor.extene_ip
style: {left: 77%, top: 75%}
- type: state-icon
entity: sensor.speedtest_ping
style: {left: 83%, top: 75%}
- type: state-label
entity: sensor.extene_ip
prefix: 'IP: '
style: {left: 80%, top: 85%}
- type: state-label
entity: sensor.speedtest_ping
prefix: 'Ping: '
style: {left: 80%, top: 92%}
- type: custom:mini-graph-card
name: Fritz.Box Internet Traffic
icon: mdi:router-wireless
entities:
- entity: sensor.fritzbox_7490_kbytesec_received
name: empfangen
- entity: sensor.fritzbox_7490_kbytesec_sent
name: gesendet
- type: horizontal-stack
cards:
- type: entity-button
entity: switch.fritzbox_guestwifi
name: Gast WLAN
- type: entity-button
entity: binary_sensor.is_fritzbox_online
name: DSL neu verbinden
tap_action:
action: call-service
service: fritzbox_tools.reconnect
icon: mdi:web
- type: conditional
conditions:
- entity: switch.fritzbox_guestwifi
state: "on"
card:
type: picture
image: /local/LovalaceUI/Gast-Zugang.png
########################
### Card Syno Status ###
########################
- id: card_synostatus
type: vertical-stack
cards:
- type: markdown
content: >
# Synology Status:
- type: picture-elements
image: /local/LovalaceUI/DS1517plus.png
elements:
### Synoloy Status
- type: state-icon
entity: sensor.syno_status
style: {left: 25%, top: 25%}
- type: state-label
entity: sensor.syno_status
prefix: 'Status: '
style: {left: 25%, top: 35%}
### Volume Status
- type: state-icon
entity: sensor.synology_dsm_status_volume_1
style: {left: 25%, top: 45%}
- type: state-label
entity: sensor.synology_dsm_status_volume_1
prefix: 'Volume: '
style: {left: 25%, top: 55%}
### Syno Type
- type: state-icon
entity: sensor.syno_snmp_name
style: {left: 25%, top: 65%}
- type: state-label
entity: sensor.syno_snmp_name
prefix: 'Typ: '
style: {left: 25%, top: 75%}
### CPU Load
- type: state-icon
entity: sensor.synology_dsm_cpu_load_total
style: {left: 50%, top: 25%}
- type: state-label
entity: sensor.synology_dsm_cpu_load_total
prefix: 'CPU: '
style: {left: 50%, top: 35%}
### Memory Load
- type: state-icon
entity: sensor.synology_dsm_memory_usage_real
style: {left: 50%, top: 45%}
- type: state-label
entity: sensor.synology_dsm_memory_usage_real
prefix: 'RAM: '
style: {left: 50%, top: 55%}
### DSM Version
- type: state-icon
entity: sensor.syno_snmp_version
style: {left: 50%, top: 65%}
- type: state-label
entity: sensor.syno_snmp_version
# prefix: 'Typ: '
style: {left: 50%, top: 75%}
### Volume Size
- type: state-icon
entity: sensor.synology_dsm_total_size_volume_1
style: {left: 75%, top: 25%}
- type: state-label
entity: sensor.synology_dsm_total_size_volume_1
prefix: 'Volume1: '
style: {left: 75%, top: 35%}
### Volume Used
- type: state-icon
entity: sensor.synology_dsm_used_space_volume_1
style: {left: 75%, top: 45%}
- type: state-label
entity: sensor.synology_dsm_used_space_volume_1
prefix: 'Benutzt: '
style: {left: 75%, top: 55%}
### Volume Used %
- type: state-icon
entity: sensor.synology_dsm_volume_used_volume_1
style: {left: 75%, top: 65%}
- type: state-label
entity: sensor.synology_dsm_volume_used_volume_1
prefix: 'Belegt: '
style: {left: 75%, top: 75%}
- type: horizontal-stack
cards:
- type: custom:mini-graph-card
entities:
- sensor.synology_dsm_cpu_load_total
name: Synology CPU
line_color: var(--accent-color)
line_width: 8
font_size: 75
- type: custom:mini-graph-card
entities:
- sensor.synology_dsm_memory_usage_real
name: Synology RAM
line_color: var(--primary-color)
line_width: 8
font_size: 75
##################################
### Card Entertainment-Systeme ###
##################################
- id: card_vuststus
type: vertical-stack
cards:
- type: markdown
content: >
# Entertainment-Systeme:
- type: horizontal-stack
cards:
- type: entity-button
entity: binary_sensor.is_samsungtv_online
name: TV
- type: entity-button
entity: binary_sensor.is_vuuno_online
name: VU Uno4K
- type: entity-button
entity: binary_sensor.is_teufel_online
name: Teufel 5.1
- type: entity-button
entity: switch.subwoofer
name: Subwoofer
- type: entity-button
entity: binary_sensor.is_vusolo_online
name: VU Solo2
- type: picture-elements
image: /local/LovalaceUI/vuuno4kse.png
elements:
# VU Status
- type: state-icon
entity: sensor.vuuno4k_standby
style: {left: 15%, top: 78%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.vuuno4k_standby
prefix: 'Status: '
style: {left: 15%, top: 87%, color: black }
- type: state-label
entity: sensor.vti_kanal
prefix: 'Kanal: '
style: {left: 15%, top: 93%, color: black }
# VU HDD
- type: state-icon
entity: sensor.vu_hdd_capacity
style: {left: 50%, top: 78%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.vu_hdd_capacity
prefix: 'HDD: '
style: {left: 50%, top: 87%, color: black }
- type: state-label
entity: sensor.vu_hdd_free
prefix: 'Frei: '
style: {left: 50%, top: 93%, color: black }
# VU Version
- type: state-icon
entity: sensor.vti_image_version
style: {left: 85%, top: 78%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.vti_image_version
prefix: 'Image: VTi '
style: {left: 85%, top: 87%, color: black }
###########################
### Card Netatmo Status ###
###########################
- id: card_netatmostatus
type: vertical-stack
cards:
- type: picture-elements
image: /local/LovalaceUI/netatmo.png
elements:
- type: custom:text-element
text: "Netatmo Status"
style: {left: 25%, top: 16%, color: black, font-weight: bold, font-size: 150% }
# Wohnen Status
- type: state-icon
entity: sensor.netatmobasis_online
style: {left: 15%, top: 65%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.netatmobasis_online
prefix: 'Basis: '
style: {left: 15%, top: 71%, color: black }
- type: state-label
entity: sensor.netatmo_wohnen_wifi
prefix: 'WLAN: '
style: {left: 15%, top: 75%, color: black }
# Balkon Status
- type: state-icon
entity: sensor.netatmo_balkon_radio
style: {left: 86%, top: 20%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.netatmo_balkon_radio
prefix: 'Balkon: '
style: {left: 86%, top: 26%, color: black }
- type: state-label
entity: sensor.netatmo_balkon_battery_percent
prefix: 'Batterie: '
style: {left: 86%, top: 30%, color: black }
# Schlafzimmer Status
- type: state-icon
entity: sensor.netatmo_schlafen_radio
style: {left: 86%, top: 45%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.netatmo_schlafen_radio
prefix: 'Schlafen: '
style: {left: 86%, top: 51%, color: black }
- type: state-label
entity: sensor.netatmo_schlafen_battery_percent
prefix: 'Batterie: '
style: {left: 86%, top: 55%, color: black }
# Bad Status
- type: state-icon
entity: sensor.netatmo_bad_radio
style: {left: 86%, top: 70%, '--paper-item-icon-color': black }
- type: state-label
entity: sensor.netatmo_bad_radio
prefix: 'Bad: '
style: {left: 86%, top: 76%, color: black }
- type: state-label
entity: sensor.netatmo_bad_battery_percent
prefix: 'Batterie: '
style: {left: 86%, top: 80%, color: black }
# Devices with low battery state
- type: custom:monster-card
show_empty: false
card:
type: entities
title: Beräte mit Batterie unter 25%
show_header_toggle: false
filter:
include:
- entity_id: "*battery_level*"
state: '< 25'
- entity_id: "*battery_percent*"
state: '< 25'
- attributes:
battery: '< 25'
- attributes:
battery_level: '< 25'
#######################
### Card IT-Systeme ###
#######################
- id: card_itsysteme
type: vertical-stack
cards:
- type: markdown
content: >
# IT-Systeme:
- type: horizontal-stack
cards:
- type: entity-button
entity: binary_sensor.is_deathstar_online
name: Main-Syno Deathstar
- type: entity-button
entity: binary_sensor.is_dockerhub_online
name: DockerHub
- type: entity-button
entity: binary_sensor.is_endor_online
name: Backup-Syno Endor
- type: horizontal-stack
cards:
- type: entity-button
entity: binary_sensor.is_fritzbox_online
name: AVM Fritz.Box
- type: entity-button
entity: sensor.anruf_status
name: Anrufstatus
- type: entity-button
entity: binary_sensor.is_camterasse_online
- type: horizontal-stack
cards:
- type: entity-button
entity: binary_sensor.is_switchaz_online
name: Switch AZ
- type: entity-button
entity: binary_sensor.is_switchwz_online
name: Switch WZ
- type: entity-button
entity: binary_sensor.is_fritzrepeater_online
name: AVM 450E
- type: entity-button
entity: binary_sensor.is_ex3700_online
name: EX3700
3 Likes
Awesome thanks. Yeah I moved off the NAS too on to a NUCi7 much better response and clears up the NAS for all media stuff. I am noticing most people use ui-lovelace.yaml over letting HASSIO create it in the .store directory. I am wondering if this is a better way to do it and more flexible to break up each page to a separate yaml file.
Not shure about the UI editor. Haven´t tryed yet.
Started with YAML mode back in the days, so I think I´ll stick with it… ¯\_(ツ)_/¯
Thought about going with packages* next, but splitting up the ui-lovelace.yaml** looks quite interesting too.
THX 4 the idea! 
*https://www.home-assistant.io/docs/configuration/packages/
**Lovelace and !include
Packages are nice in bundling a bunch of things together for a specific task (i.e. weather, system monitor, recycle, and more). It seems everyone likes the lovelace.yaml over the editor. Only issue with editor it puts everything backwards compared to the yaml file. Do you have a github of your HA configs? Love to see what you have as a whole. I am still building so not at the uploading stage yet.
Not yet…
1 Like
Hello ObiKaiKenobi,
you have an interesting option in your configuration:
Think this is to switch on and off the guest wifiof your Fritz Box?
Can you give me more information about this? How do you do this?
Thanks a lot in advance!
/Ralf
Hi Ralf,
You‘r correct. It is used to enable guest WiFi on FritzBOX.
It is a custom component which can be found here:
You could also use it to reconnect your internet connection and also to switch internet profiles of devices (which i have not testet yet).
Thanks a lot! Didin’t know this component yet…
And thanks for your fast response!
/ Ralf
@Ralf Make sure to use the updated version with a lot of new features: https://github.com/mammuth/ha-fritzbox-tools
1 Like
please note that you can also use:
{{ states.automation | count }}
shorten the code a bit 
about the input_boolean: this also triggers the update when the boolean is turned_off?
1 Like
Correct, that way when you push the button it just refreshes no matter the state of the bool.
Sweet I’ll mod this when I get home. Thanks for the tip!
Thanks, found the component, many thanks for writing this!
/Ralf
@petro is there a clean way to add a filter to calculate the total number of devices on the network? I currently have a loop that sees if the device tracker is home and is from the router. I’d prefer to have shortened version.
{% for state in states.device_tracker if(state.state == 'home' and state.attributes.source_type == 'router') -%}
{% if loop.last -%}
{{ loop.index }}
{%- endif %}
{%- else %}
0
{%- endfor %}
Found this thread Counting Open Doors & Motion Sensors? (Solved by ranting at myself) and was able to apply it to my needs to get:
#------ Number of devices on WiFi Router
connected_devices:
friendly_name: "Devices on Network"
value_template: "{{ states.device_tracker | selectattr('state', 'eq', 'home') | selectattr('attributes.source_type', 'eq', 'router') | list | count }}"
3 Likes
glad you got it sorted out
LogisticalLux,
Love your system monitor page can you share the lovelace configs?