Custom element doesn't exist: button-card. { "type": "custom:button-card" }

Configuration
1

Hi,

I’m trying to setup my first custom card, but it fails right at the beginning.
What I did after I read the documentation:

  • created a ui-lovelace.yaml
  • added the code to the file:
    resources:
    - url: /local/button-card.js
    type: module
  • added the latest version from github of ‘button-card.js’ to the www subfolder
  • restarted HA

But when I try to add the custom card with the code:
type: 'custom:button-card'
I get a red warning with the text:
Custom element doesn’t exist: button-card.
{
“type”: “custom:button-card”
}

I see a lot of topics, but didn’t find one with a solution…
Please help.

2

Have you downloaded the raw file on github?
What does the HA log say?

3

I downloaded the zip, and used the file inside…
HA log doesn’t say anything, logger is set at ‘critical’ in the configuration.yaml.

4

Are you using HA in storage mode? (i.e. have you been using the graphical editor for Lovelace UI until now?)

If so, you can go ahead and delete that yaml file and instead, in the Lovelace UI enter Configure UI mode then enter the Raw Config Editor using same three dots and add your Resources and url line in there.

Oh and if you have just created the www folder for the first time, you will need an HA restart.

2 Likes
5

Yup, that did the trick!
Maybe you should be the hero and writhe the documentation :smiley:

6

Glad that worked. Wherever there are gaps in the documentation I’ve found this a surprisingly friendly and approachable community for asking questions.

Is it this custom card? Perhaps I’ll try doing a PR for the readme, or at least opening an issue later tonight. It’d be nice to give back to the project, even in a small way.

7

Where can I find the file for custom button card? When I try to download it from github “Manual installation” I was redirected to a webpage and get 404 not found.

8

https://github.com/custom-cards/button-card/releases/download/3.0.0/button-card.js

9

This does not work since version 0.107.x

10

anyone got this working? I installed following the instructions and have same error “button-card does not exist.” I had button-card installed before , the button-card that’s not from this package. Looks like a naming conflict and neither party wants to rename theirs.

11

I ran into the same issues. Apparently with the latest HAOS, you will need to add dashboard resources either via UI or in the ui-lovelace.yaml. Please refer to this page on how to do it: Lovelace Plugins · thomasloven/hass-config Wiki · GitHub

12

Installing cards via HACS doesn’t mean they can directly be used by lovelace dashabords. You have to add resources for each of them.

13

Can You help me how to do it please? (as I am BFU…)