Decommissioned in v19
As well as using site skins created by the Encodify staff, the user can create their own skins and apply them to the sites in the system. As well as login pages, skins are site specific, and therefore are assigned to each site separately.
Create and Configure Skins
Decommissioned in v19
To create a new skin in the system, follow the below described steps:
Go to System Configuration > Appearance > Skins.
In the Skins window, click New Skin, to create a new skin.
The Skin Creator window opens.
The Skin Creator window consists of three sections:
The left pane consists of nine tabs that represent different controls in the system interface that can be configured. Navigating through the tabs allows setting up parameters for a definite group of controls.
In the middle pane (configuration section)the user sets the parameters for the set control that corresponds to the tab he is standing on. Each tab representing the group of controls has its own settings.
The right pane — is a Preview pane, where you can see how the settings specified in the middle pane are applied to the controls corresponding to the tab.
The Skin Creator window opens on the Start tab with the introductory information in the configuration pane, and the preview pane with the default skin settings.
Click the Main Elements tab to start new skin setup. In the Skin Name field, type the name of the new skin. By default the name of the newly created skin is My New Skin. You can leave the default name, but keep in mind that skin name is unique and cannot be used for more than one skin. From the color picker in the Background Color field, select the background color for the skin.
The Main Elements tab has three sections, where you can set up the appearance of the top bar, breadcrumbs, and portal page buttons.
Configuring the top bar specify the background color using the color picker of the Background color field. Upload the file to the Background image field. Specify the left and right logo by uploading images to the corresponding fields and specify their size in the Size in pixels field. The default values in the Size in pixels fields are “50*50”.
In the Breadcrumbs section, specify the background color, texture, text color, font face, and font size in the corresponding field. Also select the Bold/Italic check boxes to specify the font style.
Configure the portal page buttons by specifying the button color, button border color, text color, button texture, width, font face, and font size. Also select the Bold/Italic check boxes to make the text bold or/and italic respectively.
Click the Update preview button to see you changes applied in the right preview frame.
On the Headers tab specify the settings for the header, and two sub headers. In the corresponding fields, specify background color, texture, text color, font face and size, and select the style of the text — bold or/and italic.
Click Update Preview to apply the settings and view the result in the Preview pane.
On the Lists tab, configure the appearance of the item lists in the system. In the corresponding fields, specify background color, texture, text color, font face and size, and select the style of the text — bold or/and italic.
Click Update Preview to apply the settings and view the result in the Preview pane.
Move to the Toolbars tab to specify configuration for toolbar appearance, and the appearance of toolbar buttons, and buttons appearance on mouse over and mouse click. You can specify whether to show the icons on the toolbar buttons or not, by selecting or clearing the Show Icons check box.
Configure tabs appearance on the Tabs tab. Specify general setting for the tabs in the system by selecting background color, texture, font and size. Also configure the appearance of the active and inactive tabs in the corresponding sections, and the appearance of the tab on mouse over.
Large, small and vertical separators are specified on the Separators tab. Specify the background color for all the three kinds of separators. For large separators upload the background image and specify the height in pixels. Also specify the height for small separators in the Height field of the Small Separators section.
Perform configuration of the different input fields on the Input Fields tab. Specify settings for simple text fields, text areas and select boxes by selecting background, border, text color, font face and size and bold or/and italic style in the corresponding fields.
Configure the appearance of other different UI controls on the Misc. Boxes tab. Enter settings for picture box, button box, and text box in the corresponding sections. Specify background and border color, and corner radius in the Picture Box sections. In the Button Box and Text Box sections, in addition to the above mentioned parameters, specify text color, font face and size.
After all the user interface elements have been configured, click the Save Skin button to apply and save the changes.
Create Skin based on Other Skin
Decommissioned in v19
To make the process of creating new skins more efficient and quick, the user has the possibility to create new skins based on the already existing ones. By copying the existing skin, the user at the same time uses the existing skin as a template for creation of another skin.
To create a new skin based on the already existing one, follow the below described steps:
On the Skins page, click Copy Skin on the toolbar.
The Copy Skin window opens.
The Based On drop-down list represents the list of all the previously created skins. Select the skin form the list which you want to make a template for a newly-created skin.
After you selected the skin to copy, the New Skin Name field will be filled in automatically with the name of the selected skin with added “_copy”. This is the default name of the copied skin, which you can overwrite at any time.
Click Copy, and a new skin will be created based on the selected existing one. You can now proceed modifying the new skin by clicking the Edit icon and changing the settings of different user interface elements.
Apply User-Defined Skins to the System
Decommissioned in v19
After a user-defined skin has been created, it can be applied to the system. As it was previously mentioned, skins are site and user specific, meaning that you can specify different skins to different users and sites. The skin specified for the user has higher priority than the skin specified for the site.
User-defined skins can be specified in the following places in the system:
System Configuration > Site edit
System Configuration > Users > Active Users
Site Configuration > Users > Active Users
To assign the skin to the site, do the following:
Go to System Configuration > Site List > Site Edit.
Click the Appearance tab, and select the skin from the Skins drop-down list. The list of skins available for selection contains the skins already existing in the system (created by the Encodify staff) and the skins that have been created by the user.
Click OK to save the selection.
As previously mentioned, you can assign the skin to the user in two places in the system: System Configuration and Site Configuration. When assigning skin to a user in System Configuration, you can assign skins to several sites at the time for the same user. In Site Configuration, you can only assign the skin to a user that will be applied only to this particular site respectively.
To assign the skin to the user in System Configuration, perform the following steps:
If you want to assign a skin to a user globally, go to System Configuration > Users > Active Users.
Choose the user you want to assign a particular skin to, and click the Edit icon.
Click the tab with the site you want to assign the skin to.
Select the skin from the list of skins in the Skin drop-down list.
Click OK to apply the settings.
The procedure of assigning the skin to a user in Site Configuration is the same as described above.
The skin is applied to the site or user right after it is specified and saved without restarting tomcat.