Dashboard: Sonos card

With this card you are not solely dependant on the Sonos favorites, but you can also use anything that is available as media in Home Assistant. So as long as you have it there, it should be available in this card.

To see what is already available in your installation, have a look in the built in media browser of home assistant: http://homeassistant.local/media-browser/browser

More integrations can be found here: Integrations - Home Assistant

And in Hacs: https://hacs-repositories.web.app/

1 Like

I can’t make it work. My css knowledge is -1. :laughing:

Did you even try it? Just add the example to your config and play with it: GitHub - johanfrick/custom-sonos-card: Home Assistant custom lovelace sonos card

How do I determine the device_id again?

I’ve got it for a few of my speakers, and need it for some others. But cant find where to get it? TIA.

Firstly, let me say this is the best Media player for HA that I’ve tested so far - kudos to Phil for the effort and time he has put in to it, and his responsiveness to questions. Having said that, I have a couple of really dumb beginner questions:

  1. Does this support the capability to play ALL the songs in a Playlist? (I can’t see the use of any media player that simply plays one track.)

  2. Any chance of placing a limit on displayed media sources, or perhaps make the window that displays the media sources scrollable?

My use case is a wall-mounted tablet to run HA that definitely, 100% has to be user friendly (i.e. wife-proof). The only music requirement for me is to select a given playlist, then play all the songs in that list, usually on every Sonos speaker in the house. (I could do this with iTunes/AirPlay, but prefer it to be part of the HA integration.)

Thanks for the fine words :blush:

  1. Yes. Just click on the playlist.
  2. Sure, try the below (adjust the 400px to your liking):
type: custom:sonos-card
styles:
  media-buttons:
    maxHeight: 400px
    overflow: scroll

Please support continued development: BMC

Thanks, Phil.

Item #2 (the scroll) works perfectly. Many thanks!

For Item #1, I must be doing something REALLY stupid. I have multiple playlists (e.g. Dire Straits, ELO, etc.). Each of these contains multiple tracks. When I select a playlist, the track list is displayed - so far, so good. But, at this point, how do I get it to play all the tracks in that list? Selecting the first track, for example, will only play that and nothing else. I guess I’m missing something obvious.

You are right.
The favorites act like I say though, just click on the name and playlist starts playing.
When navigating into them though, you need to click on the play icon in the top left corner of the media browser.

Hmmm. Still not getting it play multiple tracks.

So, if I click on the playlist selection, I get this:

Clicking one of the playlists gives me:

Clicking on the Play icon (top left) without selecting a track gives me a brief error message: “Failed to call media_player/play_media. ‘NoneType’ object has no attribute ‘get_uri’” and does nothing.

Selecting a track then clicking on the play icon just plays that track and nothing else.

My card code below (if that’s any help):

I just searched this thread and it looks like a while back someone else had asked for search. Was the limitation in Home Assistant or were you not sure how to access the Sonos Search portion of the API? If it was related to Sonos they do have some documentaiton on how to perform a search. https://developer.sonos.com/reference/sonos-music-api/search/
Just hoping this could get added to the card if possible.
Thanks!

Yes would be nice for sure. Unfortunately I can only use what is offered by the home assistant backend integration for Sonos: Sonos - Home Assistant

Hi Phil,

The “customThumbnailIfMissing” is not working. Please see below code and screenshot. I am running v5.20.1

Can you please see if my code has the syntax error?

  - type: vertical-stack
    cards:
      - type: custom:sonos-media-browser
        entityId: media_player.kitchen_sonos
        mediaTitle: ''
        shuffleFavorites: false
        customThumbnailIfMissing:
          Adele: https://i.imgur.com/fatxhb.jpg
          Bossa Nova: https://i.imgur.com/AMEDMn.jpg

Have you tried to open those two URLs…? I get a “file removed” and a 404 there. Maybe you can give it a try with a valid URL there.

Yes, I have. I just randomly scrambled the URL for posting. The real working URL just working load the images. But this is the actual url:

type: custom:sonos-media-browser
entityId: media_player.kitchen_sonos
mediaTitle: ''
shuffleFavorites: false
customThumbnailIfMissing:
  Adele: https://i.imgur.com/6fatxhb.jpg
  Bossa Nova: https://i.imgur.com/rAMEDMn.jpg

Not sure what you are doing wrong, but I just verified it works:


BMC

Edit:
Question no longer relevant but leaving to potentially help somebody that has the same question
Installed HACS via instructions here: Download | HACS


Hi all, I am a very new user and have allot to learn. My apologises if what I ask is silly.

Kindly explain how I can install this card as I cannot locate it in the store:
afbeelding

When I try to follow the manual instructions “Download the resources, as you would do with all other modules.” i am also lost. I have no idea what to download from which source :confused:

just got sonos & the sonos card setup on my ha system. seems to be working but i don’t understand something fundamental. how do i populate music, radio stations, etc. into the media browser? mine is empty and i can’t find any way to get stuff in there.

All is done through the sonos app.

i figured that, but i must be dense. i do not see how to do it. can you be more specific?

Just start adding your favorites in the Sonos app and then you find them in the media browser of your sonos card.