Unlike previous versions, the visual appearance of Telerik RadPanelBar v4.0 is completely controlled with skins. (See Changes and Backward Compatibility for a detailed list of changes.)
To select a skin, set the Skin property of the RadPanelBar class.
Telerik RadPanelBar is installed with a number of preset skins. You can tweak the existing skins, or create your own.
 |
Predefined skins are located in ~/RadControls/PanelBar/Skins. If you intend to use skins other than the default, you need to add the RadControls folder to the root of your web application. |
Creating custom skins
The fastest way to get started with your own custom skin is by modifying an existing skin. From http://www.telerik.com/skins, you can download all resources necessary to deploy or modify selected skins for the Telerik components. Each skin archive contains the images and the CSS file needed to apply a skin in your project, as well as the original Adobe Photoshop PSD source file you will need to modify the design. For more instructions, please refer to the Readme file in the skin archive.
Organization of skin files and folders
The default location of Telerik RadPanelBar skins is RadCotrols/PanelBar/Skins. Each skin folder contains:
- Img/ - the sub-folder where the skin images are stored;
- styles.css - the stylesheet of the skin.
Naming conventions
Upon creating a new skin, have in mind that the folder where the new skin is stored is named after the skin itself. Also, within the Styles.css document, to all classes should be appended a suffix with an underscore and the name of the new skin. For example:
| |
 Copy Code |
|
.RadPanelBar_MyCustomSkinName
{
font: bold 10px Verdana, Arial, Arial, Sans-serif;
} |
See Also