Creating a custom skin includes a number of steps as this document explains. Once your custom skin is uploaded to the APS catalog and certified, you can download and distribute it across your brands.
In this document:
A typical development process contains the following steps:
On your lab platform, find the default skin shipped with the platform installation package. The skin folder is
/usr/local/pem/wildfly-10.1.0.Final/ext/webgate/static/skins/v3/
.
Note
Depending on the WildFly version, the corresponding folder name varies.
You can either edit the skin directly on the management node or download it to your local computer for editing. In any case, back up the default skin to ensure you can restore it after you finish the skin development.
If there are some custom skins imported to the platform, you can use them as initial data for creating the new skin in addition to or instead of the default skin. Locate the custom skins as explained in the Related Locations section.
Inside the skin folder, customize the styles in the css/custom.css
file
as explained in the Modify Custom Skin section. This will override
the styles defined in other CSS files inside the css/
folder.
If necessary, update the static content, for example, images including icons in the images/
folder.
Once the new skin meets your expectation, package all updated and new files in a ZIP archive and start the certification procedure as explained in the Validation and Publication section.
Editing the skin involves modifying styles in the custom.css
file
and making changes to logos and artwork files referenced from this and other CSS files.
Note
Any modification of skins shall include any copyright or other proprietary notices that were included on a skin when you first received it. Skin modifications that hide or make unreadable any elements of Odin Automation copyright will prevent your skin from being approved by the APS team. Hiding or replacing Odin Automation copyright in the Odin Automation user interface is out of skins customization scope and subject to a special agreement. For details, contact your Ingram Micro sales representative.
Assuming that there is only the default skin on your platform, connect to the server to edit the skin as follows:
Use an SSH client to access the folder containing the default skin on the server.
Back up the contents of the folder, so you can easily roll back your changes later.
Copy the folder content to your computer and edit the
custom.css
file preserving the size and format of the images included in
the skin.
For more details on custom.css
and other files included in the skin, see Skin Structure
and Editing Skin.
Note
Do not change the layout rules in custom.css
and locations of the skin files - the
paths to those files are specified in a separate CSS file that cannot be customized.
If you want to use your own icons instead of the standard ones, open the images/
folder
and replace the default icon images with custom images of the same
pixel size and format.
You can also use custom fonts and additional images by copying
them to the skin folder and editing the links to external files in the custom.css
file.
To apply your changes to the platform, copy the new and updated skin files back to the management node.
Once you finished modifying the skin, compress the folder with the new and modified skin files
into a ZIP archive. The folder that you need to compress is named content/
and it includes
two sub-folders: css/
and images/
.
The next step is to upload the resulting ZIP archive to the APS catalog where it will be published by the APS team after verification as explained in the Validation and Publication section.