When you are editing the card, there is an option in the bottom left called “show code editor” where you can edit the raw yaml that makes the card work:
I see show code editor, but what card are you starting with? Entities card?
Actually the raw editor is accessed by clicking the three dots icon in the top right of your dashboard twice.
First press to get into edit mode:
Then when in edit mode press the three dots again to select raw edit mode:
You will then see the raw edit mode where you can paste the templates at the top of the existing config:
Press Save when done.
Here’s some code to start you off…
1 Like
If you used custom:button-card and button card templates you could reduce that code by 80% as it mostly repeats the same thing over and over.
See post here Vizio TV Integration - #35 by 0rchid2434
Most of the code is posted here: https://github.com/kbrown01/Vizio_DirecTV
1 Like
Is there a way to get this as simple as possible in the UI? Like a card that could be configured.
That would be great.
Hi
awesome set up!
I’m trying to extend it with channel button, which should show the channel logo’s (svg or png), however they just turn up als ‘file’ icon
I have set show_entity_picture: true in both the template and the icon_button definition
entity_picture is defined as /local/assets/channels/npo1.svg
What am I missing here?
Nevermind, I used entity-picture instead of entity_picture 
Could you share the code?
Here’s the remote part itself as the rest is still work in progress. The services is a mix between a media player entity, adb commands and a broadlink remote entity. Planning to clean this up at some point.
type: entities
entities:
- type: custom:hui-entities-card
entities:
- type: custom:hui-grid-card
cards:
- type: custom:button-card
tap_action:
action: call-service
service: media_player.toggle
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:power
hold_action:
action: none
show_name: false
size: 100%
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458834 && sendevent
/dev/input/event4 1 103 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458834 && sendevent
/dev/input/event4 1 103 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:arrow-up-bold
hold_action:
action: none
show_name: false
size: 100%
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
tap_action:
action: call-service
service: remote.send_command
service_data:
device: lg_tv
command: input
entity_id: remote.broadlink_schlafzimmer
show_icon: true
show_name: false
icon: mdi:import
size: 100%
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458832 && sendevent
/dev/input/event4 1 105 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458832 && sendevent
/dev/input/event4 1 105 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:arrow-left-bold
hold_action:
action: none
show_name: false
size: 100%
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458840 && sendevent
/dev/input/event4 1 96 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458840 && sendevent
/dev/input/event4 1 96 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:checkbox-blank-circle
hold_action:
action: none
show_name: false
size: 100%
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458831 && sendevent
/dev/input/event4 1 106 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458831 && sendevent
/dev/input/event4 1 106 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:arrow-right-bold
hold_action:
action: none
show_name: false
size: 100%
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458833 && sendevent
/dev/input/event4 1 108 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458833 && sendevent
/dev/input/event4 1 108 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:arrow-down-bold
hold_action:
action: none
show_name: false
size: 100%
columns: 5
square: true
- type: custom:hui-grid-card
cards:
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 458993 && sendevent
/dev/input/event4 1 158 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 458993 && sendevent
/dev/input/event4 1 158 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:arrow-u-left-bottom
hold_action:
action: none
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 786979 && sendevent
/dev/input/event4 1 172 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 786979 && sendevent
/dev/input/event4 1 172 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
icon: mdi:home-outline
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: androidtv.adb_command
service_data:
command: >-
sendevent /dev/input/event4 4 4 786496 && sendevent
/dev/input/event4 1 139 1 && sendevent /dev/input/event4 0 0
0 && sendevent /dev/input/event4 4 4 786496 && sendevent
/dev/input/event4 1 139 0 && sendevent /dev/input/event4 0 0
0
entity_id: media_player.fire_tv
show_name: false
show_icon: true
icon: mdi:menu
- type: custom:button-card
tap_action:
action: call-service
service: media_player.volume_down
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:volume-minus
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: remote.send_command
service_data:
device: lg_tv
command: mute
entity_id: remote.broadlink_schlafzimmer
icon: mdi:volume-variant-off
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: media_player.volume_up
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:volume-plus
hold_action:
action: none
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: media_player.media_previous_track
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:rewind
hold_action:
action: none
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: media_player.media_play_pause
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:play-pause
hold_action:
action: none
show_name: false
- type: custom:button-card
tap_action:
action: call-service
service: media_player.media_next_track
service_data:
entity_id: media_player.fernseher_schlafzimmer
icon: mdi:fast-forward
hold_action:
action: none
show_name: false
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
tap_action:
action: call-service
service: media_player.media_stop
service_data:
entity_id: media_player.fernseher_schlafzimmer
show_name: false
icon: mdi:stop
hold_action:
action: none
- type: custom:button-card
tap_action:
action: call-service
service: scene.turn_on
service_data:
entity_id: scene.fernsehszene_schlafzimmer
show_name: false
icon: mdi:lightbulb
hold_action:
action: none
columns: 3
square: false
card_mod:
style: |
ha-card {
--ha-card-background: white;
--ha-card-border-width: 0px;
}
Bear in mind that there were design changes in the HA frontend since I posted the screenshot, so the border will look different.
Thanks, looks good 
What is the code you used to display the picture buttons at the bottom. I have a picture displayed but it isn’t taking up the full button.
I made up two remote using ha-floorplan. You can see them over here Share your Floorplan - #714 by OzGav
Just standard picture cards in a grid. You can define actions in picture cards, so no need for a button.
1 Like
If anyone is interested in a pre-made ready to go remote control solution for their Amazon Fire devices, I’d recommend checking out this project:
3 Likes
good job man, looks GREAT! Wish I found this years ago…
I have a Logitech Harmony Remote ( Harmony Touch) and it has really served me well for many many years. Now that I have been getting proficient with Home Assistant, sadly I have been phasing the Harmony remote out and trying to use just my “simple” Roku remote and one I make for HA.
GREAT JOB though wish you had more keywords so I would had found earlier
Harmony really
Love this! I have a remote I created in photoshop, but have no clue how to get that image into home assistant and make the buttons function. Is there any documentation or guidance on this, or could you give me a run down? Thanks!