My Lovelace Plugins


@thomasloven I have in log error after opening/closing HA side panel:

https://_redacted_/local/lovelace/layout-card.js?ver=c8847a:55:28 Uncaught TypeError: Cannot read property 'id' of null


I am getting this error when trying to use the “- break:” function in the layout-card -> Uncaught TypeError: Cannot read property ‘startsWith’ of undefined.

Edit: Turns out I was using a colon after “- break” which shouldn’t have been there however now when trying this with the modder-card i am hitting this error -> Uncaught TypeError: this.card.setConfig is not a function

Edit#2 After struggling trying to get this to work with the modder-card for a couple of hours it seems all I needed to do was go to another tab within lovelace and immediately go back and just like that it worked. I’ve had this trouble with other cards but usually I get the red-info card but in this case all I got was the error message in the lower left corner and I assumed it wasn’t working. Another lesson learned, hopefully this helps someone else.


Should be fixed now.


I have a lot of errors in system log when resizing the browser’s window:
/local/custom-lovelace/layout-card/layout-card.js:69:1 TypeError: this.$ is undefined
Now i workaround it by adding
if (typeof(this.$) != "undefined")
is it OK?


Thank you, it work’s great. About toggle lock entity row - it works only with “switch” type. What about the “input_number”? For now it convert’s the “input_number” to “switch”…


@thomasloven After upgrade HA to 0.82 when I go ftom dev-info page to overview page I have in log this error for layout-card (browser cache cleaned):

https://_redacted_/local/lovelace/layout-card.js?ver=dfdfe8:69:27 Uncaught TypeError: Cannot read property 'columns' of undefined

My config:

  - id: home
    icon: mdi:home
    title: 'Pomieszczenia'
    panel: true
      - type: custom:layout-card


Great new card, thanks!!

One suggestion if it’s possible please - could there be an option for “up to column count” or “maximum column count”?

For example, I like to use the horizontal layout, and on my 24" monitor it automatically results in 5 columns. I would like to reduce this to 4 columns but don’t want to force this to be the case when viewing from a smaller display such as a mobile phone. The result would be auto column count by screen size, up to and no more than 4 columns on larger screens.

Happy to put this request in GitHub if you prefer?


@Bieniu The TypeError should be fixed now.

@jarrah Try the newest version and config option max_columns: (undocumented).


Great card, the max_colums: is exactly what I am looking for.

My aim is to get three columns of cards in a row, but preferrably without forcing 3 (since the cards get to compressed on mobile.)

I can not get it to work however.

Still get 5 columns, and a - break just introduce a blank column before it put the next card in column 5
Get the same issue as when trying to use only layout: horizontal and then - break after the first 3

- type: iframe …
- type: iframe …
- type: iframe …
- break
- type: entities

- entities:

- type: gauge


Try now…


Works perfectly!
Good that it was nothing to see in the diff :stuck_out_tongue:


Superb, works a treat, thanks!


Hey Thomas,

You really make some really cool but also very handy cards!!!
One question through - where should the layout card be saved? Under /local/ and do I need to add anything to my resources?


Here’s a good explanation on how to install, use and debug lovelace plugins:

Also, read this to find out where to put the files:



What is needed to get the on/off/weekdays options to work?


I don’t know… some automations… appdaemon if you feel comfortable with that, perhaps?

It’s just a number of dummy switches and inputs I made for demonstration. They aren’t connected to anything :sweat_smile:



how can you track your skoda? I thought the skoda connect plugin doesn’t exist!


With satellite



I’m trying to use the lovelace-player plug-in but i can’t get it to work on my android device.
I’m successfully able to retrieve the device id for chrome then update the lovelace-player-config.js with it as below :

setTimeout(function() {

  // Add your bindings here
  // Example:
  LovelacePlayer.bind("media_player.emilie_bedroom", "00db073-5faba8b1");

  // Remove this line when you found your Device ID
}, 200);

The media player is visible at /dev-state in Hass but always idle. If i try to interact with it (on/off , next track), i get the following error in the log.

Error doing job: Task exception was never retrieved
Traceback (most recent call last):
  File "/data/data/com.termux/files/usr/lib/python3.6/site-packages/homeassistant/helpers/", line 226, in _handle_service_platform_call
await func(entity, data)
  File "/data/data/com.termux/files/usr/lib/python3.6/concurrent/futures/", line 56, in run
result = self.fn(*self.args, **self.kwargs)
  File "/data/data/com.termux/files/usr/lib/python3.6/site-packages/homeassistant/components/media_player/", line 504, in mute_volume
raise NotImplementedError()

Any hint how to solve this ?

edit: solved - error in the device_id.

Thank you


Is something like this possible with slider-entity-row?

If not, any chance of something like this in the future? :slightly_smiling_face: