In the previous chapters, you learned how to use FrontPage's templates to develop Web sites quickly and easily. What if you want to create your own Web site, using many of the pages that the templates and wizards provide? In FrontPage, it is easy to add the contents of one of the Web templates to another. It is just a matter of enabling a checkbox.
In this chapter, you create a Web site that has the following features:
Sounds like a tall order, right? Not with FrontPage. It makes combining Web templates and pages easy.
In Chapter 4 "If You Mean Business," you learned how to develop a site using the Corporate Presence wizard. This project does not use everything that the Corporate Presence Web has to offer, but some pages fit the bill well. Use the Corporate Presence wizard to generate some of the pages in the Web. The steps are
At this point, the introductory screen of the Corporate Presence wizard appears. Click Next to choose the pages that you want to include.
The second screen in the wizard asks what types of pages you want to include in your Web site. The only pages required are the home page-which is automatically included-and the products page. Therefore, choose the Products and Services option, and click Next to continue.
In the third screen of the Corporate Presence wizard, you choose the options that you want to include in your home page. This time, don't include a mission statement, but choose these options:
Figure 6.1 shows an example of the home page. After you make your selections, click Next to continue.
Figure 6.1 : The home page is the entry page in your Web site.
In the fourth screen of the Corporate Presence wizard, you choose how many products and services pages to include in the site. For the time being, create one product page. After you customize the initial page, you can save it as a template and use it for additional pages. Service pages are not necessary for this Web site. Enter 1 for products and 0 for services.
When you specify only products pages, the FrontPage Explorer creates a products page, as in Figure 6.2. After you make your selections, click Next to continue.
Figure 6.2 : The products page provides links to all the product data sheets in your site.
The fifth screen in the wizard asks what type of information you want to include in your product data sheets, shown in Figure 6.3. The options for the service description pages are grayed out because you elected not to create them. For the products page, choose the following options:
Figure 6.3 : The product data sheet provides information about the products that you offer.
After you make your selections, click Next to continue.
In the sixth screen of the wizard, you choose what you want in the header and the footer of the pages. For the header information, select
At the bottom of the form, you want to include a copyright notice and the date when the page was most recently modified. You also want to include your e-mail address. For the footer information, select
After you make your selections, click Next to continue.
The seventh screen of the wizard asks what type of graphic style you want for your pages. Select the style that you want, and click Next to continue.
In the eighth screen of the wizard, you choose the color scheme for your pages. All the pages in the Web use this color scheme. The steps are
TIP |
You can change color selections later. Edit the page properties of the Web Colors page in the Corporate Presence Web by using the File | Page Properties command. The other pages in your Web update with the new choices automatically. |
The eighth screen in the wizard asks whether you want to include the Under Construction icon in your pages. This is your choice. Click Next to continue.
In the ninth screen in the wizard, you enter the company information and a name for the Web. Enter the following information:
After you enter your information, click Next to continue.
In the tenth screen, you enter company contact information. Enter the following information:
After you enter your information, click Next to continue.
The final screen in the wizard asks whether you want to view the To Do list after the Web is created. You do not want to view it at this time because you have more pages to add, so uncheck the option. To create the Web site, click the Finish button. Your Web site appears in the Explorer window. Figure 6.4 shows an expanded view of the links in Summary View.
Figure 6.4 : Your Corporate Presence pages appear in the Explorer window.
Based on the options that you chose, your Web site has seven pages.
They are described in Table 6.1.
Filename (URL) | Description |
index.htm | ACME Corp home page |
prod01.htm | ACME Corp product 1 data sheet |
products.htm | ACME Corp products page |
_private/inforeq.htm | Results from Form 1 of the prod01.htm page |
_private/navbar.htm | Included navigation links |
_private/logo.htm | Included logo page |
_private/style.htm | Web colors |
Now that you have completed the Corporate Presence portion of your web, you can create the public discusqèn group.
You want to add a Customer Support discussion area to your Web site. You could use the Customer Support Web template, which is discussed in Chapter 3 "Can We Talk?" However, you can also use the Discussion Web wizard. It enables you to customize your Discussion web.
To add the Discussion Web wizard pages to your current Web:
You want a full-featured discussion web in your site. It should have a table of contents for the articles, a search form, threaded replies, and a confirmation page. Constructing everything is an easy task. In the second screen of the Discussion Web wizard, select all the options. Click Next to continue.
In the third screen in the Discussion Web wizard, you assign a descriptive title for the discussion. This title appears in the main pages of your discussion web. Enter the following name:
ACME Corp Customer Support Discussion
Based on this name, the wizard informs you that the articles in this discussion will be stored in the _accsd directory or folder. In addition, the files generated by this discussion will be prefixed with accs. Click Next to continue.
In the fourth screen in the wizard, you choose a set of input fields for the submission form. Choose the Subject, Category, Comments option, and click Next to continue.
In the fifth screen in the wizard, you choose whether the discussion takes place on a protected web. This part of the web is public, so select the Anyone Can Post Articles option. Click Next to continue.
In the sixth screen in the wizard, you choose how the table of contents sorts the list of posted articles. Select the default option, which is to sort from oldest to newest. Click Next to continue.
The seventh screen in the wizard asks whether you want the Table of Contents page for the discussion to be the home page in the web. The web already has a home page, so you should choose no. Click Next to continue.
In the eighth screen in the wizard, you choose the information that the search form reports for matching documents. Select the Subject, Size, Date option. Click Next to continue.
In the ninth screen in the wizard, you choose colors for the pages. For the sake of consistency, you should select the same colors as you did for the corporate presence web. The steps are
TIP |
You can change the page properties of the Discussion pages to use the Corporate Presence Web colors page as an alternative. |
In the tenth screen in the wizard, you choose how the articles should be displayed in the discussion. Select the Dual Interface option. This means that the articles are displayed in frames if the browser supports them or in regular pages if the browser does not. Click Next to continue.
The final screen in the wizard notifies you that you have answered all the questions. It tells you that there are two main screens in the discussion:
NOTE |
You need to provide a link to the frame set for the ACME Corp Customer Support discussion. In the figures in this chapter, a link is added to the included navigation links page. |
Click Finish to create the web. You are asked whether you want to replace the existing grytxtr5.jpg file. Answer no. The wizard then uploads files based on the template in the Program Files\Microsoft Frontpage\Webs\Vtidisc.wiz directory on your hard drive.
The Discussion Web appears in the Outline View of the FrontPage Explorer. Figure 6.6 shows the Web added to the pages that you created with the Corporate Presence wizard. Fourteen additional pages are added to your Web site. They are described in Table 6.2.
Figure 6.6 : The new pages appear in the FrontPage Explorer.
Filename (URL) | Page Title |
accsfrm.htm | Frameset for ACME Corp Customer Support Discussion |
accstoc.htm | ACME Corp Customer Support Discussion TOC |
accstocf.htm | ACME Corp Customer Support Discussion TOC (Framed) |
accswelc.htm | ACME Corp Customer Support Discussion Welcome |
accscfrm.htm | ACME Corp Customer Support Discussion Confirmation |
accssrch.htm | ACME Corp Customer Support Discussion Search Form |
accspost.htm | ACME Corp Customer Support Discussion Submission Form |
accsaftr.htm | Included Article Footer for ACME Corp Customer Support Discussion |
accsahdr.htm | Included Article Header for ACME Corp Customer Support Discussion |
accsfoot.htm | Included Footer for ACME Corp Customer Support Discussion |
accshead.htm | Included Header for ACME Corp Customer Support Discussion |
accsstyl.htm | ACME Corp Customer Support Discussion Web Colors |
_accsd/toc.htm | _accsd Discussion |
_accsd/tocproto.htm | _accsd/tocproto.htm |
TIP |
To view the files in the hidden directories in your web, use the Tools | Web Settings command. Click the Advanced tab in the Web Settings dialog box. Under Options, check Show documents in hidden directories. |
Now take a closer look at the pages that the Discussion Web wizard generates. The home page of the discussion is the frame set for the Customer Support discussion. If your browser supports frames, Figure 6.7 shows how the frame set looks. The contents are displayed in a frame at the top of the page, and the Welcome section with the discussion articles is displayed at the bottom of the page.
Figure 6.7 : The first page of the Customer Support Discussion displayed in frames.
If your browser does not support frames, the table of contents shown in Figure 6.8 appears. This is the page titled Customer Support Discussion TOC.
The Customer Support Discussion TOC (framed) page is shown in Figure 6.9. It is included in the frame set shown in Figure 6.7.
Figure 6.9 : This version of the Table Of Contents page appears within the frame set.
The Customer Support Discussion Welcome page, shown in Figure 6.10, is also included in the frame set. If your browser does not support frames, however, it appears as shown in Figure 6.10. The Welcome page tells visitors to your site how to use the discussion and submit articles.
Figure 6.10: The Welcome page provides instructions on how to use the discussion.
When a visitor submits an article to the discussion, he receives a confirmation message. The Customer Support Discussion Confirmation page, shown in Figure 6.11, includes the title of the article submitted. It instructs the visitor to return to the table of contents to see the article in the list.
Figure 6.11: When site visitors submit articles, the Confirmation page provides an acknowledgment.
Site visitors can also search through the articles in the discussion for a word or phrase by using the Customer Support Discussion search form. This form, shown in Figure 6.12, includes a basic search engine. You might want to add examples of how to search for text.
Figure 6.12: Site visitors can search for a word or phrase within the articles with the Search page.
A site visitor submits an article to the discussion with the Customer Support Discussion Submission page, shown in Figure 6.13. He enters the subject of the message, selects a category from a drop-down list box, and enters the body of the article in the Comments field. When the visitor clicks the Post Article button, the article is submitted to the discussion.
Figure 6.13: Site visitors use the Discussion submission page to post articles to the discussion.
The included article header for the Customer Support discussion, shown in Figure 6.14, contains links to the home page, the discussion's Table of Contents page, the discussion search form, and the discussion submission form. In addition, visitors can post replies to messages, navigate to the previous and next messages in the thread, and go to the first article in the discussion. This header appears on the articles in the discussion. The included article footer for the Customer Support Discussion contains no information. You can add content to it if you want.
Figure 6.14: This header appears on all discussion articles. The footer is blank.
Figure 6.15 shows the included header and the included footer for the Customer Support discussion. They both appear on the main pages in the discussion. The included header contains links to the home page, the discussion's Table of Contents page, the discussion search form, and the discussion submission form. The included footer contains the date when the page was last updated.
Figure 6.15: This header and footer appear on all the main pages in the discussion.
Figure 6.16 shows the table of contents for the discussion. Initially, this page contains a heading that displays the directory name for the discussion. You may want to edit this to be more descriptive of the discussion you created. As users submit articles to the discussion, the subject of the article is placed in the table of contents page.
Figure 6.16: The table of contents updates automatically as articles are submitted.
Now use the Survey Form template to add a customer survey form to the site. The steps are
The upper portion of the survey form, shown in Figure 6.17, contains the purpose for the form, and a table of contents of the sections on the page. The visitor jumps to the appropriate section by clicking its link. Following the contents are brief instructions of how to complete the survey.
In each section in the survey form, you ask a series of questions, as in Figure 6.18. You can modify the form to suit any purpose.
Figure 6.18: Each section of the page has questions that relate to its heading.
After the visitor completes the survey, he submits it to your site by using the Form Submission area, shown in Figure 6.19. A footer is included in the lower part of the page.
Figure 6.19: The lower portion of the page contains the submission area and footer information.
You want to add a private discussion to your web so that employees can coordinate projects, exchange messages, or keep in contact with colleagues who are frequently on the road. You cannot add the private discussion to the current web, though. To restrict a Web with FrontPage's Personal Web Server, you must include a special Web registration form in your FrontPage root web. This registration form requires that an entire Web site be classified as restricted; you cannot mix public and private areas within a single Web site with the Personal Web Server. The way to get around this is to create a new Web site for the private section and to provide links between the public and private webs.
Creating the Private Employee discussion is easy because the choices that you made when you created the Customer Support discussion will be the default values when you step through the Discussion Web wizard again. Return to the FrontPage Explorer to create a new Web for the private employee discussion. The steps are
Before the pages appear in the FrontPage Explorer, the FrontPage Editor opens. Then you see the Web Self-Registration form, shown in Figure 6.20. This form uses a Registration bot, which asks visitors to your site for their name and password before they can enter the protected discussion.
Figure 6.20: You need to put the Web Self-Registration form in your server's root web.
The Web Self-Registration form contains instructions for you. First, you change the permissions for the web. Next, you open the root web. Finally, you save the registration form to the root web.
To change the permissions for a protected discussion web:
Now you need to open the root web of your server so that you can save the registration form to it. To open the root web on your server,
To save the Web Self-Registration Form into the root web:
Reopen the ACMECorpEmp Web with the FrontPage Explorer's File | Open Web command. The Discussion Web appears in the Outline View of the FrontPage Explorer. Figure 6.21 shows the fourteen pages that are added to the private Web site. Their content is identical to that of the pages in the Customer Support discussion. The page titles and their URLs are listed in Table 6.3.
Figure 6.21: The pages in the Employee discussion are added to your web.
Filename (URL) | Page Title |
acedfrm.htm | Frameset for ACME Corp Employee Discussion |
acedtoc.htm | ACME Corp Employee Discussion TOC |
acedtocf.htm | ACME Corp Employee Discussion TOC (Framed) |
acedwelc.htm | ACME Corp Employee Discussion Welcome |
acedcfrm.htm | ACME Corp Employee Discussion Confirmation |
acedsrch.htm | ACME Corp Employee Discussion Search Form |
acedpost.htm | ACME Corp Employee Discussion Submission Form |
acedaftr.htm | Included Article Footer for ACME Corp Employee Discussion |
acedahdr.htm | Included Article Header for ACME Corp Employee Discussion |
acedfoot.htm | Included Footer for ACME Corp Employee Discussion |
acedhead.htm | Included Header for ACME Corp Employee Discussion |
acedstyl.htm | ACME Corp Employee Discussion Web Colors |
_aced/toc.htm | _aced Discussion |
_aced/tocproto.htm | _aced/tocproto.htm |
You want to add an employee directory in this Web site. Links to the employees' home pages appear on this page. The steps are
Now you can return to the FrontPage Explorer. The new page is added to your web. If you do not see all your pages listed in the Outline View of the FrontPage Explorer, use the View | Refresh command to update the display.
Figures 6.22 and 6.23 show the employee directory. The upper portion provides links to the employees listed on the page. For each employee, a picture, title and department information, and contact information appear. Links to the employee's home page and e-mail address are also provided.
Figure 6.23: The employee sections on the page include departmental and contact information.
Creating large Web sites is no longer tedious. Combining webs and pages with FrontPage makes the job a snap. You can add pages to your webs to your heart's content. As your page library grows, the job gets even easier.
In this chapter, you learned how to combine pages from FrontPage's Web and page templates into a single Web site. You also learned how to register a protected web. You can add pages easily with FrontPage. With templates and wizards, designing webs is a piece of cake.
In the next chapter, you examine your pages more closely and decide what to add to your To Do List. You learn how to add tasks and how to mark them as complete when the pages are finished. You will soon learn how to build your own pages from scratch and edit them. You will find that the steps in building your own pages are just as simple.
| Why is the background image a JPG file? |
| The first reason is to minimize the size of the file. The background appears on all the pages and is downloaded often. Saving the file in JPG format reduces its size and, therefore, decreases the download time. The other reason is that JPG files can contain more than 256 colors. Backgrounds with subtle color differences can be very effective. You can place true-color images in your Web pages if you use JPG file format. |
| Can a visitor respond to a discussion group article by e-mail? |
| No, all responses to discussion group articles are stored on the Web as consecutively numbered Web pages (.htm extension). |
| Can some visitors be allowed access to some private groups while others are allowed access to other private groups? |
| Yes, each private discussion can be configured to allow as many visitors as you like. A single user can also be granted permission to access more than one Web by entering his or her name and password in each Web's Permissions dialog box. Refer to Chapter 23 to learn how to assign permissions for an end user to gain access to your private webs. |