KB User's Guide - Documents Tab - Embed a Generic Comment/Feedback Form into a KB Document
This document will discuss how to modify and embed a Generic Comment/Feedback form into your KB document. In this document, we will refer to it simply as "form".
The Feedback Form Button
Open a document editor and click on the Feedback form button.
- In the WYSIWYG document editor, click on the Feedback form button.
- In the HTML document editor, select Form.
Placement of the Form in Your Document
Consider where in the Body of the document you would like to place your form, place your cursor there and click on the Feedback Form or Form button.
A pop up box will prompt you to enter an email address to which the data you are collecting should be directed. Enter an individual email address or a group email address. After you click on the OK button, the embedded Form will appear in your document.
This is how the embedded Form appears in the WYSIWYG document editor:
This is how the first few lines of the embedded Form appear in the HTML editor:
The Destination Email Address in the Form
In the example below, a destination email address is entered in the pop up window.
In the HTML editor, you will see the email address has been rewritten, replacing the @ symbol with _at_. This conceals the e-mail address from e-mail address harvesting spam bots.
Verifying and/or Updating the Destination Email Address
To verify whether the destination email address was entered correctly, look for the value next to name="kbInPageForm_to_email" in the HTML editor. Should the destination email address value be incorrect, you may update it, there, in the HTML editor.
In the example below, verification has revealed that the value/intended destination email was entered incorrectly. This can be corrected it in the HTML editor. You may also replace the destination email address with another individual's address or enter a group email address at any time.
Your Form Embedded into a Live Document
Once you have completed your document as per the guidelines used by your KB group, publish your document with the embedded Form.
The image below is an example of a document on a live site with an embedded form. The person viewing the document on the live site has completed the Form and will press the Submit button to send the data to the destination email. Upon clicking Submit, the completed Form will be replaced by the message Thank you for your input! indicating that the data was indeed submitted.
Form Modification
Those who are familiar with HTML may modify some parts of the Form. However, you may not add additional fields. While you may update the field names in the WYSIWYG document editor, the HTML editor also allows you to update the color, size and content of the fields.
Update Field Names
- In the WYSIWYG document editor, click on the field name that you wish to update and make your change. In the example below, I have changed
"Subject"to"Session Title"and"Comment"to"Bio". Please note that"Session Title"is on two lines when updated in the WYSIWYG editor. - In the HTML editor, find the correct field label and update as needed.
In the example below the "Subject" label is replaced with "Session Title". The " " is the entity used to represent a non-breaking space disallowing the break or wrap of a line of text at the point that it occupies.
In the example below, the use of the non-breaking space allows Session Title to appear on one line of the form.
Prepend the Subject Field
In the HTML editor, you may enter a value inside of the Subject field. The person completing the form will enter their information after the value you chosen. Adding a value in the field will help sort the emails generated by the Form in the destination email's inbox.
The value of the Subject field defaults to value="". In the example below "Conf:" was entered as the value.
The field is then prepended to look like this:
When multiple emails come into the destination email's inbox, the data generated by the form can be easily sorted by Email Subject.
Modify Form Display
While in the HTML editor, you may update the background color of Form, the thickness of the outlines as well as cell padding and spacing.
In the example below:
- The color has been modified by replacing the hex color value of #eeeeee in
style="background-color:#eeeeee;with the hex color value of #E0F0B2. - The border width has been modified by replacing the width value of 1px in
border: 1px solid silver;with the width of 2px.
