Installing the Custom Button Card?

boheme grazie sono riuscito a scaricare hacs e configurarlo ora mi sto divertendo a creare delle button card per imparare, ora sto cercando di imparare a chiamare un servizio con una button card…impazzisco.ahahah

1 Like

To allow for effective moderation and be inclusive of the majority this forum uses the English language.

Please edit your post and translate your question to English (online translators will do if you do not speak English).

Per consentire un’efficace moderazione ed essere inclusivo della maggioranza, questo forum utilizza la lingua inglese.

Per favore modifica il tuo post e traduci la tua domanda in inglese (i traduttori online lo faranno se non parli inglese).

thanks i managed to download hacs and configure it now i’m having fun creating button cards to learn, now i’m trying to learn how to call a service with a button card … i’m crazy.ahahah

[image]

1 Like

FYI: The solution is different now, at least if you used HACS to install. The URL referred to is correct but no YAML required. Go to Settings / Dashboards and then find the three dots in the right hand corner (of the Search line?!!) to the Resources page and add and enter the URL there. The file-based YAML solutions didn’t work for me and I have a stock Raspberry Pi 3 setup. I’m not sure why it’s hidden so awkwardly but it’s a new UI so I suppose these things happen.

is hacs broken for this?
I went in hacs
image

nothing
image

Hi all,

seems to be that I am too stupid to integrate the Custom Button Card into HA. Can someone please tell me where this code has to be placed?

resources:
  - url: /hacsfiles/button-card/button-card.js
    type: module

Do I have to create a separate file “ui-lovelace.yaml” and if yes, how is this file integrated into the configuration.yaml? Sorry, But the documentation is not clear to me!

The code goes into your configuration.yaml file in the following way:

lovelace:
  mode: yaml
  resources:
    - url: /hacsfiles/button-card/button-card.js
      type: module

“ui-lovelace.yaml” contains all your dashboards. If you’ve been using the UI-based dashboard editor, you’ll need to create the ui-lovelace.yaml file in your configuration directory, copy your current dashboard to it (Edit Dashboard, Raw configuration editor, copy all, paste into the ui-lovelace.yaml file, then add the first two lines above to your configuration.yaml file and restart Home Assistant. From then on, you’ll be editing that ui-lovelace.yaml file instead of using the UI editor.
A more detailed explanation is here: Multiple Dashboards - Home Assistant (home-assistant.io)

2 Likes

ok, this means the buttons do not work with the UI interface and I have to switch to yaml.
This is not the way I wont to go for the moment…everything is too new to me!

if you have installed the card through HACS, this should be included already in your “Resources” in any View, click the 3 dots upp to the right , click edit, click again choose “manage resources”, if it’s not there “ADD” it here ( url: … type: javascipt-module)

1 Like

Hi,

yes, it is already there:

And do I have to add the code in the configuration.yaml in addition?

nope , you should no be able to “Add Card” and find it there

1 Like

Hi,

thanks for support, but the card is not available, only the update entity is listed…I have removed it now!

The card have no “entity”, if you installed it through HACS, go there and locate it, sometimes one have to “redownload/restart”, if you not can see it when you click Add-Card in a View, then you can create it manually

 type: custom:button-card 
 entity: switch.xxxx_xxxxx

Add me to the list of people struggling to get the custom:button-card to work.

I downloaded this from HACS (and see it in my resources):

I edited my configuration.yaml with the following:

custombuttoncard1

I created a custom ui-configuration.yaml file (copying all of the raw yaml from my primary dashboard into this new file).

I reloaded HA multiple times - yet I still get the following error message when trying to actually use a custom:button-card via yaml:

Thanks for the answer, I’ve been looking for this for days :slight_smile: Wouldn’t it be nice if this was explained in the installation instructions of the button-card ?

Following the steps for enabling Multiple Dashboards posted by @qoheleth .

  • Create the new ui~.yaml file
  • Copy / paste in the existing raw config from your current dashboard
  • Restart HA

I tested it by not copying in my exsiting dashboard’s config, and after a reboot the dashboard was blank.

After that though, I try to actually add a custom card to a new dashboard and no luck.

In the dashboard, under Manage Resources I do see the button-card js file, but it is not in the list of choices if i click the ADD CARD button and if I try to create a manual card but I get the error saying Custom element doesn’t exist: button-card.

I have tried redownloading via HACS, restarted HA…

Hi all,

Sorry to jump on this thread. I am going with the HACS installation method for the custom button-card, but I don’t seem to find this card when searching for “button” in HACS integrations / frontend.

Is it available on HACS?

Thanks

EDIT:
NVM - found it:
HACS > Frontend > “+ EXPLORE & DOWNLOAD REPOSITORIES” > search for “button” > click on “button-card” > Download

My HA version seems too old (2023.6.2) compared to the required minimum version ‘2023.7.0’, so it could be the reason it didn’t show up in the search?