Last modified by Admin on 2023/08/14 16:54
From version 5.1
edited by melanie@one-count_com
on 2016/12/07 18:52
Change comment: There is no comment for this version
To version 17.1
edited by sonish
on 2017/04/05 15:01
Change comment: There is no comment for this version

Summary

Details

Page properties
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.melanie@one-count_com
1 +XWiki.sonish
Content
... ... @@ -6,7 +6,7 @@
6 6  {{id name="Start ScreenSteps Content"/}}
7 7   The Forms tool allows you to create, edit, delete, and manage forms and questions. Creating a form is as simple as defining basic form information, setting the number of rows and columns in the form, dragging and dropping questions into defined layout, and setting optional vaidations for each question. When a user completes and submits a form, all of the demographic and transaction information from the form is saved in the ONEcount database.
8 8  
9 -Please refer to the Quick Start Guide~-~- Questions and Forms for information on basic concepts and rules relating to forms.
9 +Please refer to the [[Quick Start Guide~~-~~- Questions and Forms>>doc:Quick Start Guide - Questions and Forms]] for information on basic concepts and rules relating to forms.
10 10  
11 11  (% style="color: rgb(0,0,0);" %)When a user completes and submits a form, all of the information gathered from the form is entered into the ONEcount database. Plan forms carefully to ensure that you include questions and possible responses that will provide you with all the data you wish to collect from subscribers/purchasers.
12 12  
... ... @@ -15,13 +15,13 @@
15 15  
16 16  Form-related tasks include:
17 17  
18 -* creating database fields/questions available for placement in online forms; (See Question Builder - Create and Manage Questions for more detail.)
18 +* creating database fields/questions available for placement in online forms; (See [[Question Builder - Create and Manage Questions>>doc:Question Builder - Create and Manage Questions]] for more detail.)
19 19  * creating new forms;
20 20  * managing existing forms;
21 21  * creating source codes that are used to track the source of a name/transaction;
22 22  * and creating individually branded forms.
23 23  
24 -The first task listed above – creating questions is accomplished using the Question Builder tool. The next two tasks – creating new forms and managing existing forms – are carried out using the Form Builder tool under INVENTORY. Creating source codes is handled under Source Codes and creating branded forms is handled under Brands. All of these tools are found under INVENTORY.
24 +The first task listed above – creating questions is accomplished using the Question Builder tool. The next two tasks – creating new forms and managing existing forms – are carried out using the Form Builder tool under INVENTORY. Creating source codes is handled under [[Source Codes>>doc:Source Codes - How to Create and Manage Source Codes (v12\.x)]] and creating branded forms is handled under [[Brands>>doc:Brand - How to Create and Manage Brands (v12\.x)]]. All of these tools are found under INVENTORY.
25 25  
26 26  Note that there are two methods you can use for a form to display in your brand's look and feel.
27 27  
... ... @@ -40,20 +40,24 @@
40 40  (% style="text-decoration: underline;" %)**Method 2**(%%)
41 41   Create a custom header and/or footer when creating a form.
42 42  
43 -=== OPENING THE "CREATE NEW" FORM WINDOW ===
43 +=== OPEN THE MANAGE FORMS WINDOW ===
44 44  
45 -=== Select INVENTORY from the main menu. ===
45 +**Select INVENTORY from the main menu.**
46 46  
47 47  [[image:attach:media_1430428383541.png||align="center"]]
48 48  
49 -=== Select "Forms" from the sub-menu. ===
49 +
50 50  
51 +**Select "Forms" from the sub-menu.**
52 +
51 51  [[image:attach:media_1430428408807.png||align="center"]]
52 52  
53 53  This will open the Manage Forms window where you can select to create a new form. (See below.)
54 54  
55 -=== Click "Create Form". ===
57 +
56 56  
59 +**Click "Create Form"**.
60 +
57 57  [[image:attach:media_1430428555772.png||align="center"]]
58 58  
59 59  This will ope the "Form Builder - Part 1" window where you begin creation of your new form.
... ... @@ -60,7 +60,7 @@
60 60  
61 61  === CREATE FORM PART 1 - INFORMATION ===
62 62  
63 -=== Enter Form Information. (See items #1-6 below.) ===
67 +==== Enter Form Information. (See items #1-6 below.) ====
64 64  
65 65  [[image:attach:Screen Shot 2016-12-07 at 5.43.26 PM.png||width="666" align="center"]]
66 66  
... ... @@ -68,38 +68,54 @@
68 68  
69 69  (2) Enter the **Form Description** (optional). The **Form Description** field is also displayed at the top of the form, under the Form Name, in the front end view. This is the text the user will see with instructions on what to do, e.g. "Complete the form below to receive a free subscription to our weekly newsletter." Form Description text may be styled using the pop-up styling toolbar that appears when you click in the Form Description field, including images, special characters, and links . (See screen shot of front end view below.)
70 70  
71 -(3) Enter the** Custom Header** (optional)
75 +(3) Enter the** Custom Header** (optional) - Remember that this will override a Brand, if one is set. You can enter html/css in this field to display the header in the look and feel defined in the html without some of the issues that can be associated with using a brand (see [[ONEcount SSL and non-SSL Brand Pages)>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/ONEcount+SSL+and+non-SSL+Client+Brand+Pages||shape="rect"]] and without having to append a brand code to the form.
72 72  
73 -(4) Enter the **Custom Footer** (optional)
77 +(4) Enter the **Custom Footer** (optional) - Remember that this will override a Brand, if one is set. You can enter html/css in this field to display the footer in the look and feel defined in the html without some of the issues that can be associated with using a brand (see [[ONEcount SSL and non-SSL Brand Pages)>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/ONEcount+SSL+and+non-SSL+Client+Brand+Pages||shape="rect"]] and without having to append a brand code to the form.
74 74  
75 -(3) Select what Source Code to apply to the form by selecting from the drop-down **Source Code List.** Source Codes are not displayed on the form~-~-this is a back-end function.
79 +(5) Select what Source Code to apply to the form by selecting from the drop-down **Source Code List.** Source Codes are not displayed on the form~-~-this is a back-end function.
76 76  
77 77  **Source Codes** are used to track the source of a transaction, ie the source of the user/name in the ONEcount database. The source code assigned to a form is attached to a user record when the form is completed online. This identifies the form that the user completed, thereby identifying the source of the name in the database. See Source Codes- How to Create and Manage Source Codes for more information.
78 78  
79 79  If you want to assign a Source Code and there are none, you should save your form, create a new code, then return to your form and select that code.
80 80  
81 -(4) Enter the **Product Prompt** text (optional). The **Product Prompt** is the instructional text found above the list of products on the form. (See screen shot of front end view below.) If you leave this field blank, the default text of "Please check the box for each of the products you would like to receive/continue receiving. Unchecked products will not be updated." will be used. Any text you enter here will replace the default text, and you can include html to change the font color, size, etc.
85 +(6) Enter the **Product Prompt** text (optional). The **Product Prompt** is the instructional text found above the list of products on the form. (See screen shot of front end view below.) If you leave this field blank, the default text of "Please check the box for each of the products you would like to receive/continue receiving. Unchecked products will not be updated." will be used. Any text you enter here will replace the default text, and you can include html to change the font color, size, etc.
82 82  
83 -(5) Enter a **Redirect URL** (optional). A **Redirect URL** is a URL to open upon form submission. Redirect URLs are not displayed on the form~-~-this is a back-end function.
87 +(7) Enter a **Redirect URL** (optional). A **Redirect URL** is a URL to open upon form submission. Redirect URLs are not displayed on the form~-~-this is a back-end function.
84 84  
85 -(6) Select a **Submission Option**. (See screen shots of front end view below.)
89 +(8) Select a **Submission Option**. (See screen shots of front end view below.)
86 86  
87 87  * Product Selection Required (The user must select a product to submit the form. If no product is selected, a message will appear below the product prompt text instructing the user to select at least one product to continue.)
88 88  * Product Selection Not Required - Display Warning (The form may be submitted without a product selection, but a pop-up message will appear asking if the user is sure he/she wishes to continue without selecting a product.)
89 89  * Product Selection Not Required - No Warning (The form may be submitted without a product selection, and no warning message will appear.)
90 90  
91 -=== Front-End View Screenshots ===
95 +(9) Enter a **Form Section Header** (optional). A **Form Section Header** allows you to create a custom header for the section of the form where demographic questions are displayed, e.g. "Name and Address" or any descriptive/instructional text. You can add html here to style the text and/or background of the header.
92 92  
93 -[[image:attach:media_1430763892412.png||align="center"]]
97 +(10)** ** Enter a **Subscription Header. **A **Subscription Section Header **allows you to create a custom header for the section of the form where your products/packages are displayed for selection, e.g. "Subscription Term", "Select Your Package" or any descriptive/instructional text. You can add html here to style the text and/or background of the header.
94 94  
95 -[[image:attach:media_1430764964000.png||align="center"]]
99 +(11) **Email Confirmation (Yes/No) **is where you select whether a confirmation email will be sent upon subscription to/registration for any products listed on the form.
96 96  
97 -[[image:attach:media_1430765247198.png||align="center"]]
101 +
98 98  
103 +(% style="text-align: center;" %)
104 +**Front-End View Screenshots**
105 +
106 +[[image:attach:Form Top.png||width="666" align="center"]]
107 +
108 +
109 +
110 +[[image:attach:Form Bottom.png||width="666" align="center"]]
111 +\\
112 +
99 99  [[image:attach:media_1430765149355.png||align="center"]]
100 100  
101 -=== Enter Acknowledgement Email Information. (See Items #7-10 below.) ===
115 +
102 102  
117 +
118 +
119 +
120 +
121 +==== Enter Acknowledgement Email Information. (See Items #7-10 below.) ====
122 +
103 103  [[image:attach:media_1430766909283.png||align="center"]]
104 104  
105 105  (% style="color: rgb(255,0,0);" %)This is where you can create customized acknowledgement emails specific to the form/product attached to the form. Creating these customized emails is optional, as default acknowledgement emails not specific to any form and/or product are configured in the Configuration Manager.
... ... @@ -116,10 +116,8 @@
116 116  
117 117  As with Form Description text, Email content may be styled using the pop-up styling toolbar that appears when you click in the Form Description field, including images, special characters, and links.
118 118  
119 -=== Click the red "Next" button when done with Form Information. ===
139 +**Click the red "Next" button when done with Form Information.**  This will open the "Build Form" window, as shown below.
120 120  
121 -This will open the "Build Form" window, as shown below.
122 -
123 123  === CREATE FORM PART 2 - BUILD FORM ===
124 124  
125 125  [[image:attach:media_1430938547197.png||align="center"]]
... ... @@ -130,7 +130,7 @@
130 130  
131 131  More detail on each of the above steps is provided below.
132 132  
133 -=== Set the number of rows and columns. ===
151 +==== Set the number of rows and columns. ====
134 134  
135 135  [[image:attach:media_1430938787682.png||align="center"]]
136 136  
... ... @@ -138,7 +138,7 @@
138 138  
139 139  As stated in the previous step, the number of rows and columns can be set on a row-by-row basis and can be done at any time during form construction.
140 140  
141 -=== Drag and Drop Questions into Workspace. ===
159 +==== Drag and Drop Questions into Workspace. ====
142 142  
143 143  [[image:attach:media_1430938961950.png||align="center"]]
144 144  
... ... @@ -155,7 +155,7 @@
155 155  Once all questions are placed on the form, set Question Options. Alternatively, question options may be completed as each question is placed on the form.
156 156   To set options, simply click on the question and select options.
157 157  
158 -=== Set Question Options ===
176 +==== Set Question Options ====
159 159  
160 160  [[image:attach:media_1430939154859.png||align="center"]]
161 161  
... ... @@ -164,8 +164,8 @@
164 164  
165 165  (% style="text-decoration: underline; color: rgb(0, 0, 0)" %)**Validations**(% style="color: rgb(0,0,0);" %)**:~*~***(%%)
166 166   (% style="color: rgb(0,0,0);" %)**Required **– Do you want this to be a required (not optional) question on the form. All required questions will be identified by a(% style="color: rgb(164,10,10);" %) ~*~** (% style="color: rgb(0,0,0);" %)on the form. If a user doesn't complete a required question, he/she will be prompted to do so.(%%)
167 - (% style="color: rgb(0,0,0);" %)**Email **– Requires that the information entered on the form be in email format, i.e. c.lechien@dogmail.com. It does not validate whether the email is a real email or not, only that it is in the correct email format.(%%)
168 - (% style="color: rgb(0,0,0);" %)**Number Only **– Only numbers can be entered, i.e. for a numbers-only code.(%%)
185 + (% style="color: rgb(0,0,0);" %)**Email **– Requires that the information entered on the form be in email format, i.e. c.lechien@dogmail.com. It does not validate whether the email is a real email or not, only that it is in the correct email format. Validation looks to match following REGEX :  /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i (%%)
186 +(% style="color: rgb(0,0,0);" %)**Number Only **– Only numbers can be entered, i.e. for a numbers-only code.(%%)
169 169   (% style="color: rgb(0,0,0);" %)**Text Only **– Only text can be entered, i.e. for a text-only code.(%%)
170 170   (% style="color: rgb(0,0,0);" %)**Number and Text** – Numbers and text can be entered.(%%)
171 171   (% style="color: rgb(0,0,0);" %)**Match Email** – For an email field, this will add a "Confirm Email" entry on the form.
... ... @@ -185,7 +185,7 @@
185 185  
186 186  Checkbox-type question set for responses to appear in two columns.
187 187  
188 -=== Move and/or Remove Questions ===
206 +==== Move and/or Remove Questions ====
189 189  
190 190  [[image:attach:media_1430939299804.png||align="center"]]
191 191  
... ... @@ -192,7 +192,7 @@
192 192  To remove a question from a form, click the "x" icon above the question name. This will remove the question, but not the row.
193 193  To move a question to a different location on the form, click the checkered gray area at the left of the row, drag, and drop.
194 194  
195 -=== Delete a Row ===
213 +==== Delete a Row ====
196 196  
197 197  [[image:attach:media_1430939444248.png||align="center"]]
198 198  
... ... @@ -199,7 +199,7 @@
199 199  To delete a row, click the trash can icon at the far right of the row.
200 200   **Note: You must remove the question(s) before deleting a row.** If you try to delete a row with a question(s), you'll get a pop-up message asking you to "Please remove questions to remove the row."
201 201  
202 -=== Once all questions have been placed on the form and options and validations set, click the red "Next" button to move on to Part 3 - Review and Save. ===
220 +**Once all questions have been placed on the form and options and validations set, click the red "Next" button to move on to Part 3 - Review and Save.**
203 203  
204 204  If you wish to go back to Part 1 - Information, click on the red "Back" button. Your work on Part 2 will not be lost, and you can return to it from Part 1 by clicking on "Next". Just be sure to go to Part 3 and save the form before exiting.
205 205  
... ... @@ -213,10 +213,13 @@
213 213  [[image:attach:media_1431545519730.png||align="center"]]
214 214  
215 215  The Review and Save window provides a basic preview of the form and allows you to adjust question response field lengths.
216 - To see a full preview of the form in your site's look and feel, click "Save" and
234 + To see a full preview of the form in your site's look and feel, click "Save".
217 217  
218 -=== Below is an example of what a form might look like on your web site. ===
236 +
219 219  
238 +(% style="text-align: center;" %)
239 +**Example of what a form might look like on your web site.**
240 +
220 220  [[image:attach:media_1431550698440.png||align="center"]]
221 221  
222 222  **1 ~-~-** Form Name
... ... @@ -225,11 +225,12 @@
225 225   **4 ~-~-** Product Prompt Text
226 226   **5 ~-~-** Products attached to the form (notice products subscribed to are identified with "You are currenty receiving:" highlighted in green.
227 227  
228 -=== The screen shot below is an example of the customized acknowledgement email with receipt confirmation (shown in screen shot above) sent to a NEW subscriber/purchaser. ===
249 +(% style="text-align: center;" %)
250 +==== Example of the customized acknowledgement email with receipt confirmation sent to a NEW subscriber/purchaser. ====
229 229  
230 230  [[image:attach:media_1352398034919.png||align="center"]]
231 231  
232 -[[image:attach:media_1477585237131.png||align="center"]]
254 +
233 233  
234 234  
235 235  
... ... @@ -237,33 +237,26 @@
237 237  {{/layout-cell}}
238 238  
239 239  {{layout-cell}}
240 -**Search all Documentation:**
262 +{{panel title="Search all Documentation:"}}
241 241  
242 242  
265 +{{livesearch/}}
266 +{{/panel}}
243 243  
244 -{{livesearch/}}
268 +{{panel title="Search INVENTORY Documentation:"}}
245 245  
246 -
247 247  
248 -**Search INVENTORY Documentation:**
271 +{{pagetreesearch rootPage="Create and Manage Your Inventory"/}}
272 +{{/panel}}
249 249  
274 +{{panel title="On this page:"}}
250 250  
251 251  
252 -{{pagetreesearch/}}
253 -
254 -
255 -
256 -**On this page:**
257 -
258 -
259 -
260 260  {{toc/}}
278 +{{/panel}}
261 261  
262 -
263 -
264 -
265 -
266 -{{expand title="More INVENTORY Documentation"}}
280 +{{panel title="More INVENTORY Documentation:"}}
281 +{{expand}}
267 267  (% style="margin-left: 30.0px;" %)
268 268  [[Inventory - Getting Started>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=66180||shape="rect"]]
269 269  
... ... @@ -315,6 +315,29 @@
315 315  (% style="margin-left: 30.0px;" %)
316 316  [[Source Codes - How to Create and Manage Source Codes>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=66463||shape="rect"]]
317 317  {{/expand}}
333 +{{/panel}}
334 +
335 +
336 +
337 +
338 +
339 +**
340 +**
341 +
342 +
343 +
344 +
345 +
346 +
347 +
348 +
349 +
350 +**
351 +**
352 +
353 +
354 +
355 +
318 318  {{/layout-cell}}
319 319  {{/layout-section}}
320 320  {{/layout}}
Confluence.Code.ConfluencePageClass[0]
id
... ... @@ -1,1 +1,1 @@
1 -66838
1 +11927748
url
... ... @@ -1,1 +1,1 @@
1 -https://info.onecount.net//wiki/spaces/OD/pages/66838/Forms - How to Create a Form (v12.x)
1 +https://info.onecount.net//wiki/spaces/OD/pages/11927748/Forms - How to Create a Form (v12.x)