Form Creation
STEP 1 : Navigate to Extra Product Addon -> Add New Form to create a new form or Choose All Forms to modify the existing forms.
STEP 3 : These are Extra Product Addon options.

General Properties

These are general properties for all the fields in Extra Product Addons.
i) Click this icon to edit or modify fields.
ii)Click this icon to create a duplicate of fields.
iii)Click this icon to remove fields from the existing form.
We will see the features of each Fields one by one.

Field Properties

i) Text Field - enables you to collect the text data.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
    Type - select what type of text you need for this field like text, e-mail, telephone, color.
    Max Length - specifies the maximum number of characters allowed to enter in this field.
ii) Color Picker - enables you to provide color options.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
    Type - select what type of text you need for this field like text, e-mail, telephone, color.
    Max Length - specifies the maximum number of characters allowed to enter in this field.
iii) Email - enables you to collect mail-id.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
    Type - select what type of text you need for this field like text, e-mail, telephone, color.
    Max Length - specifies the maximum number of characters allowed to enter in this field.
iv) Number - enables you to collect numbers or count.
    Required - by enabling this checkbox makes the field mandatory.
    Label -provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
    Min - specifies the minimum limit allowed to enter in this field.
    Max - specifies the maximum limit allowed to enter in this field.
    Step - specifies value intervals between min & max.
v) Date Field - enables you to collect date data.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - sets the default format for this field.
vi) Text Area - enables you to collect a message or description.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
    Type - select what type of text you need for this field like text area, tinymce, quill.
    Max Length - specifies the maximum number of characters allowed to enter in this field.
    Rows - specifies number of rows the text allowed in this field.
vii) Select - enables you to select from the drop-down list.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Options -
      i) blue dot denotes which of these is selected by default.
      ii) first field provides label to the option.
      iii) second field provides value to the option.
      iv) click add option to add options.
      v) click X red icon at right corner to delete that option.
    Set Price(PRO FEATURE) -
      In Price - specifies the value based on the options selected & price rate of the product.
      In Percentage - specifies the value based on the options selected & price rate of product in percent.
viii) Checkbox - enables you to select multiple options.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Options -
      i) blue tick denotes which of these is selected by default.
      ii) first field provides label to the option.
      iii) second field provides value to the option.
      iv) click add option to add options.
      v) click X red icon at right corner to delete option.
    Set Price(PRO FEATURE) -
      In Price - specifies the value based on the options selected & price rate of the product.
      In Percentage - specifies the value based on the options selected & price rate of product in percent.
ix) Radio Group - enables you to select only one option from the provided options.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Name - provides a unique name for the field & no two fields have the same name.
    Options -
      i) blue dot denotes which of these is selected by default.
      ii) first field provides the label to the option.
      iii) second field provides value to the option.
      iv) click add option to add options.
      v) click X red icon at right corner to delete option.
    Set Price(PRO FEATURE) -
      In Price - specifies the value based on the options selected & price rate of the product.
      In Percentage - specifies the value based on the options selected & price rate of product in percent.
x) Hidden input - enables you to provide inputs which gets hidden from the site.
    Name - provides a unique name for the field & no two fields have the same name.
    Value - set default value for this field.
xi) Paragraph - enables you to provide quotes or messages on the website.
    Content - provides you to enter brief text based on your need.
    Type - specifies content text type - paragraph, block-quote, address, output.
    class - A comma-separated list of CSS classes will be added to the input element.
xii) Header - enables you to provide title or header.
    Label - provides title to the field.
    Type - specifies heading type whether h1, h2, h3, h4, h5 or h6.
    Class - A comma-separated list of CSS classes will be added to the input element.
xiii) File Upload(PRO FEATURE) - enables you to collect files of type specified by you in the settings.
    Required - by enabling this checkbox makes the field mandatory.
    Label - provides title to the field.
    Placeholder - this is a short hint (a sample value or a short description of the expected format) that describes the expected value of an input field. For example, for e-mail, provide a sample mail-id i.e.,[email protected] will be displayed as default format input. The short hint is displayed in the input field before the user enters a value.
    Class - A comma-separated list of CSS classes will be added to the input element.
    Type - select what type of file you need to upload for this field based on your settings.
NOTE :
    After creating form or forms of your choice. Click Publish to make use of the form in product page.
    If you have already created the form. Now, you need to modify and update in product page.After modifing the form, Click Update.
    To delete the created form, Click Move to Trash.
Last modified 17d ago