Summary:  This training will guide you through the process needed to understand editing and creating forms (Contact Us, Taking Interest) in the Form Builder feature of WorldVu.

Log into WorldVu Dashboard

Go to CMS > Form Builder

Editing Forms in Form Builder

  • From the list of forms, click on the one you need to edit
  • Make modifications on the “Form Information” page
  • Change the “Title” if necessary

Note:  The “Content Before Form” and “Content After Form” listed on the “Form Information” page are not discussed in this training.  Upon placing your form within a CMS page you will have the option of design within the CMS page features.

  • Change “Success Message”–Provides a note to the customer to view when the form is submitted successfully
  • Change “Failure Message”–Provides a note to the customer to view when the form fails to submit successfully
  • Change “Submit Button Text”–This text is the button Title/Description
  • Change “Is Active”–This should be set to “Yes”
  • Click “Save and Continue Edit”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • The “Fields List” page identifies the fields currently assigned to the form and allows you to filter them as either “Enabled” or “Disabled”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • Click on “Form Creator” to make modifications to the form fields
  • Modify field information as needed or “Add New Field”
  • Click “Save and Continue Edit”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • Click on “Email Settings” to modify how the communication will be managed for information collected in the form and customer interactions
  • Modify “Email Settings” as needed

Note:  The emails that are used in these fields can be created by going to System Configuration > Store Email Addresses in the left hand menu.

  • Click “Save Form”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

Creating a form in Form Builder (Step 1)

  • Click on “Add New Form” on the “Form Builder” page
  • Fill in the information on the “Form Information” page
  • Click “Save and Continue Edit”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • Bypass “Field List” since there currently are no fields to view
  • Click on “Form Creator” and add fields as needed

Note:  Add all the fields you will need your customers to fill out in order to gather the wanted information on the form

  • Click “Save and Continue Edit”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • Click on “Email Settings”

Note:  The emails that are used in these fields can be created/set up by going to System Configuration > Store Email Addresses in the left hand menu.  Screen capture views of this process is found at the end of the “Editing Form Builder” forms section.

  • Click “Save Form” and go to (Step 2)

Creating a Form in Form Builder/Setting up your CMS Page (Step 2)

  • Go to CMS > Pages
  • Click on “Add New Page”
  • Create the “New Page”

Note:  The URL Key needs to be all lower case and no spaces

  • When finished, click “Save and Continue Edit”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • On the “Content” page, click  on the “Insert Widget” button and choose from the list “Form Builder Forms”
  • Under “Widget Options”, choose the new form you just created.
  • Click “Insert Widget”
  • Finish creating your new CMS page with your new form.  Add any “Design” elements and “Meta Data” and click “Save Page”

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

  • Your new CMS page is now available in your CMS page list.  You may “Preview” it

Note:  Upon completing the steps to create a form and a new CMS page that will include the new form, you are ready to use this CMS page within your Store.

[imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe][separator style_type=”single” top_margin=”50″ bottom_margin=”50″ sep_color=”” border_size=”” icon=”” icon_circle=”” icon_circle_color=”” width=”” alignment=”center” class=”” id=””][imageframe lightbox=”no” lightbox_image=”” style_type=”none” hover_type=”none” bordercolor=”” bordersize=”0px” borderradius=”0″ stylecolor=”” align=”none” link=”” linktarget=”_self” animation_type=”0″ animation_direction=”down” animation_speed=”0.1″ animation_offset=”” hide_on_mobile=”no” class=”” id=””] [/imageframe]

We hope this helps.  Check out our other training posts for additional assistance.