Note: This feature is available in SharpCloud versions v9.2.0324 and later
A form is an easy and brilliant way of capturing information for your SharpCloud story. A form can be personalised in the way it appears, so forms can be unique or all consistent in appearance.
To customise a form’s appearance, simply press “Customise Appearance” as shown below in the Manage Forms dialog (found in the Story Setup dropdown menu).
A new “Customise Appearance” dialog will now appear with 2 main tabs as shown below:
Before going into detail of the individual tabs, it’s worth noting a few functions that can apply to multiple forms:
Copy Style/Paste – A style can be copied from one form and applied to another by using the paste function. These functions can be found in the bottom left of the dialog box as shown above.
Reset – Reset is a good way to return the form to the default appearance which is dark theme with the colours already determined as shown above.
Apply/Apply to all Forms – Once a form has been customised, there are 2 options to save the appearance, either save the style for just that form or to all forms in the story.
Note: There are 2 places to find out what form is currently being customised, the dialog title and the form preview window which will show the form.
Theme: There are 3 options for the forms theme, dark theme (default), light theme and use custom colours.
Note: The following options on the colours tab are only available if “use custom colours” is selected as the theme of the form.
Background: Choose the background colour of the form.
Story Name: Choose the colour of the font that represents the story name that appears at the top of the form.
Text: This will alter any text that is currently not covered by any other options, including Form Description and word count limit.
Form Name: The colour of the font that represents the form name that appears just below the story name at the top of the form.
Input Background: The colour of the fields input area.
Input Border: The border colour of the fields input area.
Input Labels: The input labels are the field display name which can be configured in the Manage Form dialog.
Input Text: The colour of the text that can populate the field input area.
Default Button: The colour of any button that is not the submit/update button, such as image picker or Clear.
Default Button Text: The text colour of any button that is not the submit/update button, such as image picker or Clear.
Update Button: Button colour for the Update button.
Update Button Text: Text colour for the Update button.
Submit Button: Colour for the Submit button.
Submit Button Text: Colour of the text for the Submit button.
Header/Footer Images: Images can be applied to the header and footer of the form by either uploading the image or by pasting the image.
Header/Footer Image Alignment: The images can be either centrally aligned, left aligned or right aligned to the form.
Note: The header and footer can have different images and different alignment options if preferred.
Background Image: An image can be uploaded/pasted as a background image of the form.
Note: Maximum background image size is 150px x 320px (150 pixels in height and 320 pixels in width).
There are 3 options for the background image:
- Show All (Default) – This option will retain the image aspect ratio when it is pasted, which may cause a border to be left around the image.
- Fill Space – This option will force the image to fill the space which may cause the image to become cropped.
- Stretch to Fit – Stretching the image to fit the space of the form may cause your image to become distorted.