[\/et_pb_text][et_pb_divider _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_divider][\/et_pb_column][\/et_pb_row][et_pb_row admin_label=”Row” _builder_version=”4.16″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”0px||0px|||” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text admin_label=”Text” _builder_version=”4.27.4″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_margin=”30px||||false|false” use_border_color=”off” border_color=”#ffffff” border_style=”solid” global_colors_info=”{}”]\n
\nINTRODUCTION<\/strong><\/h2>\n<\/blockquote>\n
Another option which is left to the system integrator is the possibility to add customized icons into the configuration software Ilevia Manager<\/a>.<\/p>\n
It is not so unusual to meet customers asking for the possibility of using a wider range of icons. System integrators willing to provide the end users the best experience possible are allowed to create and add countless PNG files containing a bunch of customized icons. System integrators (or user interface specialists) will be free to use the default icons and their personal icons simultaneously during all their projects.<\/p>\n[\/et_pb_text][et_pb_text admin_label=”Text” _builder_version=”4.27.2″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” custom_padding=”||25px|||” use_border_color=”off” border_color=”#ffffff” border_style=”solid” global_colors_info=”{}”]\n
\nPhoto editor software<\/strong><\/h3>\n<\/blockquote>\n
To add new icons it\u00a0is necessary to make use of a professional photo editor software \/ application such as Photoshop.<\/p>\n
Run your photo editor software and do as follow…<\/p>\n
Step 1:<\/strong>\u00a0Create the new PNG file. Set width and height\u00a0(Max 2048 x 2048 Pixel);<\/p>\n
Step 2:<\/strong> Set a grid for the better management of the space. Consult here<\/a> the guide that shows how to customize the grid size in Photoshop.<\/p>\n
We suggest to set a 128×128 Pixel grid. This will allow you to get 256 squares corresponding to\u00a0256 icons.<\/em><\/p>\n
Step 3:<\/strong> Copy\/Paste the customized icons on the PNG file being aware to not add icons bigger than the set grid.<\/p>\n
We suggest to set icons size a little bit smaller than the set grid in order to avoid any possible overlay.<\/em><\/p>\n
Step 4:<\/strong>\u00a0Save the PNG file on your Pc.<\/p>\n[\/et_pb_text][et_pb_divider _builder_version=”4.16″ _module_preset=”default” custom_margin=”||7px|||” global_colors_info=”{}”][\/et_pb_divider][et_pb_text _builder_version=”4.27.4″ global_colors_info=”{}”]\n
\nAdd new icon set<\/strong><\/h3>\n<\/blockquote>\n
After the PNG creation it would be possible to proceed with the file importation on Ilevia Manager software.<\/p>\n
Run the Ilevia Manager (Ver. 5.5.3.5 and above) and do as follow…<\/p>\n[\/et_pb_text][et_pb_text _builder_version=”4.27.5″ _module_preset=”default” hover_enabled=”0″ global_colors_info=”{}” sticky_enabled=”0″]\n
Step 1:<\/strong>Select Project<\/em> –> Icons<\/em> –> Add new icon set<\/em> to open the “Add icons” dialog box;<\/p>\n[\/et_pb_text][et_pb_image src=”https:\/\/support.ilevia.com\/wp-content\/uploads\/2025\/07\/Icon-set_new-icon-set.gif” alt=”How to add a new within the Ilevia configuration software EVE Manager” title_text=”Icon-set_new-icon-set” show_in_lightbox=”on” align=”center” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” _builder_version=”4.27.4″ custom_margin=”50px||50px||false|false” box_shadow_style=”preset2″ global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.18.0″ _module_preset=”default” global_colors_info=”{}”]\n
Step 2:<\/strong>\u00a0<\/p>\n
1.<\/b> Click on “Select file” to choose the PNG file, 2.<\/b> Choose a title for the customized icon set. 3.<\/b> Type the values used on the image grid. 4.<\/b> Click “Ok” to confirm your action.<\/p>\n[\/et_pb_text][et_pb_image src=”https:\/\/support.ilevia.com\/wp-content\/uploads\/2022\/09\/New_icon_set_adding-new-icon-set.png” alt=”Icon set adding procedures within the Ilevia configuration software EVE Manager” title_text=”New_icon_set_adding-new-icon-set” show_in_lightbox=”on” align=”center” _builder_version=”4.20.4″ _module_preset=”default” custom_margin=”50px||50px||false|false” box_shadow_style=”preset2″ global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.20.4″ global_colors_info=”{}”]\n
Since all the steps have been made correctly, the result will be visible on User interface<\/a> tab as showed below.<\/p>\n
The new icon set is linked to your Pc. This means it\u00a0will be available for the user interface<\/a> creation of this and next projects.\u00a0Also, the new icon set will be available any time you will download a project from server containing the PNG file.<\/p>\n[\/et_pb_text][et_pb_image src=”https:\/\/support.ilevia.com\/wp-content\/uploads\/2023\/05\/Icon-set_new-icon-set.png” alt=”This is the Icon pan where you can choose the icon that suits the best your configuration.” title_text=”Icon-set_new-icon-set” show_in_lightbox=”on” align=”center” align_tablet=”center” align_phone=”” align_last_edited=”on|desktop” _builder_version=”4.20.4″ custom_margin=”50px||20px||false|false” custom_padding=”||29px|||” box_shadow_style=”preset2″ global_colors_info=”{}”][\/et_pb_image][et_pb_divider _builder_version=”4.16″ _module_preset=”default” global_colors_info=”{}”][\/et_pb_divider][et_pb_text admin_label=”Text” module_id=”manage-icon-set” _builder_version=”4.18.0″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” use_border_color=”off” border_color=”#ffffff” border_style=”solid” global_colors_info=”{}”]\n
\nManage Icon sets<\/strong><\/h3>\n<\/blockquote>\n
In order to manage<\/b> the Icon sets<\/b> you have, head to the Project<\/em> menu’s text item on top of the screen and click Manage Icon set<\/b>.<\/p>\n[\/et_pb_text][et_pb_image src=”https:\/\/support.ilevia.com\/wp-content\/uploads\/2022\/07\/Icon-set_Manager-icon-set-access.png” alt=”How to access the icon set within the Ilevia Manager software” title_text=”Icon-set_Manager-icon-set-access” show_in_lightbox=”on” align=”center” _builder_version=”4.20.4″ _module_preset=”default” custom_margin=”50px||50px||false|false” box_shadow_style=”preset2″ global_colors_info=”{}”][\/et_pb_image][et_pb_text _builder_version=”4.17.4″ _module_preset=”default” global_colors_info=”{}”]\n
As you can see from the image below, by entering the Icon set Manager<\/b> allows to customize the properties of the Icon set such as: the name, the sizes and to remove it.<\/p>\n[\/et_pb_text][et_pb_image src=”https:\/\/support.ilevia.com\/wp-content\/uploads\/2022\/07\/Icon-set_Icon-manager-window.png” alt=”How to manage all the icon set you have added within the Ilevia manager configuration software” title_text=”Icon-set_Icon-manager-window” show_in_lightbox=”on” _builder_version=”4.20.4″ _module_preset=”default” custom_margin=”50px||50px||false|false” box_shadow_style=”preset2″ global_colors_info=”{}”][\/et_pb_image][et_pb_divider _builder_version=”4.16″ _module_preset=”default” locked=”off” global_colors_info=”{}”][\/et_pb_divider][et_pb_text _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”]\n
\nIcon set Sample project<\/h3>\n<\/blockquote>\n[\/et_pb_text][et_pb_text _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”]\n
In this section of the guide, it is shown how to import an Icon set within the Ilevia Manager<\/a> software.<\/p>\n[\/et_pb_text][et_pb_text _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”]Step 1:<\/strong><\/p>\n
Download the Icon set<\/b> that you can download from the Download banner<\/b> below.<\/p>\n[\/et_pb_text][et_pb_testimonial portrait_url=”data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAwIiBoZWlnaHQ9IjUwMCIgdmlld0JveD0iMCAwIDUwMCA1MDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxwYXRoIGZpbGw9IiNFQkVCRUIiIGQ9Ik0wIDBoNTAwdjUwMEgweiIvPgogICAgICAgIDxyZWN0IGZpbGwtb3BhY2l0eT0iLjEiIGZpbGw9IiMwMDAiIHg9IjY4IiB5PSIzMDUiIHdpZHRoPSIzNjQiIGhlaWdodD0iNTY4IiByeD0iMTgyIi8+CiAgICAgICAgPGNpcmNsZSBmaWxsLW9wYWNpdHk9Ii4xIiBmaWxsPSIjMDAwIiBjeD0iMjQ5IiBjeT0iMTcyIiByPSIxMDAiLz4KICAgIDwvZz4KPC9zdmc+Cg==” quote_icon_color=”#000000″ quote_icon_background_color=”#FFFFFF” font_icon=”||divi||400″ portrait_width=”0px” portrait_height=”0px” _builder_version=”4.27.4″ _module_preset=”default” custom_margin=”30px||30px||false|false” locked=”off” global_colors_info=”{}”]\n
Click the following link to download the preset custom icon file to test it yourself.<\/b><\/p>\n
Download the file here!<\/strong><\/a><\/p>\n[\/et_pb_testimonial][et_pb_text _builder_version=”4.27.2″ _module_preset=”default” global_colors_info=”{}”]Step 2:<\/strong><\/p>\n