How to change the syle of a switch? [SOLVED]

fxcoolby · July 30, 2019, 1:27am

I want to change the style of my switch from two buttons on and off shown on the bottom to slider switch or the single button toggle switch does anyone know how to do that?

tom_l · July 30, 2019, 1:44am

You need to add switch state feedback.

What sort of switch is it?

If there is no feedback available from the switch you can set optimistic: true for mqtt switches but the state of the switch in the front end may get out of sync with the physical switch if it can be controlled by some method other than home assistant.

DavidFW1960 · July 30, 2019, 2:14am

Try this in configuration.yaml

homeassistant:
  customize_domain:
    light:
      assumed_state: false

flamingm0e · July 30, 2019, 2:17am

So you want the 2 buttons to become one?

Make a group, or make a third switch that runs those 2. You’re over thinking this.

DavidFW1960 · July 30, 2019, 2:23am

He doesn’t like the 2 flash symbols for the light is how I read it in which case my solution will give him a slider switch.

flamingm0e · July 30, 2019, 2:25am

He has another thread this conversation came from.

I was assuming he was trying to combine them.

If he would use a switch it would work just fine.

tom_l · July 30, 2019, 2:52am

This:

fxcoolby · July 30, 2019, 6:42pm

Thanks for your input guys. I am implementing an MQTT switch which turns on a group of Insteon switches from Openhab (Insteon scene doesn’t work well in HA yet).

Here I am solely concerned about the cosmetics of the buttons on the lovelace. I want the front yard to look master closet light (slider switch). assumed_state: false didn’t work nor setting the optimistic: true.

Any other ideas?

fxcoolby · July 30, 2019, 6:50pm

I have it like this in my config:

homeassistant:
    customize: !include customize.yaml
    whitelist_external_dirs:
        - '/config/tmp'
    customize_domain:
      light:
        - platform: mqtt
          name: "Front Yard"
          command_topic: "light/group/fy"
          assumed_state: false

however, check config spits out this error:

expected a dictionary for dictionary value @ data[‘customize_domain’][‘light’]

flamingm0e · July 30, 2019, 7:18pm

All I can say is that this mqtt switch works 100% for me without changing any customization:

- platform: mqtt
  name: 'Poo Button'
  command_topic: 'homeassistant/switch/poo_btn/cmd'
  state_topic: 'homeassistant/switch/poo_btn/state'
  payload_on: 'on'
  payload_off: 'off'
  retain: true

fxcoolby · July 30, 2019, 7:23pm

light:
    - platform: mqtt
      name: "Front Yard"
      command_topic: "light/group/fy"
      optimistic: true
      retain: true

This is how I have it, but still shows as two button switch like how it is on the the picture I posted.

DavidFW1960 · July 30, 2019, 10:20pm

I never said to include all that other stuff in the customize domain. Just try it like I posted.

fxcoolby · July 30, 2019, 11:08pm

Nice it worked like charm

DavidFW1960 · July 31, 2019, 12:06am

Yeah it works for me too lol… I was pretty sure that was what you wanted.

fxcoolby · July 31, 2019, 1:23am

Thank you so much david

haaahaha · March 21, 2021, 12:09pm

@DavidFW1960 how about going the opposite way? I want the 2 icons instead of the sliding switch. Thank you.

tom_l · March 21, 2021, 12:14pm

Remove your state topic (and template if there is one).

pspeirs · November 22, 2021, 1:42am

An old topic I know however I couldn’t get any of the options working for me.
I want to see the slider switch (per the below image), instead I’m seeing the two icons.

My configuration is as follows:

Lovelace Card

type: entities
title: NFT System
entities:
- entity: switch.greenhouse_isolate_nft
  icon: mdi:pipe-valve
  name: Isolate Auto Top Up

YAML

input_boolean:
notify_home:
name: Notify when someone arrives home
icon: mdi:car

greenhouse_isolate_nft:
name: Greenhouse Isolate NFT

switch:
- platform: template
switches:
greenhouse_isolate_nft:
friendly_name: NFT Isolated
turn_on:
service: input_boolean.turn_on
data:
entity_id: input_boolean.greenhouse_isolate_nft
turn_off:
service: input_boolean.turn_off
data:
entity_id: input_boolean.greenhouse_isolate_nft

tom_l · November 22, 2021, 2:57am

Please format your pasted configuration correctly. See point 11 here: Help us help you

Your switch does not have a value_template to determine what state the switch is in.

You could add this to the switch config:

value_template: "{{ is_state('input_boolean.greenhouse_isolate_nft', 'on') }}"

But this seems kind of pointless. Why are you duplicating an input boolean as a switch?

mixpc · June 17, 2023, 7:45am

Hello,

I’m running Home Assistant Core 2023.5.4 on a Raspberry Pi. Before posting, I have read different contents and related community topics and run different tests and still cannot get the switch to replace to two lightnings for my RF switch to ligh the bulb on or off:
https://www.home-assistant.io/docs/configuration/customizing-devices/
https://www.home-assistant.io/docs/configuration/
https://community.home-assistant.io/t/integration-error-customize-integration-customize-not-found/428713
https://community.home-assistant.io/t/customize-include-customize-yaml-causing-an-error-in-the-config/120496/13

As I am in Core this is my setting:

configuration.yaml

# Loads default set of integrations. Do not remove.
default_config:

# Load frontend themes from the themes folder
frontend:
  themes: !include_dir_merge_named themes

# Text to speech
tts:
  - platform: google_translate

automation: !include automations.yaml
script: !include scripts.yaml
scene: !include scenes.yaml
homeassistant:
  customize: !include customize.yaml

[...]

mqtt:
  switch:
    - name: bulb
      unique_id: myuniquebulbid_1
      state_topic: "home/OMG_ESP8266_RF/MQTTto433"
      command_topic: "home/OMG_ESP8266_RF/commands/MQTTto433"
      value_template: '{{ value_json.value}}'
      payload_on: '{"value":1111}'
      payload_off: '{"value":0000}'
      state_on: 1111
      state_off: 0000
      qos: "0"
      retain: true
      device_class: switch

customize.yaml (only two lines)

switch.bulb:
  assumed.state: false

And this is how it looks:

Frontend:

Entity:

I must be missing something, but I do not know what else to try at this point so any feedback is appreciated.