Firstly, I am a big fan of this design and I am definitely going to get this for my home as well. But after struggling for a few days now, I finally give up. It might be a very noob question but I am getting an error “Button-card template is missing”. I have tried to resolve this in many ways but I am not able to get this. Anyone who can point me to the right direction on how to get this basis thing done?
@chezpaul2 I’ve started a new dashboard for the music library, it’s very early days. It is a custom card, for 1 panel view. If you’re interested, when it’s ready, I can send it to you for testing.
3 Likes
Did you follow Matt’s instructions? You’re probably missing the templates folder. hass-config/INSTALL.md at 2339de1e607c12ef998bb92b12d4bb71c49ab564 · matt8707/hass-config · GitHub
For sure. Let me know when. 
1 Like
Yes I have the button_card_templates folder as well. Still not working
You need to be more specific, show what your config looks like or what procedure you did. This way just saying you have an error can’t help you 
Hi Mason. I am completely new to HA. Please share your complete dashboard code. Will be really grateful. Thank you.
would you be able to help me out here please?
check a custom:button-card to go back in history, or toggle the menu icon.
type: custom:button-card
template: subview
name: Terug
icon: mdi:arrow-left
tap_action:
action: navigate
navigation_path: >
[[[ return window.history.back(); ]]]
or the action set directly to the tap_action like I replied in the repo issue
and
type: custom:button-card
template: subview
icon: mdi:menu
show_name: false
tap_action:
action: |
[[[ this.dispatchEvent(new Event('hass-toggle-menu', { bubbles: true,
composed: true })); ]]]
they both work sort of, but the issue is they do so on reloading of the view they are on. and on each character edit in the UI editor… the js gets executed on each and every event.
Can we somehow prevent that, and have them behave like the chips in Mushroom?
its an alternative to the Lovelace UI that I would welcome very much, but I can not find a way to do that yet.
(btw, I dont want to install browser_mod for that, and need it to be inside the options of button-card. Otherwise I would just as well reinstall Mushroom again 
)
Try this, before the action it will check if it is editMode or not. And dont have to use ‘action’, this is for HA action service. You can add template action for tap…
type: custom:button-card
name: Terug
icon: mdi:arrow-left
tap_action:
back_navigate: |
[[[
const isEditor = this.editMode;
if (isEditor) {
return;
}
return window.history.back();
]]]
type: custom:button-card
icon: mdi:menu
show_name: false
tap_action:
toggle_menu: |
[[[ this.dispatchEvent(new Event('hass-toggle-menu', { bubbles: true,
composed: true })); ]]]
Through devtools, you can check what properties are available for a button
2 Likes
yes, this works…
thank you very much
I dat yet understand why though, because even if I fake an action with
type: custom:button-card
template: subview
tooltip: Terug
icon: mdi:arrow-left
tap_action:
anything: |
[[[
const isEditor = this.editMode;
if (isEditor) {
return;
}
return window.history.back();
]]]
this does exactly what I want it to do. It doesnt matter apparently what we add after action?
Hi @Mattias_Persson matt, I am completely new to HA. I did all steps in the install.md. But, Is it possible for you to share your dashboard yaml code for dashboard shown in the screenshot? So, that I can build upon it.
Hi @Frank_Hagenbuch, saw your dashboard, looks really cool. A little help needed, if it is possible for you. I am a complete newbie to HA. I have followed the steps in install.md. But, I can’t seem to get what to do next. How do I get matt’s dashboard and then build upon it? Really need some help here.
Hi @VietNgoc , saw your work, looks really cool. A little help needed, if it is possible for you. I am a complete newbie to HA. I have followed the steps in install.md. But, I can’t seem to get what to do next. How do I get matt’s dashboard and then build upon it? Really need some help here.
please @manishsuperhome
dont ‘spam’ the community with 3 almost identical posts for
.
If you’re new to the community, be welcome!
Start out by reading what is considered to be the code of conduct here.
Randomly ‘tagging’ fellows is considered to be rude and comes across as demanding help.
next, show us what you did, so we can see where you’re stranded and can push you forward
2 Likes
I’m trying to change the colors of my zones when seen in the history of a person. I thought adding these lines into the themes>tablet.yaml file would work but it doesn’t. When searching google, it seems like every solution I’ve found hasn’t worked.
#Zone Colors
state-home-color: "#7E10FF"
state-Library-color: "#C50098"
state-Park-color: "#00863B"
state-Cafeteria-color: "#000DE3"
state-Bway-color: "#543400"
state-Dorm-color: "#0009E9"
state-School-color: "#C50098"
State color for zones I see for the first time, I don’t even know that such a variable exists. I know there are only two default colors for person and device tracker, blue and green. Can you tell me where you found these variables? And do you use the tablet theme as a theme for the whole HA or as a separate theme for the dashboard? That’s the difference when you want to change the css for the system.
Yes, I use the tablet theme for the whole HA. ( I select it in the settings)
These colors I’ve set in my tablet.yaml file. Obviously, the names of the zones have to match.
This actually did do something to my colors but not at all what I wanted it to do. (all colors just changed but don’t match my tablet.yaml file. It’s very strange.
I followed these instructions.
Thanks Marius for the heads up. I thought I need to tag people to bring it to their attention my post, like in some other platforms. So, I tagged multiple people. Didn’t know this come off as rude. I will keep it in mind going forward thank you. As for what I have done is, I followed the steps written in install.md of matt’s github.
Then I wanted the following dashboard and further build upon it.
So, I copied the content of ui-lovelace.yaml into raw configuration editor of a new dashboard I created.
But, I got the following error
I searched around the forum and it said it is because of yaml mode.
So I opened configuration.yaml file.
I added the following code, it didn’t work.
dashboards:
matt-tests: # Needs to contain a hyphen (-)
mode: yaml
filename: /homeassistant/ui-lovelace.yaml
title: esboard
icon: mdi:tools
show_in_sidebar: true
require_admin: false
changed to
filename: config/homeassistant/ui-lovelace.yaml
but no dashboard.
changed to
filename: ui-lovelace.yaml
still no dashboard.
I don’t know if what I messed is real basic. Real newbie at this. Please help.
not sure why your organization looks like, but you need to edit the paths to you local situation.
For me, I just edited it to be:
ui-different-take:
mode: yaml
filename: dashboard/dashboards/ui-different-take.yaml
title: Different
icon: mdi:test-tube
require_admin: true
This change requires the restart mentioned in the docs.
Also, be sure to have the theme installed (and updated) and select it.
Ofc, any other path needs to be corrected too. Like I my case, I edited the line to the button-card-templtes to be
button_card_templates: !include_dir_merge_named ../button_card_templates
views:
- type: custom:grid-layout
title: Home
because I already have that, and this way it is just a drop in.
I believe the frontend will tell you what to do next, on missing templates etc, or even the wrong Theme
I’ll take all of this away again, hope you find your way. If not dont hesitate to get back here, as there are many other members that did install the theme, which can help you better than I can.
