Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: gearsvideo uploaded, steps for form building from scratch

...

To create additional content areas, start by adding a “Grid Template” from the Elements menu.


BUILD FORMS FROM SCRATCH

Form Building is a multi-step process.  

...

  1. First, let's expand the 'Grid Templates' option by selecting it.
  2. Select From there, select the preferred column type, then drag it to the canvas, as shown below (three-column grid selected)

...

3. To populate the columns, let's choose from the 'Demographics' option.4.

    1. Select First Name and drag it to the left-most cell, followed by Last Name to the middle cell, next email to the last one.


4. The three-column grid will look as follows:

Image Modified

5. To add Captcha to the form

...

:

    1. Select 'Form' from the right-hand panel Image Modified
    2. Select Captcha and drag it over to the spot on the canvas.  In this case, we choose below the 3-column grid

Image Modified

6. To add a 'Submit' button

...

:

    1. Select it from the 'Form' option and
  1. drag
    1. ,
    2. Drag it to the spot you prefer on the canvas,
  2. eventually
    1. Eventually this position will impact how your final form is displayed)

7. Below is what the final form/pop-up will look like after the additions/modifications described in steps 1-

...

7.

Image Modified



ELEMENTS MENU


To add elements, like titles, text blocks, images/logos, products/packages, or questions/fields use the Elements menu (image).

...

  1. URL links can be added to components that use the 'Link' feature. 
    1. To add or modify a URL link, use the 'Components Settings' option on the toolbar, denoted by a 'gear' icon on the above toolbar.
    2. You can add URL to the 'Href' field, which will then link the selected component to the URL specified in this field.
    3. Please click here to view a video showing how to create a URL link.
  2. Components can be modified in terms of typography(text-related features such as fonts, alignment), dimensions (height, width, padding, etc.) or background decorations (color, radius, etc.). 
    1. To do so, select the component, then click on the 'paintbrush' icon on the above toolbar, denoted by.  In the screen shot below, the image on the right is selected and edittededited.

b. Please click here to view a video showing how a button's background color was changed.

...