Create Webforms

Create Webforms

Creating a web form involves three steps

  • Building the form - Drag and drop fields to build a form and format it easily with the WYSIWYG editor.
  • Specifying the form details - Add details such as form name, landing page URL (where the applicant needs to be redirected after the form is submitted) record assignment rule, notification details, etc.
  • Generating the code for the form - Embed the form using various code formats. Codes for some third-part sites (WordPress, Google Sites, Facebook, and Joomla) are readily available.

You can build web forms to generate records for the Temps and Jobs. While building a web form, the following elements are available in the form:

Option
Description
Add Fields 
Drag and drop the fields that are required in the form. By default, some of the fields are already added when you build a new form.
Set fields' font and form layout 
Use the WYSIWYG editor to change the font style and size, background color, alignment of the fields, etc. in the form.
Insert Captcha 
Captcha is used for security in feedback forms, website registration, comments from applicants, etc. Add captcha for the Zoho Workerly system to prevent unauthorized automated spamming programs from filling the web form. This option is available only in the Paid Editions.
Upload Files in the form 
With this option capture files through your web-to-temp/contact forms (or any other custom module), such as screenshots of an issue, quote requests, photo of individuals, etc. You can upload up to 3 files and the size of all the files put together should be within 20 MB. If the total file size exceeds the limit, the form will not be submitted and the record will not be added in Zoho Workerly. This option is available only in the Paid Editions.
Mark fields as mandatory 

Collect important information such as name, email address, mobile number, etc. from the applicants who fill up the web form by marking fields as mandatory.

Mark fields as hidden 
Add a hidden field and its value in the form. These hidden values are submitted along with the web form but are hidden to the applicants who fill the form.
Add help link for a field 
A field you provide may require data to be filled in a specific format. For example, the date format may need to be specified in DD-MM-YYYY. For such requirements, you can use the option to add a tip or hint to help the applicant who fills the form.
Change button name 
The name of the call to action button can be Save, Submit, or another other name. You can easily change the name as per your requirements.
Specify location URL of the form 
The Location URL is the web page URL where you plan to host the web form. Specifying the URL helps prevent spam and allows only forms submitted through the particular domain to be captured as valid information.
Specify landing page URL 
This is the URL of the web page to which the applicant needs to be redirected once the web form is submitted.
Select record assignment rule 
Records generated through the web forms can be automatically assigned to the users in Workerly with the help of Assignment Rules.
Specify notification options 
Set notifications that need to be sent to the record owners and also the applicants who submit the forms. Email templates or autoresponse rules can be used to send notification emails. When the Email has to be sent to users in the organization, it is sent as a notification from the email address support@zohoworkerly.com.
Embed form code 
Embed the web form's code in your web page. The code is available in three different formats - HTML source code, Embed code and iFrame code.

 Generate Web Forms

To generate web forms for Temps and Contacts

  1. Go to Settings > Setup > Web Forms Web Forms.
  2. In the Web Forms page, choose the Module from the drop-down list.
    The existing web forms for the selected module will be listed.
  3. Click + Create Web Form.
  4. In the web form builder, do the following:
    • Build a form 
      • Drag and drop the fields that you need in the web form.
      • Insert captcha.
      • Add the option to upload files.
      • Mark fields as mandatory.
      • Make fields hidden in the form.
      • Provide hint or help links for fields.
      • Set font and layout of the form.
      • Change button names.
    • Specify form details and other options 
      • Add form details such as form name, landing page URL, form location URL.
      • Set record assignment rule.
      • Set notification options
    • Copy web form code and embed options 
      • Get code to embed in your site and other third-party sites.
        The code is available in three different formats - HTML source code, Embed code and iFrame code.

 Step 1: Build a Form

Drag & drop fields in the WYSIWYG editor, which also provides various other options to build a form.

 Add Fields

Drag & drop the fields you need in the form and change the font style and size, background color, alignment of the fields, etc.

To add fields and set font and layout of the form

  1. Under the Fields List tab, click on a field and drag & drop it in the form builder.
  2. Make changes to the font, background color, field label alignment and form width.


Note

  • By default, some of the fields are already added in the form.
    • For Temps and Contacts - LastNameEmail, and Phone fields.
  • You cannot remove the following fields from the form, as they are mandatory for a record.
    • For Temps and Contacts - Last Name field.
  • To have custom fields, you need to first create them in a particular module. 
  • When you add the Account Namefield in the web form for Contacts and contact details are submitted, an account will automatically be created in Zoho Workerly. If an account with the same name already exists in your Workerly account, an account will not be created when the form details are submitted.
  • An Account will be created, even if certain mandatory field details are not provided. Later, when the account is edited, you need to provide the other mandatory details before saving the record.

 Upload Files

Capture files through your web-to-temp/contact forms, such as screenshots of an issue, quote requests, photo of individuals, etc. The size of the file should be within 20 MB. If the file size exceeds the limit, the form will not be submitted and the record will not be added in Zoho Workerly. This option is available only in the Paid Editions.

To add the option to upload files

  1. Click the Advanced Tools tab.
  2. Drag & drop the File Upload field.
     

 Insert Captcha

Add captcha to prevent unauthorized automated spamming programs from filling the web form. This option is available only in the Paid Editions.

To insert captcha

  1. Click the Advanced Tools tab.
  2. Drag & drop the Captcha field.

 

 Mark Fields as Mandatory

Collect important information such as name, email address, mobile number, etc. from the applicants who fill up the web form by marking fields as mandatory.

To mark fields as mandatory

  1. Move your mouse pointer to the field that you want to mark as mandatory.
  2. Click on the Settings icon.
  3. In the Field Properties pop-up, select the Mark as required field checkbox.
  4. Click Done.

 

 Mark Fields as Hidden

Add a hidden field and its value in the form. These hidden values are submitted along with the web form but are hidden to the applicants who fill the form. For example, if you have hosted the same form in various web pages, the hidden field will help you identify which record is generated form a web form hosted in a specific web page.

To make fields hidden in the form

  1. Move your mouse pointer to the field that you want to hide in the form.
  2. Click on the Settings icon.
  3. In the Field Properties pop-up, select the Mark as hidden field checkbox.
  4. Specify the value for the field and click Done.

 

A field you provide may require data to be filled in a specific format. For example, the date format may need to be specified in DD-MM-YYYY. For such requirements, you can use the option to add a tip or hint to help the applicant who fills the form.

To provide hint or help links for fields

  1. Move your mouse pointer to the field for which you want to provide hint or help link.
  2. Click on the Settings icon.
  3. In the Field Properties pop-up, select the Include help link checkbox.
  4. Choose one of the following:
  • Link & Text - Specify a text for the link and provide the link URL.
  • LinkOnly - Specify the help/hint text. For example, the date field can have - MM-DD-YYYY
     
  • Click Done.

 

 Change Button Name

By default, there are two call to action buttons - Submit and Reset. You can rename these buttons as per your requirements.

To change button names

  1. Move your mouse pointer to the field that you want to rename in the form.
  2. Click on the Settings icon.
  3. In the Field Properties pop-up, modify the field name.
    The name of the field will be changed only in the form.
  4. Click Done

 

 Remove Field from the Form

Easily remove unwanted fields from the web form and add them whenever required.

To remove a field from the form

  1. Move your mouse pointer to the field that you want to remove from the form.
  2. Click on the Delete icon.

 

 Preview the Web Form

Take a look at the web form before publishing it in your web site.

To preview the form

  1. In the form builder, click on the Preview link.
    A preview of the form will be available.

 

 Step 2: Specify Form Details

  1. Enter a Form Name (Example: Feedback, Contact Us, etc.).
  2. Specify a Landing page URL. The applicant who submits the form will be redirected to the URL specified here. It should start with "http:// or https://".
    The length of the Return URL should not exceed 255 characters. (Example: https://www.zylker.com/thank-you.html)
  3. Specify a Form Location URL. This should be the webpage where the web form will be hosted. It should start with "http:// or https://". (Example: https://www.zylker.com/contact-us.html)
    If you plan to host the web form in multiple websites or you are not sure where the web form will be hosted, enter * in this field. This prevents spam and allows only forms submitted through the particular domain to be captured as valid information.
  4. Choose one of the following options to AssignOwner to the records that are submitted via web form.
  • Choose a User - Select from the drop-down list. All the records generated through the form will be assigned to the selected user.
  • Create or Choose [Module] Assignment rule to assign ownership - Select an existing assignment rule or create a new one. Based on the rule, records will be assigned to the users. With assignment rules you can implement the Round Robin method to assign records to the users. 
  • Enable Notify [Record] Owner, if required and select an email template that will be sent to the record owner. When the Email has to be sent to users in the organization, it is sent as a notification from the email address support@zohoworkerly.com.
  • Enable AcknowledgeApplicant if you want to send an email to the person who submitted the web form. After you select the mail template, you will be prompted to enter the From and Reply to fields.
    Here you can choose one of these option in the drop-down list:
    • your account email address
    • organization email address
    • email address of the record owner
    • other user's email address
  • Using Autoresponse Rule - Use one of the existing autoresponse rules . Based on the details gathered using the web form, autoresponse rules can be triggered to send specific emails.
    When details gathered through the web form does not satisfy the Auto Response Rule criteria, then the email template selected in the second option will be sent as an acknowledgment email.
  • Default response for all applicants- Choose an email template that will be used to send email to the temps generated via this web form.
  •  Step 3: Use Web Form Code to Embed

The code for the web form is available in 3 formats: Source Codecode to EmbediFrame code. The code is also readily available for some third-party sites - WordPress, Facebook, Google Sites and Joomla. Please note that the Script and iFrame code is available only in the Paid Editions.

  1. Select Source Code, Embed or the iFrame code from the list as required.
  2. Copy the code and paste it in the website where you want the web form.
  3. Click Done.


Note

  • In order to avoid spam, the generated Web Form (HTML file) must be published in an active web server (Apache, Microsoft, IIS, etc.).
  • The web form will not work if you submit the form values from your desktop.
  • When the HTML code is generated for the web form, certain entities are hidden by default. If you remove those hidden entities, the web form will not work. Here is the code snippet that should not be removed from your web form code:
    <input type="hidden" name="xnQsjsdp" value="" /> <input type="hidden" name="xmIwtLD" value="" /> <input type="hidden" name="actionType" value="" /

    • Related Articles

    • Autoresponse Rule for Webforms

      The Auto Response rule feature enables you to send automated emails when Associates for the custom modules are generated through web forms. When a temp is brought in through web forms, you may want to send appropriate emails to them with different ...
    • Webforms

      Web Forms simplify the method of capturing visitors or users information from your website into your ATS system. They are designed to automate the import of data from other websites into Zoho Recruit. Non-technical users find it easy to design and ...
    • Auto Response Rule for Webforms

      The Auto Response rule feature enables you to send automated emails when candidates and contacts for the custom modules are generated through web forms. When candidates are generated through web forms, you may want to send relevant emails to the ...
    • How can I associate records created via webforms to a layout?

      While creating the webform, you will have an option to choose the default layout to which records created via webforms should be assigned. All records created via webforms will then be assigned to the chosen layout here.
    • Webforms for Google Sites

      Web forms simplify the process of capturing visitors' or users' information from your website in your Recruit system. They are designed to automate importing data from your website into Zoho Recruit and to enable users to design and publish their own ...