Building the ULTIMATE PERSON CARD for Home Assistant!

Поделиться
HTML-код
  • Опубликовано: 4 окт 2024
  • GitHub Link: github.com/mak...
    -- The Stuff behind me --
    Govee Y-Lights: amzn.to/3UiM7y1
    Govee Neon Rope Light: amzn.to/3wpvZTo
    Desk Glow Lamp: amzn.to/3GlfAAB
    Desk Architect's Lamp: amzn.to/3ihPdUf
    Monitors: amzn.to/3ZgN63r
    Monitor Mounts: amzn.to/3vN1z9M
    Mouse: amzn.to/3It7595
    Keyboard: amzn.to/3ik7jon
    StreamDeck: amzn.to/3wqEfyY
    Desk Microphone: amzn.to/3IwCYxz
    Acoustic Panels: amzn.to/3wnALNV
    Chair: amzn.to/3XAgfoX
    Studio Headphones: amzn.to/3WVnffR
    Under-Cabinet Speakers: amzn.to/3IxkHQP
    Camera: amzn.to/3imNq04
    Desk Backlighting Strip: amzn.to/3vJvLCX
    Desk Backlighting Controller: www.athom.tech...
    Desk Backlighting Power Supply: amzn.to/3IwduAD
    Desk Board: amzn.to/3CwFbFy
    Desk Brackets: amzn.to/3GJHDeh
    -Filming setup-
    Camera: amzn.to/3jOsb7C
    Charger/Batteries: amzn.to/3k0fVRr
    Camera Stand: amzn.to/3XifZux
    Microphone: amzn.to/3WRpYXV
    Monitor: amzn.to/3vMcnoB
    Key Light: amzn.to/3WTJkvo
    ----
    DISCLAIMER: This video and description contains affiliate links, which means that if you click on one of the product links, I’ll receive a small commission at no extra cost to you!
    Join this channel to get access to perks:
    / @makeitworktech
    Buy Me a Coffee if you want:
    www.buymeacoff...
    Website:
    www.makeitwork...
    The socials:
    ▶FOLLOW on X: / makeitworktech
    ▶FOLLOW on Instagram: / makeitworktech
    ▶FOLLOW on Facebook: / makeitworktech
    ▶FOLLOW on Reddit: / make_itt_work
    ▶JOIN my Discord: / discord
    ▶CHECK OUT my GitHub: github.com/mak...
    ▶CHECK OUT my Amazon Shop: www.amazon.com...
  • НаукаНаука

Комментарии • 84

  • @MihaiKrieger
    @MihaiKrieger 5 месяцев назад +5

    Never clicked faster. I've been looking for a satisfying example for months, and this is exactly what I need. Thank you for providing the code and the explanations.

  • @fuzzbreezie81
    @fuzzbreezie81 5 месяцев назад +4

    Thanks for taking the time to provide this detail for the community. Now I have some home work to do 😊

    • @makeitworktech
      @makeitworktech  5 месяцев назад

      Haha no problem, thanks for watching!

  • @muimuhadresh3986
    @muimuhadresh3986 3 дня назад

    WOW. Awesome card. And finally someone who explains the code a little bit. That helps alot. Result: I subscribed!
    Thanks alot.

    • @makeitworktech
      @makeitworktech  3 дня назад

      Awesome glad it helped! Thanks for the sub!

  • @indiandarkhorse
    @indiandarkhorse 25 дней назад

    Oh wow! My search has finally ended here! Great video!

  • @PatrickBulteel
    @PatrickBulteel 5 месяцев назад +1

    I haven't seen your dashboard, but after seeing this... it's going to be my next video.

    • @makeitworktech
      @makeitworktech  5 месяцев назад +1

      It's a little outdated but mostly relevant! I need to do one for 2024 but haven't had a chance

  • @4KGofMaul
    @4KGofMaul 4 месяца назад

    Thanks for the vid, I went a little further with some of it for fun/practice as well. My battery icon is determined by a sensor string and that sensor takes the battery level, rounds it to the nearest 10 and gets the corresponding icon for its state and battery level.
    under 10% uses mdi:battery-charging-outline or mdi:battery-alert
    10-90% uses mdi:battery-{value} or mdi:battery-charging-{value}
    full battery uses mdi:battery-charging or mdi:battery

  • @loganabbott9150
    @loganabbott9150 5 месяцев назад +1

    More home assistant dashboard videos please! Get crazy with it!

  • @major_west
    @major_west 5 месяцев назад

    Thanks for sharing this! Bitmoji is very cool. And I can see many uses for the swipe card on my dashboard.

    • @makeitworktech
      @makeitworktech  5 месяцев назад

      Good you like it! Yeah I love the swipe card!

  • @ChrisBoehmvideos
    @ChrisBoehmvideos 5 месяцев назад

    Excellent video, I loved the walk though of the code to help understand it better.

  • @stigsand6512
    @stigsand6512 2 месяца назад +1

    Hi. Im relative new to HA and dashboards. Trying to follow this guide, but can't get any icons to show up in my card. Even when following your script precise. Any suggestions?

  • @gerryf7015
    @gerryf7015 5 месяцев назад

    Very creative Aaron. How long did it take for this card and the entire dashboard. I'm about to take the dive into my first dashboard.
    How about a dashboard video with the new sectional layout?
    Thanks

    • @makeitworktech
      @makeitworktech  5 месяцев назад

      That card was a few months in the making, but I actually got a lot of it from a since deleted reddit post. The dashboard took a few months too.
      Yeah I plan to make a new dashboard video hopefully soon

  • @edwaaij4752
    @edwaaij4752 4 месяца назад

    Thank you. Really very educational.

  • @techdad6135
    @techdad6135 5 месяцев назад

    This is awesome Aaron! Thanks for sharing!
    To get the spotify media player, does that come from the Spotify integration or somewhere else?

    • @makeitworktech
      @makeitworktech  5 месяцев назад +1

      Thanks!
      Yeah I used the spotify integration. but you could also use other integrations I'd imagine

  • @BeardedTinker
    @BeardedTinker 5 месяцев назад

    Nice one Aaron!

  • @joshrp5
    @joshrp5 2 дня назад

    I wish I could simply download this in hacs and input fields. Is that a possibility?

  • @blackheartuk
    @blackheartuk 4 месяца назад

    I love this, I've used your code as a starting point to build a more awesome person card for my dashboard. It's still a work in progress. I worked out you can do a lot more with the battery icon to not only have it change colour to indicate low battery, but you can show when it's charging or use a little maths to show a battery icon that reflects the battery charge left, like so:
    battery: |
    [[[
    if (states["sensor.phone_battery_state"].state == "charging")
    return `

    • @makeitworktech
      @makeitworktech  4 месяца назад

      Ah awesome! That was something I was planning to add for the video, but ran out of time to figure it out. Nicely done!

  • @michaeljolley6773
    @michaeljolley6773 14 часов назад

    Is there a way to display media from my Android phone? I do not see a media_player option or is it not available?

  • @PatrikEnglund-rx9bb
    @PatrikEnglund-rx9bb 4 месяца назад

    Wonderful job done! Always wanted a persons card embedded with icons, unfortunately the icons is nort showing on the card. The bitmoji shows fine but no icons is displayed although the devices and code is correct. Any idea what this could be? Running 2024.5.2 and all HACS frontends is updated to latest version

    • @makeitworktech
      @makeitworktech  4 месяца назад

      It's probably a small syntax error. You can try posting on my discord and we can take a look!

  • @dubyaelle5533
    @dubyaelle5533 5 месяцев назад

    Very slick!

  • @ericbelanger6900
    @ericbelanger6900 5 месяцев назад

    Awesome! Thanks

  • @LeonGrimblat
    @LeonGrimblat Месяц назад

    it's not working for me. if I try to build card ... or copy/past code (with replace name person of cause).... it just not working. I don't see home icon...

  • @simonsayshomeassistant
    @simonsayshomeassistant 5 месяцев назад

    Very cool!

  • @jimmyfrank579
    @jimmyfrank579 3 месяца назад

    Weird issue im having, everything in this video is amazing and works perfect.. on my desktop. When I cast my dashboard with this on it to a google hub the background images dont load. How do I fix this issue?

    • @makeitworktech
      @makeitworktech  3 месяца назад

      Hmmm, that's a weird one! Unfortunately, I don't have any experience with casting

  • @michaelthompson657
    @michaelthompson657 5 месяцев назад

    Cool as!

  • @AKC-81
    @AKC-81 5 месяцев назад

    NICE ONE!

  • @malcass250
    @malcass250 4 месяца назад

    thanks for the great video. I have mine up and running, however its not displaying in the companion app? Any ideas

  • @MarkVP
    @MarkVP 3 месяца назад

    My emoji isn't showing, any suggestions? Thank you. When I use a picture card I do see it.

    • @makeitworktech
      @makeitworktech  3 месяца назад

      It's likely syntax. Hope on discord and post your code. There and we can take a look

    • @MarkVP
      @MarkVP 3 месяца назад

      @@makeitworktech Which discord site. Thanks. I found it.

  • @thyphear
    @thyphear 5 месяцев назад

    I am seeing missed comma between flow collection entries (20:10) when trying to add the IF statements. What am I doing wrong. Everything I see on HA is telling me this is the wrong format. Maybe I am missing an install?

    • @makeitworktech
      @makeitworktech  5 месяцев назад +1

      Hmmm the video is only 13:10 long so I'm not sure what part you're trying to refer to

    • @thyphear
      @thyphear 5 месяцев назад

      @@makeitworktech lol, it’s part of the error code sorry. lol not a time marker. It’s from the every first if statement for the bitmoji.

  • @Sauron6600
    @Sauron6600 4 месяца назад

    I meant to add early but i was wanting to know if possible to add a feature. I tried and the script broke. Right now i have mine setup to where if i'm at work the image changes to something specified and it works fine. But when I tried adding script to where if im watching a movie it would change to an image i put for that. However when i try it just doesn't work. Can you only have one state working in this? Fairly new to home assistant so i'm sure it's a brain fart error.

    • @makeitworktech
      @makeitworktech  4 месяца назад

      Hmmm, you should be able to do that. If you want to, join my discord and me or someone else can take a look at the code

  • @Deuce1912
    @Deuce1912 Месяц назад

    My battery icon is stuck in the bottom right. I cannot seem to get it to the top right. Anyone got any ideas?

    • @makeitworktech
      @makeitworktech  Месяц назад

      Syntax is my guess. You can pop on discord and post there - maybe someone can help

    • @Deuce1912
      @Deuce1912 Месяц назад

      @@makeitworktech Thanks, I ended up figuring it out. The indent for battery: under the custom_fields: was not correct.

  • @nstyqzAKAenestiwaykiucez
    @nstyqzAKAenestiwaykiucez 5 месяцев назад

    Yeyieh!!

  • @gianfilippocastagna3956
    @gianfilippocastagna3956 5 месяцев назад

    wowwww❤

  • @AnasKhan-in3wu
    @AnasKhan-in3wu 4 месяца назад

    how i get image url from file editor ?

    • @makeitworktech
      @makeitworktech  4 месяца назад

      Upper left shows path of the folder you are in

  • @simo035a
    @simo035a 13 дней назад

    i cant get the png to pop up help

    • @makeitworktech
      @makeitworktech  12 дней назад

      Join our discord and we can take a look

    • @simo035a
      @simo035a 11 дней назад

      @@makeitworktech i found the solution. Thank 🤩

  • @coffee80119
    @coffee80119 5 месяцев назад

    Nice video, thanks
    Btw your website is down

    • @makeitworktech
      @makeitworktech  5 месяцев назад

      Thanks! I'll take a look. It's always going down

  • @TheSlimHim
    @TheSlimHim 5 месяцев назад

    test

    • @makeitworktech
      @makeitworktech  5 месяцев назад +1

      Test

    • @TheSlimHim
      @TheSlimHim 5 месяцев назад

      @@makeitworktech lol I made a different comment about the declutter card and didn't see it so I thought maybe I didn't hit submit. So I made the test to see if maybe it was just comment moderation, forgetting if that's the case I couldn't delete the test.

  • @Brian-gw1tc
    @Brian-gw1tc 4 месяца назад

    Maybe some1 can help
    i have the problem thad the background-image: is not working
    did as the video said but its not loading
    this is the code i have there
    [[[if (states["media_player.spotify_yoursgoeshere"].state == "playing")
    return 'url("/local/stickermusicb.png")'; else return
    'url("/local/stickerb.png")'; ]]]
    any1 can help

    • @makeitworktech
      @makeitworktech  4 месяца назад +1

      Try this
      - background-image: 'url("/local/stickerb.png")';

  • @SIR_Studios786
    @SIR_Studios786 Месяц назад

    code not working undefined states["persons._persorname_"].state

    • @makeitworktech
      @makeitworktech  Месяц назад

      make sure you have a device tracker assigned to the person...

  • @robmiller3246
    @robmiller3246 4 месяца назад

    Thank you so much for this!! I have been waiting for you to do this video. I have a question? if i wanted to change background to a different bitmoji when i was away on my location how could I do that? This is what i have now and its not seeming to work. Thank you
    - background-image: >-
    [[[if (states["media_player.spotify_rob_miller"].state == "playing")
    return 'url("/local/bitmoji music.png")'; else return
    'url("/local/bitmoji1.png")'; if (states["person.rob_miller"].state ==
    "away") return 'url("/local/drive.png")'; else return
    'url("/local/bitmoji1.png")'; ]]]

    • @makeitworktech
      @makeitworktech  4 месяца назад

      No problem! Any chance you could join our discord and post there? Its easier to paste code snippets

    • @robmiller3246
      @robmiller3246 4 месяца назад

      @@makeitworktech yes I will look into it.. Thank you

    • @robmiller3246
      @robmiller3246 4 месяца назад

      Ok I posted it in the discord