Page 1 of 1

Is it possible to use own icons for ToggleButton

Posted: 18 May 2018, 14:37
by Hanland
I have some custom icons that I would like to use for the on and off icons instead of the fa-* collection.

Is this possible???

This goes for any icon property I guess.

Regards

Re: Is it possible to use own icons for ToggleButton

Posted: 30 May 2018, 08:23
by mert.sincan
You can use onIcon and offIcon properties of ToggleButton component.

Re: Is it possible to use own icons for ToggleButton

Posted: 31 May 2018, 13:24
by Hanland
How do you specify the icon path? I have tried a "file" path as for the img src="path" but this does not work???

Re: Is it possible to use own icons for ToggleButton

Posted: 01 Jun 2018, 11:43
by mert.sincan
After you create a custom icon name, you can add it with CSS;

Code: Select all

onIcon="myCustomOnIcon"

//css
body .myCustomOnIcon {
    background: url('...........');
    background-repeat: no-repeat;
    background-size: cover;
    height: 1em;
    width: 1.28571429em;
    position: relative;
    top: 2px;
}
You can change the above css according to yourself.

Re: Is it possible to use own icons for ToggleButton

Posted: 06 Jul 2018, 01:17
by shilpikanade
Hey, Did you ever get this to work for you? I am trying to set the icon of the MegaMenu the same way but its not working for me.

Thanks, Shilpi

Re: Is it possible to use own icons for ToggleButton

Posted: 06 Jul 2018, 14:39
by cagatay.civici
Here is a demo;

https://www.primefaces.org/primereact/#/togglebutton

If you have font-icons that would be easier.