Change default halo icons

Support
#1

I’m trying to change the default icons used in halo, I found a properties file called default-theme.properties, but I do not know where I should place it in my project to make the changes I require.
If it is correct to change it this way?

1 Like
#2

Did you try to follow instructions in the Creating a Custom Theme section?

#3

Yes, the difference is that I do not want to use Font Awesome if I do not own icons. The only touch that I want to do is to change the icons.

#4

Hi,

you can change default icons to PNG versions one by one:

  1. Create theme extension using Studio

  2. Create file halo-theme.properties in your project package inside web module

  3. Set cuba.themeConfig property in web-app.properties:


cuba.themeConfig = halo-theme.properties /com/company/customicons/halo-theme.properties
  1. In your halo-theme.properties file you can set concrete icon key to null:

cuba.web.icons.create.png=
  1. Then you can add your custom create.png icon to web/themes/halo/icons

Or you can disable font icons completely using WebConfig property in web-app.properties:


cuba.web.useFontIcons = false

Also you can change default icons for standard actions: Create / Edit / Remove / etc. Default icons for standard actions are defined in default-theme.properties file. Set custom icons in your halo-theme.properties:


actions.Create.icon=icons/custom-create.png
#5

Where exactly do you need to store the halo-theme.properties file and how to configure? Tried several locations/configurations but could not get it to work.

So mainly steps 2 and 3 are not clear to me.

#6

For step 2: go to web module src in your IDE and create halo-theme.properties file in your package, in my example it is com.company.customicons.

In step 3 you should use path of your halo-theme.properties in the cuba.themeConfig value. In my example it is /com/company/customicons/.

#7

Thanks Yuriy, after some trial-and-error I got it to work.

Now I am configuring some icons but not able to do all of them., see below.


# These work ok
actions.Add.icon=font-icon:PLUS
actions.Create.icon=font-icon:PLUS
actions.Edit.icon=
actions.Remove.icon=
actions.Refresh.icon=

# These do not work
actions.Copy.icon=
actions.Save.icon=
actions.OkClose.icon=
actions.Ok.icon=
actions.Yes.icon=
actions.No.icon=
actions.Close.icon=
actions.Cancel.icon=

I have tried to find more information on what names for the actions to be used but couldn’t find anything. Do you have such information available?

#8

See my answer in your new topic: Replacing default icons - CUBA.Platform