In this article
There are two methods of editing a question skin:
- You can open a question skin for editing by double-clicking on its name in the Question Skins folder in the Survey toolbox, or by right-clicking on it and choosing Edit.
- You can expand the question skin in the Survey Tree, then right-click on the desired element in the skin and select Properties to open the element's properties list.
This opens the Page Editor for the skin - as shown below. As with Themes (go to About Themes for more information), you can then double-click on a question component (or right-click and choose Edit) to open its properties list to change the HTML style for that component.
On the Layout tab you specify the positions of the question elements. Drag-and-drop elements from the “Visual Components” toolbox into the desired locations. In the example below, the question elements are placed in a column on a white background.
Figure 1 - Editing a Question Skin
- Go to the JavaScript tab to insert JavaScript into the question skin. Question skin script will run after the skin is available to the client and any advanced WI features have been initiated.
- Go to the Preview tab to preview the current theme. Note that Authoring must display a preview of a specified question page, so you must select a question in the Survey tree to see the preview.
Setting the Default Skin
The Default skin will be used in all cases when no other skin is specified. To select a particular skin to be the default skin:
- In the Survey Tree toolbox, expand the Question Skins folder.
- Right-click on the skin you wish to define as the default, and select Set as Default from the menu - .
- Save the changes.
Figure 2 - Setting a skin as Default
The text (DEFAULT) is displayed after the skin name.
Editing the Question Components
All the visual components included in a question are set up and edited in the same way; in the Properties sheet for that component. Note that the different components have different properties listed.
To open the Properties sheet for a component, right-click on the component in the Layout page and choose Properties, or double-click on the component - (point 1 in the figure below). To change the HTML style on which the component is based, open the drop-down list beside the Style Name field and select the desired style from the list. The definitions for all the styles in the drop-down list are stored in the HTML Styles folder in the Survey tree (point 2) (go to About HTML Styles for more information)
In the example below, the HTML style specified for the Question Error component is called “error”. .
Figure 3 - Editing a Question Visual Component