To help users create beautiful surveys, Pollograph provides several professionally designed survey templates. If you wish to design your own survey template, use the Custom CSS feature to personalise your survey design. All of Pollograph’s free-to-use, custom-built design templates were created using this feature.
Each Pollograph survey is served through HTML, and its appearance can be customised by styling it with a specific CSS style sheet. You can link your custom CSS file to your survey from the Settings page, under the “Custom CSS” option.
For a reference of CSS IDs and classes which you will require to style your survey, download the Pollograph Custom CSS Layout Reference Guide:
How to use the Custom CSS Layout Reference Guide
Each survey is enclosed within HTML tags, of different element IDs and classes.
Styling Your Survey Header
Use the following IDs and classes to structure and design your survey header:
- DIV/#header
- DIV/#logo
- H1
Styling Your Survey Questions
All survey questions are encompassed in containers:
- DIV/#wrapper
- DIV/#container
Each question is encompassed in by containers too:
- DIV/.questionItem (or .questionitemAlt)
- DIV/.(questionTypeName)
Questions in your survey are displayed with alternating container classes, .questionItem and .questionItemAlt. Use these two classes to differentiate between questions.
Styling Question Options
In questions which have a descriptive text accompanying the checkbox or input line, the text and inputs are enclosed within a table, then a table-cell.
- TD/.(questionTypeNameText)
- TD/.(questionTypeNameInput)