MS FrontPage 2:Developing a web site for the Sunny Morning Products

Yong ChoiCSU

Bakersfield

Creating a Search page using template

Delete the default comment purple color text at the top of the page,

including the horizontal line Type Search on the blank Line at the

top Apply Heading 3 Apply Home page background Copy and paste navigation bar Modify Search instruction if necessary

Creating a Feedback Page

Create a Feedback page using Wizard Save as Feedback (filename and page

title) Type text and adding radio buttons (see

handout) Suggestion

Group name: MessageType Value: Suggestion

Praise: Praise Problem: Problem

Creating a Feedback Page

Adding a drop-down menu to a form From the Form field properties

Name: Subject> Add button Choice: Web site Select the Specify Value, textbox: Website Initial state: selected

Choice: Company Select the Specify Value, textbox: Company Initial state: Not selected

Creating a Feedback Page

Choice: Products Select the Specify Value, textbox: Products Initial state: Not selected

Adding a scrolling text box to a form From the Form field properties

Name: Comments Width in characters: 50 Number of lines: 5

Creating a Feedback Page

Adding a one-line text box to a form From the Form field properties

Name: Username Width in characters: 35 Password field: No

Name: UserEmail Width in characters: 35 Password field: No

Creating a Feedback Page

Insert a one-line text box for the line about visiting

From the Form field properties Name: Visits Width in characters: 3 Password field: No

Creating a Feedback Page

Adding a a check box to a form Insert a check box before “Please”

Name: ContactMe Value: Yes Initial state: Not checked

Change the properties of the submit push button Name: Submit Value.label: Submit Form Button type: Submit

Creating a Feedback Page

Change the properties of the reset push button Name: Clear Value.label: Clear Form Button type: Reset

Review Form properties Including options

Sketch of the Products Frames Page

Frames

If you use frames in your web, Page view has two additional tabs: The No Frames tab displays the message that

will display in a Web browser if the browser does not support frames.

The Frames Page HTML tab shows the HTML for the frame page.

Creating a Products Page

Download and Import following pages for a frame page;

banner, basket, contents, drink, fruit, and Ordrinfo press and hold down Ctrl key to select all

Create a frame page Use the new page templates File name: Products Page title: Products

Creating a Products Page

Setting Initial Pages for Frames Page Banner.htm in the banner frame

Contain navigation bar Contents.htm in the contents frame

Contain purchase options Drink.htm in the main frame Try to resize each frame

Do want to resize each frame?

Creating a Products Page

Examine the target frame followings… Drink Gift Packs Fruit Gift Packs Gift Baskets Order Information

Creating a Products Page

Later! Create a Order From page Create a hyperlink from Order

Information page to order form. The Order Form must be open in New

Window. So, the target frame New Window

More about Frame..

Adding a new frame to an existing frames page Ctrl key (press and hold down), and then

drag the bottom frame border up about one inch. What happens?

Printing a frames page in browser mode Preview> Preview in Browser> Print> As

laid out on screen Compare HTML and Frames Page HTML.

Any differences?

Creating a Order Form Page

Similar to Feedback Page Save as ASP

Send order to Database Try Out!!

Assign names, values, and others based upon your intentions..

More about Frame..

Adding a new frame to an existing frames page Ctrl key (press and hold down), and then

drag the bottom frame border up about one inch. What happens?

Printing a frames page in browser mode Preview> Preview in Browser> Print> As

laid out on screen Compare HTML and Frames Page HTML.

Any differences?

Apply a theme

Open index.htm. Select Theme from the format menu.

Under Apply theme to, make sure All pages is selected.

In the list of installed themes, select Artsy.

Clear the check boxes for Active graphics and Background picture, then click OK to apply the theme.

To publish the Web Site Close all open pages in Page view. On the File menu, click Publish Web, or

click the Publish Web button on the toolbar.

In the Publish Web dialog box, enter the URL of your target Web server

You have created so called “disk-based web”, which means your web site does not work properly unless you publish thru the web server.

Try free web hosting service company from the Internet.

http://www.freewebsitehosting.com/