Displaying Custom Images

You can also create your own skins to use with Precision, and prepare your own images and colors to match your needs. For best results, it is recommended you use a good graphic editor and 7-Zip. 7-Zip is needed to modify, view, edit and repackage files in the skin WAR file.

However, to simplify the editing steps, an exploded WAR custom skin file is included with the Web UI. By modifying the files in \deploy\precision-webui-cust-skin.war, you can avoid having to use 7-Zip to open and repackage the skin resources.

The easiest way to create your own skin is to copy the files in deploy\precision-webui-cust-skin.war to a new folder; for example, deploy\precision-webui-company-skin.war.

2 Copy precision-webui-cust-skin.war to precision-webui-company-skin.war.

3 Open the WEB-INF folder \deploy\precision-webui-company-skin.war\WEB-INF.

4 Using Notepad, open jboss-web.xml. Change the context to the following:

5 Open the images folder \deploy\precision-webui-company-skin.war\images. Using your graphic editor, open and edit the image. However, try not to change the image size. If you make the graphic too big, it may affect the appearance of the Web UI interface. Keep the width of the image at 143 pixels. There is some scope to vary the height of the image but if it deviates from 160 pixels, it can lead to page rendering issues.

6 In the precision.properties file, set the custom skin to company, the context root that you specified in application.xml.

7 Set the application to use the images in the custom skin instead of standard images by setting the following property:

8 Save your change in the precision.properties file.

9 In the Web UI, refresh the screen to display the new logo.

It is not recommended that you change some of the gifs in the image file because they are small and specific. The key image files you need to change are:

• A smaller logo image used in Scan, Pack and Ship, which is precision-logo-small.png

When you decide on a design for your skin, compare your design to each of the existing custom skins. Pick the skin that is nearest to your design and use it as your template. For example, the skin in Customized Skin based on the QAD Skin uses the QAD skin as its template.