View source for ProDon:Creating a Web Form

{{Header_ProDon|1|4.6.9.20|Nadia Carrier||2013/06/27}} 

== Introduction<br>  ==

The Online Donations Module allows the donors to make donations directly through the Web. 

<br> 

In order for the donors to be able to make donations, a website must first be created and configured. The creation of online donations website includes the configuration of the home page and the website, as well as the creation of different Web forms. Each Web form is attached to a donation occasion, this ensures that Internet users are able to register online to the fundraising activities of the organization, or make a donation directly online. 

<br> 

Moreover, when an Internet user make a donation or register to an activity through a Web form, '''''ProDon''''' automatically adds him or her to the database when importing the donations. 

<br> 

== Creating a Web Form<br>  ==

If it is not already done, it is better to configure the home page and the website prior to creating Web forms.<br> 

To learn how to configure the home page and the website, consult this procedure.<br> 

To create a Web form, go to "Web form management".<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
To do so, click on the "Configuration" menu, then select "[[Image:Web form button.png]] Web forms".<br> 

|-
| colspan="2" | [[Image:Creating a Web Form 001.png]]<br>
|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on "[[Image:Web form button.png]] Web forms", this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 002.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The [[Image:Button add plus.png]], [[Image:Button Edit.png]] and [[Image:Button Minus remove delete.png]] buttons allow you to add, modify or delete a form, select the right form&nbsp; at <span style="color: rgb(255, 0, 0);">'''N'''</span>. To modify or delete a form, select the right form at <span style="color: rgb(255, 0, 0);">'''N'''</span>, then click on [[Image:Button Edit.png]] or on [[Image:Button Minus remove delete.png]]. 

'''NOTE:''' It is highly inadvisable to delete a form, it is better to archive it. View point <span style="color: rgb(255, 0, 0);">'''D'''</span> to learn how to archive a Web form. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> If the [[Image:Dot in the middle button.png]] button is orange, this means that the form selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span> is "In development". A form that is "In development" is being created and cannot be viewed on the test website or on the production website. When creating a form, it is "In develpoment" by default. To view the list of forms "In development", go to the tab at <span style="color: rgb(255, 0, 0);">'''K'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> If the [[Image:In production button.png]] button is orange, this means that the form selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span> is "In test" or "In production". A form "In test" means that the form is almost completely created and can be viewed on a website provided for this purpose for internal testing. Once there is no more correction necessary, the form has to become "In production", in order to make it accessible to all Internet users. To voew the list of form "In test" or "In production", go to the "Active" tab, at <span style="color: rgb(255, 0, 0);">'''L'''</span>.<br> 

'''NOTE:''' See points <span style="color: rgb(255, 0, 0);">'''E'''</span>, <span style="color: rgb(255, 0, 0);">'''F'''</span>, <span style="color: rgb(255, 0, 0);">'''G'''</span> and <span style="color: rgb(255, 0, 0);">'''H'''</span> to learn how to publish a form in test or in production. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> If the [[Image:Button checkbox checked crossed.png]] button is orange, this means that the form selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span> is "Archived". An "Archived" form is an inactive form, which means that this form is not used for the moment or will no longer be used. To archive a form, select the form to archive at <span style="color: rgb(255, 0, 0);">'''N'''</span>, then click on the [[Image:Button checkbox checked crossed.png]] button. To view the list of archived forms, go to the tab at <span style="color: rgb(255, 0, 0);">'''M'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Test button.png]] button allows you to publish the form selected at <span style="color: rgb(255, 0, 0);">'''N'''</span> on the test website, i order to view and test it before putting it online. <br> 

'''NOTE:'''&nbsp;After clicking on this button, 3 options become available, select the appropriate option. 

'''CAUTION:''' You must publish the form on the test website '''each time''' edits are made.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> The&nbsp;[[Image:Publish button.png]] button allows you to publish the form selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span>. 

'''NOTE:''' After clicking on this button, 3 options become available, select the appropriate option.<br> 

'''CAUTION:''' You must publish the form on the test website '''AND''' on the production website '''each time''' that edits are made.<br> 

'''CAUTION:''' If the [[Image:Maintenance button.png]] button is not activated during the modification, '''''ProDon''''' will demand that you activate it before making the modifications. For more information concerning maintenance, see point <span style="color: rgb(255, 0, 0);">'''I'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The [[Image:Test button.png]] button allows you to view the home page of the forms or theform selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span> on the test website. A test form can be viewed on a website provided for the purpose of internal testing. <br> 

'''NOTE:''' After clicking on this button, 3 options become available, select the appropriate option. 

'''CAUTION:''' So that the last modifications become visible on the form, you have to publish it on the test website before viweing it. To learn how to publish a form in test, see point <span style="color: rgb(255, 0, 0);">'''E'''</span>. 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> The [[Image:Production website button.png]] button allows you to view the home page of the forms or the form selected at&nbsp;<span style="color: rgb(255, 0, 0);">'''N'''</span> on the production website. The forms published on the production website are visible and can be completed by any Internet users.&nbsp; 

'''NOTE:''' After clicking on this button, 3 options become available, select the appropriate option.<br> 

'''CAUTION:''' So that the last modifications become visible on the form, you have to publish it on the test website '''AND''' on the production website before viewing it. To learn how to publish a form in production, see point <span style="color: rgb(255, 0, 0);">'''F'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> If the [[Image:Maintenance button.png]] button is orange, this means that the website is in maintenance. To view an example of website in maintenance, click here. 

'''NOTE:''' It is required to activate the maintenance button to be able to send a form or the modificatiosn made to the home page on the production website.<br> 

'''CAUTION:''' When the wbsite is in maintenance, none of the forms can be completed by Internet users and nobody can view the home page. Therefore, it is important to deactivate the maintenance after sending the form or the home page on the production website.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> The "All" tab contains all types of forms ("In development" forms, "In test" forms, "In production" forms and archived forms) available in the "Form management".<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> The "In development" tab contains only the forms that are being created; that is, the forms that have not yet been published on the test website nor on the production website. For more information concerning forms "In development, see point <span style="color: rgb(255, 0, 0);">'''B'''</span>.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> The "Active" tab contains only the forms that have been published on the teste website or on the production website. For more information concerning Forms "In test" or "In production", see point <span style="color: rgb(255, 0, 0);">'''C'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> The "Archived" tab contains the forms that have been deactivated; that is, the form is not used for the moment or might never be used again. For more information concerning archived forms, see point <span style="color: rgb(255, 0, 0);">'''D'''</span>.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''N:'''</span> It is the list of forms available in the selected tab. 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button add plus.png]] button or on the [[Image:Button Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 003.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> It is the form code.<br> 

'''NOTE:''' It is important to give a precise code so that the search becomes more effective. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> Allows you to determine whether the form should be created in French only, English only, or in both languages.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> These are the French and English names of the form. To view an example of name, see '''point'''<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;"> D</span></span> of the "Home Page Example" section of the&nbsp; "Home Page and Website Configuration" document.&nbsp; 

'''NOTE:''' It is important to give a precise name so that the search becomes more effective. 

'''CAUTION: '''If the "English" checkbox at <span style="color: rgb(255, 0, 0);">'''B''' </span>is deactivated, the field for the English name is not available. 

| 
<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">D:</span></span> These are the French and English descriptions of the form. To view an example of description, see '''point'''<span style="color: rgb(255, 0, 0);">''' E'''</span> of the "home Page Example" section of the "Home Page and Website Configuration" document. 

'''CAUTION:''' If the "English" checkbox at <span style="color: rgb(255, 0, 0);">'''B'''</span> is deactivated, the field for the English description is not available. 

|}

<br> 

=== "Form Options" Tab  ===

This tab allows you to configure the general appearance of the form. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 004.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The "Display on the home page" checkbox allows you to display or not the form on the home page.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The "Expiration date of the form" field allows you to specify an expiration date for the form. This field is used mostly for a registration form for an event, when there is a deadline to register. From the expiration date , a message saying that the form is expired will be displayed when opening '''''ProDon'''''.<br> 

'''CAUTION:''' Even if an expiration date is specified, you will ahve to manually deactivate the form on the day of the expiration date. If the form is not manually deactivated, it will remain available for Internet users.<br> 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> When the option "According to the filled out form" is selected, if the client fills out the form in English, he or she will be added as an English speaker in '''''ProDon''''' during the import.<br> 

If the option "Ask the client" is selected , you will have to specify the languages by clicking on the [[Image:Specify languages button.png]] button, then a field allowing you choose the language will be added to the form. For instance, if the donor fills out the English form, but he or she specifies that his or her language is French, he or she will be added as a French speaker in&nbsp;'''''ProDon''''' during the import. To view an example of field allowing you to choose the language, see '''point '''<span style="color: rgb(255, 0, 0);">'''H'''</span>&nbsp; of the "Web Form Example1" section.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Edit labels button.png]] button allows you to modify the names of all the fields of the form, except for the "Transaction" section. It is possible to create groups of labels in order to reuse them in all the forms. For more information concerning label groups, see this document.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Edit labels button.png]] button allows you to modify the names of the fields in the "Transaction" section of the form. It is possible to create label groups in order to be able to resuse them in all the forms. To learn more about labels, consult this document.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> The "Personal donor" checkbox allows individuals to make donations.<br> 

'''NOTE:''' Check the checkbox at <span style="color: rgb(255, 0, 0);">'''G'''</span> to enable companies to make donations. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The "Corporate donor" checkbox allows companies to make donations.<br> 

'''NOTE:''' Check the checkbox at&nbsp; <span style="color: rgb(255, 0, 0);">'''F '''</span>to enable individuals to make donations.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> The "Job title required" checkbox requires the donor to enter his or her job title, if he or she is a corporate donor.&nbsp; 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> Choose among the options in the drop-down menu. By selecting the "Personal" option, the "Personal" type of donor will appear by default on the form. By selecting the "Corporate" option, the "Corporate" type of donor will appear by default on the form. By selecting the "ask before form entry" option, a window opens prior to the opening of the form, asking you to choose either options. By selecting "None", the "Donor type" section will blink when opening the form, until a donor type is specified.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> Decide whether the default transaction is a regular transaction or a commitment transaction. In order for the two options to be available, you must activate them in the "Transaction" and "Commitment" tabs.<br> '''NOTE:''' It is possible to create a form with only transactions, only commitments or a form allowing both transactions and commitments. 

'''CAUTION:''' To be able to activate commitments in a Web form, the "Prospecting and Commitments" module must be activated in&nbsp; '''''ProDon'''''. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> If this checkbox is checked, the registration number of the organization will appear at the bottom of the form. To view an example of NPO label, see '''point '''<span style="color: rgb(255, 0, 0);">'''E'''</span> of the "Web Form Example 2" section. 

<br> 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> If this checkbox is checked, the donor is required to specify his or her email address in the form. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> If this checkbox is checked, the donor is required to enter hie or her email address a second time. 

| 
<span style="color: rgb(255, 0, 0);">'''N:'''</span> When the "Phone number required" checkbox is checked, you can also decide if you want to require the phone number. For instance, the checkboxes "Home", "Office and extension" and "Mobile" are checked plus the "Phone number required" option, the donor will have to enter at least one of the three, but will be able to choose which one he or she wants to give. On the other hand, if the "Home" and "Phone number required" are checked, the donor will have to his or her home phone number and will be able to enter others if he or she wishes to.<br> 

'''NOTE:''' The "Personal" section allows you to choose which number individuals will have to provide and the "Corporate" section allows you to choose which number companies will have to provide. For instance, if in the "Corporate" section, only the "Office and extension" checkbox is checked, companies will be required to enter an office phone number to make transactions. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''O:'''</span> If the "Display the comment" checkbox is checked, a "Comment" field will appear at the bottom of the form. To view an example of "Comment" field, see '''point '''<span style="color: rgb(255, 0, 0);">'''F'''</span> of the "Web Form Example 2" section. 

| 
<span style="color: rgb(255, 0, 0);">'''P:'''</span> If this checkbox is checked, the activity for which the donor has made a donation will be displayed in the payment confirmation.<br> '''NOTE:''' If the payment information is displayed in a table, this option is unavailable. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''Q:'''</span> By clicking on this button, the following window opens. 

| <br>
|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the&nbsp;[[Image:GET & POST button.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 005.png]]<br>
|-
| colspan="2" | 
Changing for the parameter mode, allows you to send prefilled information to a Web form from another Web platform or from an HTML email.&nbsp; 

This is an advanced feature is meant for Web developers who wish to change parameters with the GET or POST method. 

'''''Logilys''''' does not offer training nor direct support on the usage, except to Web programmers who already have the reuired qualifications to handle this function. 

'''NOTE:''' To learn more about the GET and POST parameters of the Web forms, consult this document.<br> 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Specify languages button.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 006.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are the languages that can be selected for the person who completes the form. To view an example allowing the user to choose the language, see '''point '''<span style="color: rgb(255, 0, 0);">'''H'''</span> of teh "Web Form Example 1" section.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add a new language to the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button Edit.png]] button allows you to modify an existing language in the list. To do so, select the language to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button. [[Image:Bouton Modifier.png]].<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D: '''</span>The&nbsp;[[Image:Button Minus remove delete.png]] button alllows you to remove a language from the list.&nbsp; To do so, select the language to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button[[Image:Bouton Retirer.png]].<br> 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Edit labels button.png]] button, this window opens.<br> 

|-
| colspan="2" | [[Image:Creating a Web Form 007.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> It is the list of the form labels.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> By clicking on the [[Image:Bouton dupliquer.png]] button, it is possible to duplicate anoter label group. For more information concerning label groups, consult this document.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button Search.png]] button displays the search bar.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button Edit.png]] button allows you to modify a label in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the label to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button.<br> 

|}

<br> 

=== "Transaction" Tab  ===

This tab allows you to configure the "Transaction" section of the form. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 008.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> If this checkbox has been activated, the "Transaction" section will be available on the form.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Bouton dupliquer.png]] button allows you to duplicate transactional information from another form. 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> Select the donation occasion for which the transactions will be made. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This checkbox displays or not the payment information on the form. If this checkbox is unchecked, it is possible to make $0 transactions. For instance, it is possible to create a form to register to a free event, make a scholarship request or for financing. During the import, a $0 pending transaction will be then imported in '''''ProDon.''''' 

'''NOTE: '''It is required to use a "Pending" payment method. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This checkbox displays the payment information in a chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''B'''</span> of the "Web Form Example 2" section.&nbsp; To view an example of payment that is not in the chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''B'''</span> of the "Web Form Example 1" section. 

'''NOTE:''' Donors can select more than one activity only if the payment information is displayed in a chart. 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> These are the activities for which the donor can make a donation or register. To add, modify or delete activities, see '''points''' <span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">G</span></span>, <span style="color: rgb(255, 0, 0);">'''H'''</span> and <span style="color: rgb(255, 0, 0);">'''I'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The [[Image:Button add plus.png]] button allows you to add activities at&nbsp;<span style="color: rgb(255, 0, 0);">'''F'''</span>.<br> 

'''NOTE:'''&nbsp; The activity must have previously been created in the "Donation occasion management".<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> The [[Image:Button Edit.png]] button allows you to modify an activity in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''F'''</span>. To modify an activity, select the activity to modify, then click on the [[Image:Button Edit.png]] button. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> The [[Image:Button Minus remove delete.png]] button allows you to delete an activity at&nbsp;<span style="color: rgb(255, 0, 0);">'''F'''</span>. To delete an activity, select the activity to delete, then click on the [[Image:Button Minus remove delete.png]] button. 

'''NOTE:''' If an activity is deleted from here, it will only be removed from the formand will always exist in the "Donation occasion management".<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> This button allows you to determine a minimum and maximum amount or quantity for donations. The minimum and maximum determined here will be applied to all the activities of the form. 

'''NOTE:''' It is also possible to set a different minimum or maximum amount or quantity for each activity. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> When the "Use the receipt checkbox" checkbox is checked, the donor has the choice to get or not a receipt. Moreover, the checkbox is always checked by default, except if a minimum amount is specified at <span style="color: rgb(255, 0, 0);">'''P'''</span> and that the amount of the donation is less than the minimum amount. To view an example of receipt checkbox, see '''point '''<span style="color: rgb(255, 0, 0);">'''D'''</span> of the "Web Form Example 2" section.<br> 

'''NOTE:''' It is highly recommended to always check this checkbox so that all the donors can receive a receipt if they wish to.<br> 

'''CAUTION:''' If the activity for which the form is assigned is configured not to issue receipts, the checkbox will not appear on the form, even if the one above is checked. 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> When an Internet user makes an instant payment, that he or she wants to get receipt and that this checkbox is checked, a link allowing you to print its receipt will be added to the payment confirmation email, which keeps the organization from issuing the receipt, since the donor would have already received it in an email. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> The "Personal receipt" checkbox allows you to issue receipts to individuals. For instance, if the "Personal receipt" checkbox is not checked, none of the individuals will receive receipts, even if the checkbox at&nbsp;<span style="color: rgb(255, 0, 0);">'''K'''</span> is checked. However, if the "Personal receipt" checkbox is checked and that the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked, individuals will have the choice to get a receipt or not. 

'''NOTE:''' To enable the issuance of receipts to companies, see '''point''' <span style="color: rgb(255, 0, 0);">'''N'''</span>. 

| 
<span style="color: rgb(255, 0, 0);">'''N:'''</span> The "Corporate receipt" checkbox allows you to issue receipts to companies. For instance, if the "Corporate receipt" checkbox is not checked, none of the companies will get a receipt, even if the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked. However, is the "Corporate receipt" checkbox and the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> are checked, companies will have the choice to get or a receipt or not. 

'''NOTE:''' To enable the issuance of receipts to individuals, see '''point''' <span style="color: rgb(255, 0, 0);">'''M'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''O:'''</span> If this checkbox is checked, only one receipt will be issued annually. For more details concerning the issuance of annual receipts, see the "Processing of Receipts to be Issued" procedure. 

| 
<span style="color: rgb(255, 0, 0);">'''P:'''</span> This field allows you to determine a minimum amount to issue a defalut receipt. For instance, if an amount of $20.00 is entered in this field and that a donation of $15.00 is made, the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> will not be checked by default on the form. However, if the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> has not been checked in the window above and that the amount of the donation is lower than the minimum amount, the client will not be able to get the receipt, even if he or she wishes to get one. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''Q:'''</span> This checkbox allows you to issue receipts for '''all''' the donations for which the amount is higher than the minimum amount. If this checkbox is checked and that the one at <span style="color: rgb(255, 0, 0);">'''K'''</span> is not checked, clients will not have the choice to get or not the receipt (donations for which the amount is less than the minimum amountwill not get receipts and the donations for which the amount is more then the minimum amount will get a receipt). If this checkbox is checked and that the one at <span style="color: rgb(255, 0, 0);">'''K'''</span> is also checked, donors who have given less than the minimum amount will have the choice to get a recipt or not, and donors who had given more than the minimum amount will get a receipt. 

| <br>
|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the "Configure validations on quantity and amount" button, this window opens.<br> 

|-
| colspan="2" | [[Image:Creating a Web Form 009.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> Allows you to enter a minimum amount a donor can give.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> Allows you to enter a maximum amount a donor can give. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> Allows you to enter a minimum number of tickets a donor can buy.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> Allows you to enter a maximum number of tickets a donor can buy.<br> 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to sell tickets in multiples. For instance, if you enter 2 in the box, donors will be able to buy even numbers of tickets.<br> 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button add plus.png]] button or the [[Image:Button Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 010.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The drop-down list allows you to choose the activity that has to be modified or added.<br> 

'''NOTE:''' The activity must have previously been created in the "Donation occasion management". 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to give a French label to an activity.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This field allows you to give an English label to an activity.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This field allows you to create a French label for the number of tickets sold or the amount of the donation.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to create an English label for the number of tickets sold or the amount of the donation.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> This checkbox alows you to display the activity selected at <span style="color: rgb(255, 0, 0);">'''A '''</span>on the form.<br> 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> This option displays an "Other amount" field on the form when there are suggested amounts. To view an example of "Other amount" field, see '''point '''<span style="color: rgb(255, 0, 0);">'''C'''</span> of the "Web Form Example 1" section. 

|-
| style="text-align: center;" colspan="2" | [[Image:Creating a Web Form 011.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> To suggest donation amounts on the form, enter them here. To view an example of a form with suggested amounts, see '''point '''<span style="color: rgb(255, 0, 0);">'''D'''</span> of the "Web Form Example 1" section.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add suggested amounts to the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The&nbsp;[[Image:Button Edit.png]] button allows you to modify an amount in the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the amount to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The&nbsp;[[Image:Button Minus remove delete.png]] button allows you to remove an amount from the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the amount to remove at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button.<br> 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Bouton dupliquer.png]] allows you to duplicate the suggested amounts from another activity of the form to enter them at dupliquer les montants <span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

|-
| colspan="2" | [[Image:Creating a Web Form 012.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are the notes that will be displayed under the activity on the form. To view an example of note below an activity in a chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''C'''</span> of the "Web Form Example 2" section. To view an example of note that is not below a chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''E'''</span> of the "Web Form Example 1". section.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add a note to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

'''NOTE:''' To learn how to configure the "Add note to the form" window, see this section.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The&nbsp;[[Image:Button Edit.png]] button allows you to modify the notes at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The&nbsp;[[Image:Button add plus.png]] button allows you to delete a note at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to delete at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button.<br> 

|-
| colspan="2" | [[Image:Creating a Web Form 013.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> This field allows you to choose the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> is fixed or it can be modified by the donor. If the option chosen here is "The donor cannot modify the amount", the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> will be entered by default when opening the form and the donor will not be able to modify it. However, if the option chosen here is "The donor may modify the amount", the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> will be entered by default when opening the form, and the donor will be able to modify it. 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to specify a default amount or quantity. This amount will be displayed by default when opening the form.<br> 

'''NOTE:''' When the activity is an event and that it is a ticket sale, this field will be named "Default quantity". In this case, it is possible to specify a quantity that will be displayed by default when opening the form. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This field allows you to assign a minimum amount or quantity to make a transaction through the form. 

'''NOTE:''' When the activity is an event and that it is a ticket sale, the field will be named "Minimum quntity". 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This field allows you to assign a maximum amount or quantity to make a transaction through a form.<br> 

'''NOTE:''' When the activity is an event and that it is a ticket sale, the field will be named "Maximum quantity". 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to sell tickets in multiples. For instance, donors will only be able to buy even numbers of tickets. 

'''NOTE:''' This field is visible only if the activity is an event and that it is a ticket sale. 

|}

<br>

=== "Commitment" Tab  ===

Allows you to configure the "Commitment" section of a Web form. 

&nbsp; 

==== "Donation occasion and activities" Tab  ====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 014.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> If this checkbox is activated, the "Commitment" section will become available in the form.<br> 

The [[Image:Bouton dupliquer.png]] button allows you to duplicate commitment information from another form.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Bouton dupliquer.png]] button allows you to duplicate transactional information from another form.<br> 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> If this checkbox is checked, the end date and the objective will be specified in the form. To view an example of commitment with an end date and an objective, see '''point '''<span style="color: rgb(255, 0, 0);">'''F'''</span> of the "Web Form Example 1" section.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> Select the donation occasion for which the commitments will be made.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This checkbox displays the commitments in a chart. To view an example of payment information in a chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''B'''</span> of the "Web Form Example 2" section. To view an example of payment information that is not in a chart, see '''point '''<span style="color: rgb(255, 0, 0);">'''B'''</span> of the "Web Form Example 1" section. 

'''NOTE:''' Donors will be able to select more than one activity only if the payment information is displayed in the table.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> These are the activities for which the donor may commit to donating. To add, modify or delete activities, see '''points''' <span style="color: rgb(255, 0, 0);">'''G'''</span>, <span style="color: rgb(255, 0, 0);">'''H'''</span> and <span style="color: rgb(255, 0, 0);">'''I'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The [[Image:Button add plus.png]] button allows you to add activities at&nbsp;<span style="color: rgb(255, 0, 0);">'''F'''</span>.<br> 

'''NOTE:''' The activity must have previously been created in the "Donation occasion management". 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> The [[Image:Button Edit.png]] button allows you to modify an activity in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''F'''</span>. To do so, select the activity to modify, then click on the [[Image:Button Edit.png]] button. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> The&nbsp;[[Image:Button Minus remove delete.png]] button allows you to remove an activity from the list at <span style="color: rgb(255, 0, 0);">'''F'''</span>. To do so, select the activity to remove, then click on the [[Image:Button Minus remove delete.png]] button.<br> 

<br> '''NOTE:''' If an activity is deleted from here, it will only be removed from the form and will always exist in the "Donation occasion management".<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> This button allows you to determine a minimum and a maximum amount per instalment. The minimum or maximum determined here will be applied to all the activities of the form. 

'''NOTE:''' It is also possible to assign a different minimum and maximum amount for each activity.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> When the "Use the receipt box" checkbox is checked, the donor has the choice to get or not a receipt. Moreover, this checkbox is always checked by default in the form, except when a minimum amount is specified at <span style="color: rgb(255, 0, 0);">'''O'''</span> and that the amount of the donation is lower than the minimum amount. To view an example of receipt, see '''point '''<span style="color: rgb(255, 0, 0);">'''D'''</span> of the "Web Form Example 2" section<br> 

'''NOTE:''' It is also possible to assign a different minimum and maximum amount or quantity for each activity. 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> The "Personal receipt" allows you to issue receipts to individuals. For instance, if the "Personal receipt" checkbox is not checked, none of the individuals will get a receipt, even if the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked. However, if the "Personal receipt" checkbox is checked and that the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked, individuals will have the choice to get or not a receipt. 

'''NOTE:''' To enable the issuance of receipts to companies, see '''point''' <span style="color: rgb(255, 0, 0);">'''M'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> The "Corporate receipt" checkbox allows you to issue a receipt to companies. For instance, if the "Corporate receipt" checkbox is not checked, none of the companies will get receipts, even if the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked. However, if the "Corporate receipt" checkbox is checked and that the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is checked, companies will have the choice to get or not receipts. 

'''NOTE:''' To enable the issuance of receipts to individuals, see '''point''' <span style="color: rgb(255, 0, 0);">'''L'''</span>.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''N:'''</span> If this checkbox is checked, only one receipt will be issued annually. To learn more about annual receipts, see the "Processing of Receipts to be Issued" procedure. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''O:'''</span> This field allows you to determine a minimum amount for the issuance of a receipt by default. For instance, if an amount of $20.00 is entered in this field and that a $15.00 donation is made, the checkbox at<span style="color: rgb(255, 0, 0);">'''K'''</span> will not be checked by default in the form. However, if the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> was not checked in the window above and that the amount of the donation is lower than the minimum amount, the client will not get a receipt, even if he or she wishes to get one. 

| 
<span style="color: rgb(255, 0, 0);">'''P:'''</span> This checkbox allows you to issue receipts for '''all''' donations for which the amount is higher than the minimum amount. If this checkbox is checked and that the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is not checked, clients will not have the choice to get or not a receipt (donations for which the amount is lower than the minimum amount will not get receipts and the donations for which the amount is higher than the minimum amount will get receipts). If this checkbox is checked and that the checkbox at <span style="color: rgb(255, 0, 0);">'''K'''</span> is also checked, donors who will have given less than the minimum amount will have the choice to get or not receipts, and donors who will have given more than the minimum amount will get receipts. 

|}

<br> 

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the "Set up validation on quantity and amount" button, this window opens.<br> 

|-
| colspan="2" | 
[[Image:Creating a Web Form 015.png]] 

|-
| width="20%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> Allows you to enter a minimum amount the donor can donate.<br> 

| width="20%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> Allows you to enter a maximum amount the donor can donate.<br> 

|}

<br> 

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button add plus.png]] button or the [[Image:Button Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 016.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The drop-down list allows you to select the activity to add or to modify. 

'''NOTE:''' The activity must have previously been created in the "Donation occasion management". 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to assigne a French label to the activity. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This field allows you to assign an English label to the activity. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This field allows you to create a French label for the amount of the donation. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to create an English label for the amount of the donation. 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> This checkbox displays in the form, the activity selected at <span style="color: rgb(255, 0, 0);">'''A'''</span>. 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> This option displays the "Other amount" field in the form when there are suggested amounts. To vies an example "Other amount" field, see '''point '''<span style="color: rgb(255, 0, 0);">'''C'''</span> of the "Web Form Example 1" section.<br> 

|-
| style="text-align: center;" colspan="2" | [[Image:Creating a Web Form 017.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> To suggest donation amounts in the form, enter them here. To view an example of form with suggested amounts, see '''point '''<span style="color: rgb(255, 0, 0);">'''D'''</span> of the "Web Form Example 1" section.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add suggested amounts to the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button Edit.png]] button allows you to modify an amount in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the amount to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button Minus remove delete.png]] button allows you to remove an amount from the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the amount to delete at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button. 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Bouton dupliquer.png]] button allows you to duplicate the suggested amounts of another activity of the form to enter them at <span style="color: rgb(255, 0, 0);">'''A'''</span>. <br> 

|-
| colspan="2" | [[Image:Creating a Web Form 018.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are the notes that will be displayed below the activity in the form. To view an example of note below an activity in a table, see'''point '''<span style="color: rgb(255, 0, 0);">'''C'''</span> of the "Web Form Example 2" section. To view an example of note below an activity that is not in a table, see '''point '''<span style="color: rgb(255, 0, 0);">'''E'''</span> of the "Web Form Example 1" section.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add a note to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. 

'''NOTE:''' To learn how to configure the "Add form note" window, see this section.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button Edit.png]] button allows you to modify the notes at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button Minus remove delete.png]] button allows you to delete a note at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to delete at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button. 

|-
| colspan="2" | [[Image:ProDon Création formulaire Web 019.png]][[Image:Creating a Web Form 019.png]]<br>
|-
| 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> This field allows you to decide if the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> is fixed or if it may be modified by the donor. If the option selected here is "The donor cannot modify the amount", the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> will be entered by default when opening the form and the donor will not be able to modify it. However, if the option selected here is "The donor can modify the amount", the value entered at <span style="color: rgb(255, 0, 0);">'''B'''</span> will be entered by default when opening the form, but it may be modified by the donor. 

| 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to specify a default amount. This amount will be displayed by default wneh opening the form.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This field allows you to assign a minimum amount to make a transaction via the form. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This field allows you to assign a maximum to make a transaction via the form. 

|}

<br>

==== "Frequencies" Tab  ====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 020.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are the frequencies that the donor can choose for his or her commitment.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button_add_plus.png]] button allows you to add frequencies to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button_Edit.png]] button allows you to modify the frequencies in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the frequency to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button_Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button_Minus_remove_delete.png]] button allows you to delete a frequency from the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the frequency to delete at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button_Minus_remove_delete.png]] button. 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Bouton_dupliquer.png]] button allows you to duplicate the frequencies from another activity in the form. 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button_add_plus.png]] button or the [[Image:Button_Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 021.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> Allows you to give a French name to the frequency. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> Allows you to give an English name to the frequency. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> If this checkbox is checked, the frequency (at <span style="color: rgb(255, 0, 0);">'''D'''</span>), the start date (at <span style="color: rgb(255, 0, 0);">'''E'''</span>), teh amount of the instalment (at<span style="color: rgb(255, 0, 0);">'''F'''</span>) and the objective (at <span style="color: rgb(255, 0, 0);">'''G'''</span>) will be entered by default when opening the form and will not be modifiable.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> Allows you to determine the frequency. In this example, a payment must be made once a month.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> Allows you to determine the date of the first payment.<br> 

'''NOTE:''' This field is available only if the checkbox at <span style="color: rgb(255, 0, 0);">'''C'''</span> is checked. Otherwise, the donor can start his or her commitment on the date of his or her choice or will have to choose dates suggested at <span style="color: rgb(255, 0, 0);">'''I'''</span>. 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> Allows you to specify the amount of the instalments. <br> 

'''NOTE:''' This field is available only if the checkbox at <span style="color: rgb(255, 0, 0);">'''C'''</span> is checked. Otherwise, the donor can choose the amount that he or she wants. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> Allows you to specify the amount of the objective. 

'''NOTE:''' This field is available only if the checkbox at <span style="color: rgb(255, 0, 0);">'''C'''</span> is checked. Otherwise, the donor can choose the amount that he or she wants. 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> If this checkbox is checked, a calendar will be available on the form, next to the field at <span style="color: rgb(255, 0, 0);">'''E'''</span> to select the desired start date.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> Allows you to specify choices for the field at <span style="color: rgb(255, 0, 0);">'''E'''</span>. In this example, the donor will start his or her commitment only on the 1st day of the month and on the 15th day of the month.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> The [[Image:Button_add_plus.png]] button allows you to add a new choice of day at&nbsp;<span style="color: rgb(255, 0, 0);">'''I'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> The [[Image:Button_Edit.png]] button allows you to modify the choices of day at <span style="color: rgb(255, 0, 0);">'''I'''</span>. To do so, select the day to modify at <span style="color: rgb(255, 0, 0);">'''I'''</span>, then click on the [[Image:Button_Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> The [[Image:Button_Minus_remove_delete.png]] button allows you to delete the day choices at&nbsp;<span style="color: rgb(255, 0, 0);">'''I'''</span>. To do so, select the day to delete at <span style="color: rgb(255, 0, 0);">'''I'''</span>, then click on the [[Image:Button_Minus_remove_delete.png]] button.<br> 

|-
| colspan="2" | 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> The "Note" tab allows you to add a note below the frequency when it is chosen in the form.&nbsp; To view an example of note below the frequency, see '''point '''<span style="color: rgb(255, 0, 0);">'''G'''</span> of the "Web Form Example 1" section.

'''NOTE:''' To learn how to configure the "Add note to the form" window, see this section.<br> 

|}

<br>

=== "Lists" Tab<br>  ===

This tab allows you to configure the lists of predefined choices of the form. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 022.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The "Country and provinces" tab allows you to modify the country and province selections that are available when a donor makes a donation. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The "Titles" tab allows you to modify the title options that will be available when a donor completes the form. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The "Road type" tab allows you to modify the road type options (e.g. street, avenue, place, etc.) that will be available when a donor completes the form. 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The "Point of call" tab allows you to modify the point of call options (e.g. appartment, room, suite, etc.) that will be available when a donor completes the form.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This is the list of countries the donor can choose from when he or she completes the form.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> The [[Image:Button_add_plus.png]] button allows you to a coubtry to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span>.&nbsp; 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The [[Image:Round_arrows_button.png]] button allows you to add to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span> all the existing conutries in '''''ProDon'''''. 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> The [[Image:Button_Edit.png]] button allows you to modify a country of the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span>. To do so, select the country to modify, then click on the [[Image:Button_Edit.png]] button.&nbsp; 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> The [[Image:Bouton_dupliquer.png]] button allows you to duplicate countries from another form to add them at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span>. 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> The [[Image:Button_Minus_remove_delete.png]] button allows you to remove a country from the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span>. To do so, select the country to remove , then click on the [[Image:Button_Minus_remove_delete.png]] button. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K:'''</span> The [[Image:Bouton efface.png]] button allows you to delete all the countries in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span>. 

| 
<span style="color: rgb(255, 0, 0);">'''L:'''</span> This is the list of provinces the donor will be able to choose from when he or she completes the form.&nbsp; 

'''NOTE:''' Even if the form is in English only, the French names of the provinces are added automatically. However, when an Internet user completes the English form online, only the provinces checked as "English" will be available. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M:'''</span> The [[Image:More_less_button.png]] button allows you to display or not theprovince on the form. 

| 
<span style="color: rgb(255, 0, 0);">'''N:'''</span> The [[Image:Circle_checkmark_button.png]] button allows you to modify the default province specified in the list at&nbsp;<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">L</span></span>.<br> 

|}

<br> 

==== Adding a Country  ====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button add plus.png]] button or double-clicking on a country in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''E'''</span> of this window, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 023.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> Select the country to add to the list at <span style="color: rgb(255, 0, 0);">'''E'''</span> of this window.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This option is only available if no instant payment method is used in the form or if it is a client form. If an instant payment method is used, the country must inevitably specified.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> Allows you to indicate that the country at <span style="color: rgb(255, 0, 0);">'''A'''</span> will be the default country to appear on the Web form.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> Allows you to indicate the English and French labels for the countries.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Edit_labels_button.png]] button allows you to configure the country labels at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. For more information about labels, see the "Label Configuration" document. 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> Allows you to display or not the "Province" field on the Web form.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> Allows you to display the address in a single box or in separate boxes, for instance, a box for the street number, another for the street name, etc. 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> Allows you to display or not the "Postal code" field on the Web form.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> Allows you to display or not the "Cedex" field on the Web form (this option is mainly used in Europe).<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> These options are automatically entered by selecting a country at <span style="color: rgb(255, 0, 0);">'''A'''</span>. These are the country setups.<br> 

|}

<br>

=== "Payment" Tab<br>  ===

This tab allows you to choose the payment methods donors may use. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 024.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are the payment methods available to donors to make a donation.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button add plus.png]] button allows you to add new payment methods to the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

'''NOTE:''' To be able to add a payment method here, the payment method must have previously been created in the "Payment method management".<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button Edit.png]] button allows you to modify a payment method in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the payment method to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button Minus remove delete.png]] button allows you to delete a payment method in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the payment method to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button Minus remove delete.png]] button.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Bouton dupliquer.png]] button allows you to duplicate all the payment methods from another Web form to add them at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. 

| <br>
|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button add plus.png]] button or the [[Image:Button Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 025.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The drop-down list allows you to choose a payment method donors can use to make a donation. If the desired payment method does not exist in the options, it is possible to create it in the "Payment method management".<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to enter a label for the French name of the payment method.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This field allows you to enter a label for the English name of the payment method.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> This field allows you to enter a French authorisation message. To view an example of authorisation message, see '''point '''<span style="color: rgb(255, 0, 0);">'''G'''</span> of the "Web Form Example 2" section.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to enter an English authorisation message.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> These checkboxes allow you to decide whether it is a payment method for a regular transaction, for a commitment transaction or for both types of transactions.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> The "Note" tab allows you to insert a note below the payment in the form. To learn how to configure the "Add note to form" window, see this section. To view an example of note below the payment, see '''point '''<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">C</span></span> of the "Web Form Example 3" section.<br> 

| 
'''NOTE:''' Use a "Pending" payment method, so that clients can pay with a cheque. During the import, the payment will go into the "To receive" tab of the "Transaction management" and can be cashed upon receipt of the cheque. Also add a note at <span style="color: rgb(255, 0, 0);">'''G'''</span>, requesting to label the cheque with the address of the foundation. For more details concerning "Pending" payment methods, see the "Payment Method Management" document.<br> 

|}

<br>

=== "Customizations" Tab<br>  ===

This tab allows you to create the characteristics that will be added to the donors' files in '''''ProDon''''' during the import. 

To learn how to configure the customizations of a Web form, see this document. 

<br>

=== "Notes" Tab<br>  ===

This tab allows you to insert notes into the form. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 026.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> These are all the notes that have been added to the form.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The [[Image:Button_add_plus.png]] button allows you to add a new note to the form.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The [[Image:Button_Edit.png]] button allows you to modify a note in the list at <span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button_Edit.png]] button.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Button_Minus_remove_delete.png]] button allows you to delete a note in the list at&nbsp;<span style="color: rgb(255, 0, 0);">'''A'''</span>. To do so, select the note to modify at <span style="color: rgb(255, 0, 0);">'''A'''</span>, then click on the [[Image:Button_Minus_remove_delete.png]] button. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The [[Image:Bouton efface.png]] allows you to delete all the notes of the form.<br> 

| 
'''NOTE:''' The notes that have been created from different tabs of the Web form management appear here too. 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
After clicking on the [[Image:Button_add_plus.png]] button or the [[Image:Button_Edit.png]] button, this window opens. 

|-
| colspan="2" | [[Image:Creating a Web Form 027.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> This field allows you to write the French text in the note. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> This field allows you to write the English text in the note. 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> This menu appears by right-clicking in a field at <span style="color: rgb(255, 0, 0);">'''A'''</span> or at <span style="color: rgb(255, 0, 0);">'''B'''</span>. It allows you to insert images or hyperlinks into the note.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The [[Image:Colour_button.png]] button allows you to modify the font colour of the note. The [[Image:Font_button.png]] button allows you to modify the font of the note.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> The "Position" field allows you to decide in which section of the form the note will be inserted. The header and the footer are available, as well as a few sections of the form.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> This field depends on the choice made at <span style="color: rgb(255, 0, 0);">'''E'''</span>. In this example, the note will be inserted below the question "Would you like to rent a golf cart?". 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> This field allows you to choose the alignment of the note. 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> This field allows you to decide whether the note should appear only on the Web form, or only on the summary or on both. 

|}

<br>

=== "Email" Tab<br>  ===

This tab allows you to write the emails that will automatically be sent to donors once their donations will be made. 

It is possible to write French and English emails for single donation transactions and for commitment transactions. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 028.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A:'''</span> The "English" tab allows you to write English emails for transactions and commitments.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B:'''</span> The "French" tab allows you to write French emails for transactions and commitments. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C:'''</span> The "Transaction" tab allows you to write the email that will be sent to donors who have made a regular transaction.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D:'''</span> The "Commitment" tab allows you to write the email that will be sent to donors who have made a commitment transaction.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E:'''</span> This field allows you to enter the subject of the email.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F:'''</span> This field allows you to enter the address to which donors can reply.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G:'''</span> This field allows you to specify the name of the personne or the company to whom the email can be returned.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H:'''</span> This field allows you to enter the address that will receive all the thank-you emails in blind courtesy copies. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I:'''</span> This is the thank-you email for a regular transaction. 

| 
<span style="color: rgb(255, 0, 0);">'''J:'''</span> This menu appears by right-clicking in the field at <span style="color: rgb(255, 0, 0);">'''I'''</span>. It allows you to insert fields, images and hyperlinks in the email.<br> 

|}

<br>

=== "Display" Tab<br>  ===

Cet onglet permet de personnaliser l'apparence du formulaire. 

==== "Options" Tab  ====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating_a_Web_Form_029.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Permet de choisir de mettre les coins supérieurs ronds ou carrés. Pour un exemple de coins carrés, voir la '''lettre '''<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">D</span></span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». Pour un exemple de coins ronds, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''I'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_1_de_formulaire_Web|Exemple 1 de formulaire Web]]&nbsp;».<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Permet de choisir d'afficher un ombrage sur l'arrière-plan. Pour un exemple d'arrière-plan avec un ombrage, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''B'''</span> de la section «&nbsp;[[ProDon:Configuration de la page d'accueil et du site Web#Exemple_de_page_d.27accueil|Exemple de page d'accueil]]&nbsp;» du document «&nbsp;[[ProDon:Configuration de la page d'accueil et du site Web|Configuration de la page d'accueil et du site Web]]&nbsp;». 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Permet d'afficher les informations des donateurs sur une ou plusieurs colonnes. Pour un exemple d'informations affichées sur plusieurs colonnes, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''J'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_1_de_formulaire_Web|Exemple 1 de formulaire Web]]&nbsp;». Pour un exemple d'informations affichées sur une colonne, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''J'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_2_de_formulaire_Web|Exemple 2 de formulaire Web]]&nbsp;». 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Permet de choisir comment afficher le logo et le titre dans le haut du formulaire.<br> 

'''NOTE&nbsp;:''' Il est également possible d'insérer un bandeau dans l'en-tête du formulaire Web ou de la page d'accueil plutôt que d'insérer un titre et un logo. Pour ce faire, sélectionner l'option «&nbsp;Afficher seulement le logo suivi d'un espace&nbsp;» ou «&nbsp;Afficher seulement le logo sans espace&nbsp;», puis choisir l'image du bandeau en <span style="color: rgb(255, 0, 0);">'''D'''</span>. Pour un exemple de bandeau, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''M'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Permet d'insérer le logo français qui se trouvera dans l'en-tête du formulaire. 

Le bouton [[Image:Bouton afficher le logo.png]] permet de visualiser le logo qui se trouve dans le haut du formulaire français. 

Le bouton [[Image:Bouton autre logo.png]] permet de modifier le logo qui se trouve dans le haut du formulaire français.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Permet d'insérer le logo anglais qui se trouvera dans l'en-tête du formulaire.<br> 

Le bouton [[Image:Bouton afficher le logo.png]] permet de visualiser le logo qui se trouve dans le haut du formulaire anglais.<br> 

Le bouton [[Image:Bouton autre logo.png]] permet de modifier le logo qui se trouve dans le haut du formulaire anglais.<br> 

|-
| colspan="2" | 
'''NOTE&nbsp;:''' Un bandeau doit être enregistré avec 820 pixels de large avant d'être inséré pour qu'il ait la même largeur que le formulaire Web ou que la page d'accueil. Pour un logo, la dimension n'a pas d'importance à l'enregistrement, puisqu'elle peut être ajustée en <span style="color: rgb(255, 0, 0);">'''D'''</span> et en <span style="color: rgb(255, 0, 0);">'''E'''</span>. La hauteur recommandée est 68 pixels.<br> 

|}

<br> 

==== "Overview" Tab  ====

===== "General" Tab  =====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating a Web Form 030.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la marge du formulaire. Pour un exemple de marge, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''A'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;».<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de l'arrière-plan du formulaire. Pour un exemple d'arrière-plan, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''B'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;».<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur du contour de la boîte active. Pour un exemple de contour de boîte active, voir la '''lettre '''<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">H</span></span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_2_de_formulaire_Web|Exemple 2 de formulaire Web]]&nbsp;».<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur du contour des boîtes inactives. Pour un exemple de contour de boîte inactive, voir la '''lettre '''<span style="color: rgb(255, 0, 0);"><span style="font-weight: bold;">I</span></span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_2_de_formulaire_Web|Exemple 2 de formulaire Web]]&nbsp;».<br> 

|}

<br>

===== "Label" Tab  =====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:ProDon Création formulaire Web 031.png]][[Image:Creating_a_Web_Form_031.png]]<br>
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la police du titre du formulaire. Le bouton [[Image:Bouton modifier police petit.png]] permet de modifier la police du titre. Pour un exemple de titre de formulaire, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''K'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_1_de_formulaire_Web|Exemple 1 de formulaire Web]]&nbsp;». 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la police des titres de sections. Le bouton [[Image:Bouton modifier police petit.png]] permet de modifier la police des titres de sections. Pour un exemple de titre de section, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''L'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_1_de_formulaire_Web|Exemple 1 de formulaire Web]]&nbsp;».<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la police des libellés des champs standards. Le bouton [[Image:Bouton modifier police petit.png]] permet de modifier la police des libellés des champs standards. Pour un exemple de libellé de champ standard, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''K'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_2_de_formulaire_Web|Exemple 2 de formulaire Web]]&nbsp;».<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la police des libellés des champs obligatoires. Le bouton [[Image:Bouton modifier police petit.png]] permet de modifier la police des libellés des champs obligatoires. Pour un exemple de libellé de champ obligatoire, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''L'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_2_de_formulaire_Web|Exemple 2 de formulaire Web]]&nbsp;».<br> 

|}

<br> 

===== "Border" Tab  =====

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating_a_Web_Form_032.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section type de donateur. Pour un exemple de la bordure «&nbsp;Type de donateur&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''F'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section donateur. Pour un exemple de la bordure «&nbsp;Section donateur&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''G'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section transaction. Pour un exemple de la bordure «&nbsp;Section transaction&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''H'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section autorisation. Pour un exemple de la bordure «&nbsp;Autorisation&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''I'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section type de transaction. Pour un exemple de la bordure «&nbsp;Type de transaction&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''J'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure des tableaux de transaction. Pour un exemple de la bordure «&nbsp;Tableau de transaction&nbsp;», voir la '''lettre&nbsp;'''<span style="color: rgb(255, 0, 0);">'''K'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''G&nbsp;:'''</span> Le bouton [[Image:Bouton changer couleur.png]] permet de modifier la couleur de la bordure de la section paiement. Pour un exemple de la bordure «&nbsp;Section paiement&nbsp;», voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''L'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

| 
<br> 

|}

<br>

=== "Distribution list" Tab  ===

Cet onglet permet d'ajouter des cases à cocher au formulaire pour que les donateurs puissent s'inscrire à différentes listes de distribution. 

Si un donateur coche une case d'inscription à une liste de distribution dans le formulaire Web, il sera automatiquement inscrit à la liste de distribution dans '''''ProDon''''' lors de l'[[ProDon:Importation des dons|importation]].<br> 

NOTE&nbsp;: Cet onglet est visible seulement si le [[ProDon:Préparation du document maître|module PubliCourriel]] est activé dans '''''ProDon'''''.<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating_a_Web_Form_033.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Il s'agit des listes de distribution auxquelles les donateurs pourront s'inscrire en complétant le formulaire. <br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Le bouton&nbsp;[[Image:Bouton Ajouter.png]] permet d'ajouter une liste de distribution en <span style="color: rgb(255, 0, 0);">'''A'''</span>. 

'''NOTE&nbsp;:''' Pour ajouter une liste de distribution, il faut qu'elle soit préalablement crée dans la «&nbsp;Gestion des listes de distribution&nbsp;». 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Le bouton [[Image:Bouton Modifier.png]] permet de modifier une liste de distribution en <span style="color: rgb(255, 0, 0);">'''A'''</span>. Pour ce faire, sélectionner la liste de distribution à modifier, puis cliquer sur le bouton [[Image:Bouton Modifier.png]].<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Le bouton [[Image:Petit Bouton Dupliquer.png]] permet de dupliquer les listes de distributions d'un autre formulaire.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Le bouton [[Image:Bouton Retirer.png]] permet de supprimer une liste de distribution en <span style="color: rgb(255, 0, 0);">'''A'''</span>. Pour ce faire, sélectionner la liste de distribution à supprimer, puis cliquer sur le bouton [[Image:Bouton Modifier.png]]. 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Le bouton [[Image:Bouton efface.png]] permet de supprimer toutes les listes de distribution en <span style="color: rgb(255, 0, 0);">'''A'''</span>. 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
Après avoir cliqué sur le bouton [[Image:Bouton Ajouter.png]] ou sur le bouton [[Image:Bouton Modifier.png]], la fenêtre suivante s'ouvre. 

|-
| colspan="2" | [[Image:Creating_a_Web_Form_034.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Choisir une liste de distribution parmi celles disponibles dans '''''ProDon'''''. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Inscrire le libellé qui apparaîtra sur le formulaire. Pour un exemple de libellé d'inscription à une liste de distribution, voir la '''lettre '''<span style="color: rgb(255, 0, 0);">'''E'''</span> de la section «&nbsp;[[ProDon:Création d'un formulaire Web#Exemple_3_de_formulaire_Web|Exemple 3 de formulaire Web]]&nbsp;». 

|}

<br>

=== "Import constants" Tab  ===

Cet onglet permet d'ajouter des caractéristiques ou des champs personnalisés aux fiches des donateurs lors de l'importation. 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | [[Image:Creating_a_Web_Form_035.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Il s'agit de la liste des caractéristiques qui seront ajoutées à la fiche des donateurs qui rempliront le formulaire. Dans cet exemple, la profession «&nbsp;Comptable&nbsp;» sera spécifiée dans la fiche de chaque donateur qui remplira le formulaire. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Le bouton [[Image:Bouton Ajouter.png]] permet d'ajouter une nouvelle caractéristique à la liste en <span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Le bouton [[Image:Bouton Modifier.png]] permet de modifier une caractéristique de la liste en <span style="color: rgb(255, 0, 0);">'''A'''</span>. Pour ce faire, sélectionner la caractéristique à modifier, puis cliquer sur le bouton [[Image:Bouton Modifier.png]]. 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Le bouton [[Image:Bouton Retirer.png]] permet de supprimer une caractéristique de la liste en <span style="color: rgb(255, 0, 0);">'''A'''</span>. Pour ce faire, sélectionner la caractéristique à supprimer, puis cliquer sur le bouton [[Image:Bouton Retirer.png]]. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Le bouton [[Image:Petit Bouton Dupliquer.png]] permet de dupliquer les caractéristiques d'un autre formulaire pour les ajouter à la liste en <span style="color: rgb(255, 0, 0);">'''A'''</span>.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Le bouton [[Image:Bouton efface.png]] permet de supprimer toutes les caractéristiques de la liste en <span style="color: rgb(255, 0, 0);">'''A'''</span>. 

|}

<br> 

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| colspan="2" | 
Après avoir cliqué sur le bouton [[Image:Bouton Ajouter.png]] ou sur le bouton [[Image:Bouton Modifier.png]], la fenêtre suivante s'ouvre. 

|-
| colspan="2" | [[Image:Creating_a_Web_Form_036.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Choisir à l'aide de la liste déroulante la caractéristique qui doit être ajoutée à la fiche des donateurs. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Inscrire la valeur qui sera inscrite dans la fiche de chaque donateur. 

'''NOTE&nbsp;:''' Pour ajouter une caractéristique, il faut qu'elle soit préalablement crée dans la «&nbsp;[[ProDon:Gestion des caractéristiques|Gestion des caractéristiques]]&nbsp;». 

|}

<br>

== Web Form Examples  ==

=== Web Form Example 1  ===

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| width="50%" colspan="2" | [[Image:Web_Form_Example_001.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Lien de retour vers la page d'accueil. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Informations de paiement qui ne sont pas dans un tableau.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Champ «&nbsp;Autre montant&nbsp;».<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Formulaire avec montants suggérés.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Note sous l'activité qui n'est pas dans un tableau.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Engagement avec date de fin et objectif.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G&nbsp;:'''</span> Note sous la fréquence.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H&nbsp;:'''</span> Champ permettant de choisir la langue.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I&nbsp;:'''</span> Coin supérieur rond.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J&nbsp;:'''</span> Informations du donateurs sur plusieurs colonnes.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K&nbsp;:'''</span> Titre du formulaire. 

| 
<span style="color: rgb(255, 0, 0);">'''L&nbsp;:'''</span> Titre de section. 

|}

<br> 

=== Web Form Example 2  ===

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| width="50%" colspan="2" | [[Image:Web_Form_Example_002.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Temps de session Web restant. 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Informations de paiement dans un tableau.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Note sous l'activité dans un tableau.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Case permettant au donateur de choisir s'il désire recevoir ou non un reçu.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Libellé de l'OBNL.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Champ «&nbsp;Commentaire&nbsp;».<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G&nbsp;:'''</span> Message d'autorisation.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H&nbsp;:'''</span> Contour de la boîte active.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I&nbsp;:'''</span> Contour d'une boîte inactive.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J&nbsp;:'''</span> Informations du donateur sur une seule colonne.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K&nbsp;:'''</span> Champ standard.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''L&nbsp;:'''</span> Champ obligatoire.<br> 

|}

<br> 

=== Web Form Example 3  ===

{| width="200" cellspacing="1" cellpadding="1" border="1" class="wikitable"
|-
| width="50%" colspan="2" | [[Image:Web_Form_Example_003.png]]
|-
| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''A&nbsp;:'''</span> Dans cet exemple, la marge est verte.<br> 

| width="50%" | 
<span style="color: rgb(255, 0, 0);">'''B&nbsp;:'''</span> Dans cet exemple, l'arrière-plan est blanc.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''C&nbsp;:'''</span> Note sous la section paiement.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''D&nbsp;:'''</span> Coins supérieurs carrés.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''E&nbsp;:'''</span> Case à cocher pour s'inscrire à une liste de distribution.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''F&nbsp;:'''</span> Bordures de la section type de donateur.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''G&nbsp;:'''</span> Bordures de la section donateur.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''H&nbsp;:'''</span> Bordures de la section transaction.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''I&nbsp;:'''</span> Bordures de la section autorisation.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''J&nbsp;:'''</span> Bordures de la section type de transaction. 

|-
| 
<span style="color: rgb(255, 0, 0);">'''K&nbsp;:'''</span> Bordures du tableau des transactions.<br> 

| 
<span style="color: rgb(255, 0, 0);">'''L&nbsp;:'''</span> Bordures de la section paiement.<br> 

|-
| 
<span style="color: rgb(255, 0, 0);">'''M&nbsp;:'''</span> Bandeau dans l'en-tête du formulaire. 

| <br>
|}

{{Footer_ProDon}}<br>