Replacing Fonts Using a Picker
There are a number of different font settings in a skin that affect different parts of a page. To change settings, you select font settings in the skin editor, apply the settings to skin properties, and preview your changes.
Note: Font properties used by individual skins can vary. The properties described in the following sample procedure may not be available in all skins.
To replace the font settings using a picker
1. As system administrator: Administration Dashboard > User Interface > Skin Administration.
2. To modify a skin, click and then click Edit. 3. Click Fonts.
4. Click the skin property for which you want to replace the font settings.
The skin property is highlighted with a red box.
5. In the Picker panel, click the color to be used as a replacement.
The following table lists the changes you can make to the font values:
Font settings | Selections |
Font-family | Font family. You can select first through tenth choice, enabling the browser to use fonts available on the computer. |
Font-size | Select from a list of relative size values or specify a numeric value. |
Font-style | Select bold, italic, or underline. |
Capitalization | Select from a list of capitalization styles. |
Text-spacing | Specify values to be used for letter spacing, word spacing, and line height. |
6. To set the font values for a skin property, click from either the Picker panel or the Scratchpad panel. 7. At the bottom of the page, click Preview.
The preview demonstrates how your changes have affected the skin.
8. Close the Preview window.
9. Click Save.
Example:
Assume you have created the Carbon Sailing skin as described in
Creating and Modifying a New Skin and want to change the font values used for buttons.
1. As system administrator: Administration Dashboard > User Interface > Skin Administration.
2. To modify a skin, click
and then click
Edit.
3. Click Fonts.
4. Click the button - button text skin property.
5. Under Font-family, in the Primary list, select the Tahoma font.
6. In the Primary list, select the sans-serif.
7. Under Font-style, select Bold.
8. Click
from the
Picker panel.
The check box in the Inherited column is cleared, indicating this skin property is no longer inherited from the parent skin.
9. At the bottom of the page, click Preview.
The following table displays the preview results for the modified button properties:
Default button: | |
New font value: | |
Final button: | |
10. Click Save.