Modifying the Files
After you obtained the package archive, you need to extract its contents into a directory, and make the desired changes to the files. Otherwise, you can install the downloaded skin package on the server as is (as described in Installing Skins to Plesk) and then modify the files directly on the server.
Important: If you choose this way, be sure to set the skin information as described in the section Editing the Skin Information below before installing the skin.
Skin Package Structure
The following table explains the structure and contents of the directories and files contained within a skin package.
Note: To help you easily determine the styles or image files you need to change, we recommend using web development tools, such as, for example, Firebug for Mozilla Firefox, or Inspect Elements for Google Chrome. By using these tools, you can select an interface element and learn which styles are applied to it, in which file and line in that file they are defined.
|
|
The You can add style definitions for page background, main fonts, text colors, colors of hyperlinks, border colors for form elements, and so on. |
|
|
|
This directory contains only the icons which are placed in sub-directories by their size. Note that the double icon size is used for support of Retina displays. If you do not plan to customize any of these items, you can remove them from the archive with your custom skin. You can leave only the items that you changed or added. |
|
|
|
This directory contains images that are used as background fillers for some interface elements. Some of these graphic files are sprite sheets that consist of several images that are used in several different places of the product interface. For this reason, when changing a background image, make sure that the corresponding file is not used elsewhere. It is better to create a new graphics file and change the style sheets to use it, instead of merely replacing the file. If you do not plan to customize any of these items, you can remove them from the archive with your custom skin. You can leave only the items that you changed or added. |
|
|
|
|
This directory contains the company and the product logo images shown in Plesk. To change a logo, prepare the file with the same name and replace it in the folder. |
|
|
This file contains the information about the skin package, such as its name and description. |
|
meta.xmlWhen you need to revert your changes and use the default styles or images, just delete your custom CSS definitions from the custom.css file and remove the custom images from the /images/ and /images/logos/ directories of your custom skin.
Editing the Skin Information
To edit you skin information:
Open the file meta.xml and specify the following properties:
- name. Set the name you will use to refer to this skin. Use only latin characters and the minus sign ('-') in the name.
- description. Provide a brief description of the skin.
- version. Specify the skin version.
- vendor. The name of your company or your name.