Optimization tips > Chef School Form

Chef School Form

Follow the steps in this Walk through to easily create a student inquiry form

Follow the steps in this Walk through to easily create a student inquiry form



 

1-

Create a new blank form
Create blank form

 

2- Give the form a name
Go to: Upper Menu > Form Settings > Basic > General
Give form a name

 

3-

Make the form width=1400pxGo to:Form Settings > Style >Size> Width=1400px

 

4-

Hide header and footer Go to: 
Style > Header > Turn off the “Show Header checkbox”
Style > Footer> Turn off the “Show Header checkbox”
Hide header


hide footer

 

5-

Drag a section element.
add section
Change it to a 1 col section.

 

6-

Add a background image to the section container
Go to:
Section > element settings > style > container > background > back image > choose: chef
Turn on “cover” checkbox.

back image


choose image

 

7-

Make the section container size height=850px
Go to: Section > Element Settings > Style > Container > Size > height= 850px

 

8-

Drag a Paragraph element into the section. Change the text to : WANT TO BECOME A CHEF?
Make the text big and white
drag paragraph


text in paragraph

 

9-

Make paragraph width =500px
Go to: paragraph > element settings > style > container > size > width=500px
paragraph width

 

10-

Add a margin to the paragraph.
Go to: paragraph > element settings > style > container > margin-top = 250px
add margin top to paragraph

 

11-

Drag a section element with 2 cols above the first section
drag section

 

12-

Change section container color to dark blue and height  of section tp 70px
Go to:
Section > Element Settings > style > container > background > back color: #rgba(21,21,38,1)
Section > Element Settings > style > container > size > height: 70px
change back color


height

 

13-

Change col1 width to 120px and drag an image element in it.
Go to: Section > Element Settings > style > col 1 > size > width= 120px
Drag image element in Col1
Go to: Image > style > container > padding >remove padding left and right (change to 0)
add image to col 1


remove padding

 

14-

Drag a label text element into col 2
Change the label text to “CHEF SCHOOL” and change style.
Go to:
Style > Element > Font > Color= white,
Style > Element > Font > font size=25px
Style > Element > Font > margin-top =20px

also remove padding on left from label container:
Go to: Style > container > Style > container > padding-left =0 ;
drag label


add margin top

 

15- Drag a third section under the other 2 sections. This Section should have 2 cols
drag section

16-

Drag a paragraph with text to the left col and enter the following text inside: Learn to become a chef with the best Chef School is a know culinary academy. We at the academy want to find your real talents and prepare you for being that best chef you can be. Our faculty includes professional instructors from all around the world, to introduce you to the best of all kitchens.
drag paragraph in to section

 

17- Configure the text in the paragraph editor: make font family= helvetica, Header font size= 18 pt bold and Body font =14pt
edit text

18-

Make the back color of col 2 in section dark blue
Go to: Section > Element Settings > Style > col 2 > Background > back color= rgba(21,21,38,1)

Drag a label for the header in col 2  and change its text to: Request Information
Change label style: Font size to 30px,  margin top=20px and color=white.
Go to:
Label > Element Settings > style > Element > Font > Size: 30px
Label > Element Settings > style > Element > Font > Color: white
Label > Element Settings > style > Element > Margin > top: 20px


drag label


 
19-

Drag another section inside col 2, under the label.
add section

 

20-

Drag a Drop Down Element in Col 1 and hide the element label.
Go to:
Dropdown > Form Settings > Style > label > turn on “hide label” checkbox
Dropdown > Form Settings > Style > Element > Size > 300x50 px

Change the text inside the dropdown:
Go to: Element settings > basic > add list header -turn on checkbox Add text “What are you interested in?” . Put this text also in dropdown label text

Turn off checkbox “add other”, and change Dropdown options to: culinary Arts and Pastry Arts. Remove third option.
drag listbox

 

21-

drag an email element in the right col (col 2)  and make its size300x50
Go to:
Email > Form Settings > Style > label > turn on “hide label” checkbox
Email > Form Settings > Style > Element > Size > width=300px and height=x50 px
drag email element

 

22-

Drag a Button element under this inner section. make its size  300x60,  
Change its button text to: Get the information
and also the following styles:
Go to:
Button > Form Settings > Style > Element > Size > width=300px and height=60 px
Button > Form Settings > Style > Element > Font > size=22px
Button > Form Settings > Style > Element > Font > color=black
Button > Form Settings > Style > Element > Background > color= rgba(255,192,98,1)
Button > Form Settings > Style > Element > Alignment > align=center
Button > Form Settings > Style > Container> Margin > top= 20px, bottom=40px




drag button



button size


align button



button color

 

23- Drag a Paragraph element under the section as form footer With text: Chef School , high culinary school | 33 aviv st. CA | 1-800-543-7676 | Fax: 987-658-7644 12pt,
Configure text inside editor: font color=black
Go to:
Paragraph > Element settings > Style > Container > Size > width:1400 height:60px
Paragraph > Element settings > Style > Container > Background > Back color= #rgba(167,201,150,1)

drag paragraph
configure text
paragraph size

change paragraph back color