Customizing design of Helpdesk request forms

The content and the visual appearance of a request-sending form available to your website visitors can be easily customized using the form constructor and the CSS editor in Helpdesk app.

To access the form-editing mode, first open the settings screen of the workflow to which that particular form belongs.

1. Form constructor

The form constructor allows you to change the form content, i. e. combination and sort order of form fields as well as settings of individual fields within a form.

Changing combination of fields

To add a new field, click on "Add contact fields" and "Add request fields" depending on whether you want to request common or personal information from a client.

To delete a field, move the mouse cursor over the field name and click on the deletion icon on the right.

To change the sort order of fields, drag and drop them to the desired location using the sort management icon to the left of the field name.


Individual field settings

To change various properties of individual fields, click on the name of the desired field in the form constructor, and specify necessary parameters in the pop-up area.

In the field settings dialog, the following properties are available:

  • Label: text label to be displayed next to the field.
  • Label placement: to the let, or above the field, or not displayed at all.
  • View:
    • Drop down or radio buttons. This option is available only for custom fields offering one of several options to a user. You can create such a field using the "Admin → Field constructor" section in Helpdesk by selecting the "drop down" field type.
    • Plain text or Redactor (WYSIWYG editor). This option is available for fields allowing a user to enter large multi-line text.
  • Placeholder: default text to be displayed in a text field until a user begins to type his or her own text.
  • Required: whether a user must complete this field to be able to submit the form.
  • Identification: for the "Phone" field there is an option to automatically connect a newly received support request with an existing contact, if the that contact's phone number is specified in the form.

Extra form elements

You can also add custom text paragraphs, and horizontal lines for better visual separation of elements on a large form, using constructor elements "Text paragraph" and "Horizontal rule".

2. CSS styles

You can apply professional look to your request submission forms by editing CSS styles. Use the built-in CSS editor on the form-editing screen, which is available via "Edit CSS" link after you enable the "Use this form on the site" option in form settings.

0 comments

    Add comment

    To add a comment please sign up or login