Вы находитесь на странице: 1из 38

FrontPage 2003 Intermediate Page 1 of 38

Table of Contents

Meta Tags..........................................................................................................................2
Add a keywords meta tag to a Web page ....................................................................2
Add the description meta tag to a page.........................................................................2
Common Meta Tags.......................................................................................................3
Import a Web site...............................................................................................................3
Shared borders ................................................................................................................6
Dynamic Web Templates...................................................................................................6
Administering a web.........................................................................................................11
Task View.....................................................................................................................11
Reports View................................................................................................................12
Source Control.............................................................................................................14
Frames.............................................................................................................................15
Save a frames page.........................................................................................................16
Forms ..............................................................................................................................20
Form fields....................................................................................................................21
Types of forms fields....................................................................................................21
Set properties to send form results in an e-mail message .........................................23
Create a database to store form results ........................................................................25
Supplemental...................................................................................................................29
Banner Ad Manager ....................................................................................................29
Style Sheets.................................................................................................................30
Layers...........................................................................................................................32
Behaviors.....................................................................................................................35
FrontPage 2003 Intermediate Page 2 of 38

Meta Tags
A meta tag is a special Hypertext Markup Language (HTML) tag that provides
information about your Web page and, except for the page title, is not visible to Web site
visitors. Meta tags provide information such as who created the page, how often it is
updated, what the page is about (description tag), and which keywords describe the
content of the page (keywords tag). Meta tags are placed in the <HEAD> section

Although not all search engines support meta tags, many search engines use meta tags
to index Web sites (keywords meta tag) and then display the description in the search
results (description meta tag).

Add a keywords meta tag to a Web page


Keywords list should include both singular and plural forms of nouns, some synonyms,
and any abbreviations that might be appropriate, listed in order of importance. Search
engines ignore capitalization. The entire meta tag must contain fewer than 1,024
characters.

Create a one page web site

To add the keywords meta tag to your Web page, in Page view do the following:

1. On the File menu, click


Properties, and then click the
Custom tab.
2. Under User Variables,
click Add.
3. In the Name box, type
keywords.
4. In the Value box, type
keywords for site, using
commas to separate words.
5. Click OK twice.

Add the description meta tag to a page


Each search engine has a different limit for the number of characters from a description
that is displayed in the search results. These range generally from 150 to 395
characters.

To add the description meta tag, just like keywords, in Page view do the following:
FrontPage 2003 Intermediate Page 3 of 38

1. On the File menu, click Properties, and then click the Custom tab.
2. Under User Variables, click Add.
3. In the Name box, type description.
4. In the Value box, type the description for your site.
5. Click OK twice.

Common Meta Tags

<title>The name of your site</title>

<meta name="description" content="What is this page about?">

<meta name="keywords" content="What, words, describe, this, page?">

<meta name="author" content="Who made this page?">

<meta name="language" content="version of language and the country">

<meta name="revisit-after" content="10">

<meta name="owner" content="Who owns this page?">

<meta name="copyright" content="Copyright© 2007 –your name">

<meta name="contact_addr" content="who@madethispage.com">

<meta name="rating" content="general">

<meta name="robots" content="all">

<meta name="distribution" content="global">

<meta name="classification" content="directory name goes here">

<meta http-equiv="reply-to" content="email@address.com">

Import a Web site


1. Open the Web site that you want to import a Web site, folder, or file into.

2. On the File menu, click Import.


FrontPage 2003 Intermediate Page 4 of 38

3. In HTTP: use the site www.tomatofest.com (or any web site)

(Instead of HTTP, you can either:


Import a file from your local computer or network
1. Click Add File.
2. Locate and click the file that you want to import, and then click Open.
3. To import additional files, repeat steps 1 and 2.

Import a folder from your local computer or network


1. Click Add folder.
2. Locate and click the folder that you want to import, and then click Open. )

The starting page can be any page in the Web site, not just the home page.

To import a Web site that uses Secure Sockets Layer (SSL) for encrypted transactions,
select the Encrypted connection required (SSL) check box.
Click Next, and then follow the instructions in the Import Web Site Wizard.
FrontPage 2003 Intermediate Page 5 of 38
FrontPage 2003 Intermediate Page 6 of 38

If you import a disk-based Web site into another disk-based Web site, FrontPage only
adds the files and folders to the site. It does not import the file or folder as a new
subsite (formally known as subweb)

Shared borders
By default, Shared Borders no longer
appears on the Format menu in
FrontPage 2003 because the Shared
Borders functionality has been
replaced by Dynamic Web Templates
(DWTs). To use the Shared Borders
feature, add it to the Format menu:
1. Right click the toolbar section
2. Select Customize
3. Select Commands
4. Select Format
5. Drag Shared Borders to Format

Create Shared Borders by choosing


which borders to include on one page
or on all pages within the web site.
Modify each border’s properties.

Create two new pages with top and


left shared borders. Put a logo in the
top border and navigation links in the
left.

To edit a shared border


1. Open a page that uses the shared border you want to edit.
2. In Page view, at the bottom of the document window, click Design.
3. Click inside shared border region, outlined with a dashed line. When you click the
area, the outline changes to a solid line.
4. Make your changes to the content inside the shared border region. For example,
type or delete text, or add a picture.
5. Click Save. Your changes will appear on all pages that share the border

Dynamic Web Templates


A Dynamic Web Template is an HTML-based master copy of a Web page that you can
create to contain settings, formatting, and page elements such as text, graphics, page
layout, styles, and regions of a Web page that can be modified.

You can attach a Dynamic Web Template to the pages in a Web site, and that template
defines the layout for those pages.

How to use Dynamic Web Templates


FrontPage 2003 Intermediate Page 7 of 38

By creating a Dynamic Web Template, you can make regions on attached pages
available for other authors to add and modify content, while preventing changes to other
regions on the same page. This provides you with control to preserve the layout of the
pages and the template itself. When you update the content in a Dynamic Web
Template, you can update the attached
Web pages simultaneously.

You can use any number of Dynamic


Web Templates in a Web site, and you
can attach a Dynamic Web Template to
as many pages as you like. There are
no special template storage
restrictions, so you can save your
Dynamic Web Template (.dwt) files to
any location.

Key content regions of a Dynamic


Web Template
Editable regions are those areas that
you specify in the Dynamic Web
Template as being okay for other
writers to edit.

When creating the Dynamic Web


Template, you can enable other
authors to add or remove information in
the regions you specify without having
to worry that they will alter the page
layout.
This screen represents a sample Web
page that is attached to a Dynamic
Web Template. The template specifies the following areas as editable regions:
1. doctitle 2. This Week 3. ViewPoints

The screen capture also shows that the following are protected (non-editable) regions:
4. The lips logo in the top left corner of the page.
5. The navigation links, also on the left side of the page.

Protected regions are those areas in the layout that only the author of the Dynamic Web
Template can change. For example, you might want to add your logo to a protected
region. The logo will appear in the same location on every page that you attach to the
Dynamic Web Template. Contributing authors are not able to remove the logo because
it is in a protected region.

Dynamic Web Templates are useful in collaborative environments in which a designer


controls the page layouts and other authors add content to the pages but are not
FrontPage 2003 Intermediate Page 8 of 38

allowed to change the layout. When it comes to updating the content on your Web
pages, you can do it dynamically!

Create a Dynamic Web Template


1. Create or open an HTML document.
2. On the File menu, click Save As.
3. In the Save as type list, click Dynamic Web Template, and then click Save.
4. Create the basic contents and structure of the template in the *.dwt file, and then
click Save.

Add editable regions to a Dynamic Web Template


1. Open the Dynamic Web Template (.dwt) file.
2. In Page view, at the bottom of the document window, click Design.
3. Select only the areas in the template where you want to allow other Web authors
to change the attached Web pages.
4. Right-click a selection, and then click Manage Editable Regions.
5. In the Region name box, type a name for the editable region, for example,
Header, Body, or Footer.
6. Click Add.
7. Repeat steps 3 through 6 for each new editable region you want to add, and then
click Close.

Attach a Dynamic Web Template


1. Open the Web page you want to attach a Dynamic Web Template to.
FrontPage 2003 Intermediate Page 9 of 38

To attach the Dynamic Web Template to more than one page, select the pages
you want. In the Folder List, hold down CTRL and click each page you want.
If the Folder List is hidden, click Folder List on the View menu.

2. On the Format menu, point to Dynamic Web Template, and then click Attach
Dynamic Web Template.

3. Locate and click the Dynamic Web Template you want and then click Open.

If the body of a selected Web page contains content, the Choose Editable Regions for
Content dialog box appears. The dialog box displays the default settings for mapping
content from the body of the Web page to editable regions specified by the Dynamic
Web Template.

The Old column lists content in the body of the Web page. The New column lists
editable regions specified by the template.
FrontPage 2003 Intermediate Page 10 of 38

In the Choose Editable Regions for Content dialog box, do one of the following:

 To move all of the content in the body of the Web page to the default editable region,
click OK. If the default editable region contains content, that content is replaced with
the content on the Web page.

 To move all of the content in the body of the Web page to a specific editable region,
click (Body), and then click Modify. In the New Region list, click the editable region
you want to move the content to. If you click (none), the content is removed from the
Web page.

 To maintain all of the content and structure of the Web page, click Skip Current
Page. The template is not attached to the page.

FrontPage still includes and supports page templates, which are master copies of a
Web page layout that you can use as a starting point to create additional pages. If you
want to get a Web page up and running quickly and you are not concerned about
other authors making changes to the pages in your site, you can use page
templates.

In earlier versions of Microsoft FrontPage, you might have used shared borders to
create a region on a Web page that was common to one or more pages in a Web site.
You can now use Dynamic Web Templates instead. Unlike shared borders, pages that
FrontPage 2003 Intermediate Page 11 of 38

are attached to Dynamic Web Templates share an entire layout, and they offer much
more control over which parts of your pages are available for editing.

Administering a web.
Task View
To keep track of the many items that need to be completed is what Task View .is for.
You can track work items on your Web site by assigning tasks to people or to
workgroups. You can also add a description of the work item directly to the task. You
can associate these tasks with any file on your Web site — including a Web page, a
picture, a sound file, or another Microsoft Office System document.

By using Tasks view, you can monitor the most recent information about each task.
Each task has the following properties:
• Status— Completed or in progress
• Task— The task name
• Assigned To— User name or workgroup
• Priority— High, medium, or low
• Associated With— The name of the file the task is associated with, if any
• Modified Date— The last time the file was modified
• Description— A description of the work that needs to be done

Create a task on a Web page or site


1. Select Tasks.on the Views bar
2. On the Edit menu, point to Tasks, and then click Add Task.
3. In the Task name box, type the name of the task.
4. Specify the settings that you want for this task:
o In the Assigned to box, type or select the name of the person or
workgroup that you want to assign the task to.
o In the Description box, type a description of the task.
o Under Priority, click a priority that meets your expectations for the task.
FrontPage 2003 Intermediate Page 12 of 38

Create a task and associate it with a file on a Web site


 You can assign a task to any type of file on a Web site;
 You can only assign a task to one file at a time.

1. In the Folder List, click the file that you want to associate a task with.
If the Folder List is hidden, on the View menu, click Folder List.
2. On the Standard toolbar, click the arrow next to Create a new normal page.
3. Click Task.
4. In the Task name box, type the name of the task.
5. Specify the settings that you want for this task:
o In the Assigned to box, type or select the name of the person or
workgroup that you want to assign the task to.
o Next to Associated with, verify that the file name you want to associate
the task with is listed.
o In the Description box, type a description of the task.
o Under Priority, click a priority that meets your expectations for the task.

You can create a task in Page view while editing a page, and the task is automatically
associated with that page. The name of the file associated with a task, if any, is
displayed in the Associated with field in the New Task dialog box.

Reports View
FrontPage reports enable you to gather, analyze, and summarize Web site statistics in
a variety of ways.

Site Summary reports display an overview of your Web site's vital statistics, such as
the number and sizes of files and pictures, number and types of hyperlinks, and more.

Files reports display an overview of the age of files, who is working on them, when they
were modified or added to your Web site, and more.
FrontPage 2003 Intermediate Page 13 of 38

Shared Content reports display information about the features of your Web site that
work on groups of pages, such as themes, styles, dynamic Web templates, and shared
borders.

Problems reports display problems with your Web site, including broken links,
component errors, files that take too long to download, and more.

Workflow reports indicate the status of the files and assignments in your Web site,
including the review status, who the file is assigned to, whether it's checked out using
source control, and more.

Usage reports display information about the visits to your Web site, including page hits,
browsers used by site visitors, referring URLs, and more. Usage reports are available
only for top-level sites (top level site: The uppermost folder in a hierarchy of Web site
folders. A top level site can be hosted on a Web server, a virtual server network, or a
local computer hard disk.) and subsites hosted on Web servers running Microsoft
Windows SharePoint Services, SharePoint Team Services v1.0 from Microsoft, or
FrontPage 2002 Server Extensions from Microsoft. Usage processing must also be
turned on for the Web server. Additionally, if the site is based on Windows SharePoint
Services, you must have administrator privileges.

When you synchronize files using the Remote Web Site view, files on the remote site
will be downloaded to the local site.
FrontPage 2003 Intermediate Page 14 of 38

If malicious files were placed on the remote site, the local site may be at risk. Be sure
that only trusted users have access to the remote site before you attempt to
synchronize files.

Source Control
Source control helps prevent the conflicting document versions that can result when
several people are working on the same document simultaneously.

When source control is activated in FrontPage, a page will appear checked out when
someone is modifying the page, and no one else will be able to save changes to the
page until it has been checked in again.

To turn on source control


On the Tools menu, click Site Settings.

1. In the Site Settings dialog box, on the General tab, select the Use document
check-in and check-out check box.

2. Click either Check out files from the Local Web Site or Check out files from
the Remote Web Site.

3. Select the Prompt to check out a page when opening a file check box, and
then click OK.

4. When prompted to recalculate the Web site, click Yes.

If you do not check the Prompt to check out a page when opening a file check box in
the Site Settings dialog box, you will be able to double-click the document and open it
without the file being checked out. For a prompt to check out the page when double-
clicking a file, make sure the Prompt to
check out a page when opening a file is
checked.

To check a file in or out

Make sure source control is turned on.


While you have a file checked out, only
you can modify it. Others can open the
last-saved version of the file to view it, but
cannot save any changes to it.

When you check the file in


again, others will be able to
check out the file and modify it.
FrontPage 2003 Intermediate Page 15 of 38

Check a document out



Right-click the document and click Check Out.

If you did not check the Prompt to check out a page when opening a file check box
in the Site Settings dialog box you will be able to double-click the document and open it
without the file being checked out. For a prompt to check out the page when double-
clicking a file, make sure the Prompt to check out a page when opening a file is
checked.

Check a document in

Right-click the document that you want to check in and click Check In.
Undo a document checkout

You can undo a document checkout. The document will be checked in, but none of your
changes will be saved. To save your changes, see Check a document in.

Right-click the document and click Undo Check Out.

1. On the View menu, click Remote Web Site.


2. Do one or both of the following:
o In the Local Web site pane, right-click each file that you do not want to
publish, and then click Don't Publish on the shortcut menu.

o In the Remote Web site pane, right-click each file that you do not want to
publish, and then click Don't Publish on the shortcut menu.

3. Remote Web site pane, under Publish all changed pages, click Synchronize.

Frames
A frames page is a type of Web page that, when displayed in
the browser, has multiple regions within it called frames.
Each of these frames can display a different Web page.

A frames page itself contains no visible content— it's just a


container that specifies which other Web pages to display in
a frame and how to display them.

The frames page The banner frame The contents frame The main frame

You create a frames page by using one of the frames page Web site templates in
Microsoft FrontPage. In each of these templates, the navigation between frames is
already set up for you.
FrontPage 2003 Intermediate Page 16 of 38

For example, a frames page created by using the Banner and


Contents frames page template actually shows four pages
simultaneously in the browser: the frames page, which is the
container, and the three pages shown in each of the three frames.
When you click a hyperlink in the contents frame on the left, the
page pointed to by that hyperlink opens in the main frame.

After you create the frames page from a template, all you need to do
is set the initial page you want shown in each frame. You can select
an existing page or create a new page. Then you can edit the page
directly in its frame.

How frames pages are used


A user clicks the link in the banner frame
A list appears in the contents frame- click link in contents frame
A page is displayed in the main frame

In frames pages based on the Banner and Contents frames page template, many
companies use the banner frame to show a corporate logo and the primary
departments.

Frames pages are often used for catalogs, lists of articles or


information, or any other kind of page where clicking a hyperlink in
one frame shows a page in another frame. Authors use frames
pages because they contain built-in navigation and present a
consistent user interface.

Controlling the appearance of frames


On any frames page, you can split a frame horizontally or vertically to create two
frames. You can either split it into evenly divided rows or columns, or you can drag its
border to specify a certain size for each frame. You can resize or delete frames by
selecting and dragging frame borders. You can also choose to show or hide the borders
between frames.

Split a frame Resize a frame Delete a frame Show or hide frame borders

You can also control:


 The amount of space between frames
 The size of margins inside frames
 If a frame can be resized by users in the browser
 If scroll bars are shown in a frame

Save a frames page

1. In Page view, at the bottom of the document window, click Design .


FrontPage 2003 Intermediate Page 17 of 38

2. On the File menu, click Save As. The Save As dialog box displays a preview
showing the layout of the frames page. Because you are saving the frames page,
all areas should have the dark blue box highlights indicating that this is what you
are saving.
3. In the File name box, type a file name for the highlighted frames page.
4. Navigate to the location where you want to save the page.
5. Click Save.
 After you click Save, the Save As dialog box automatically opens again and asks
you to save the page shown in the frame just saved. This occurs for each page
shown in the current frames page.
 The title shown in the title bar of the browser is the title of the frames page itself,
not the title of the page displayed in the frame.

Choosing a Frames Page Style


1. On the Standard toolbar, click BLANK PAGE»select Page...

The Page Templates dialog box appears.


2. Select the Frames Pages tab
A list of various frames page styles appears.
3. OPTIONAL: To preview a style, click the appropriate icon
In the Preview area, a sample appears.
In the Description area, a brief description of the previewed
style appears.
4. Select the desired frames style
5. Click OK

Setting an Initial Page


When you open a blank frames page, you will find it divided in the style you chose. You
have the options to select one of your existing pages, link to an external page, or search
FrontPage 2003 Intermediate Page 18 of 38

the Web for a page to use. In each frame, there are two buttons: SET INITIAL PAGE...
and NEW PAGE. If you would like to use an existing page for the frame, either in your
files or on the Web, click SET INITIAL PAGE... Or, you may create a page by clicking
NEW PAGE

Setting an Initial Page: Using an Existing Page


1. In the frame where you want to set an initial page, click SET INITIAL PAGE...
The Insert Hyperlink dialog box appears.

2. Using the Look in pull-down list, locate and select the desired page
3. Click OK
The selected page is opened and set in that frame.

Setting an Initial Page: Using an External Page


1. In the frame where you want to set an initial page, click SET INITIAL PAGE...
The Insert Hyperlink dialog box appears.
2. In the Address text box, type the URL of an external page to set in the frame

3. Click OK
The selected page is opened and set in that frame.

Setting an Initial Page: Searching the Web


1. In the frame where you want to set an initial page, click SET INITIAL PAGE...
The Insert Hyperlink dialog box appears.
2. Click BROWSE THE WEB
The default web browser opens.
3. Browse to the page or file you want to use
4. Return to FrontPage
In the Insert Hyperlink dialog box, the URL of the last page you visited appears in
the Address text box.
FrontPage 2003 Intermediate Page 19 of 38

5. Click OK
The selected page is opened and set in that frame.

Creating a New Page


1. In the frame where you want to create a new page, click NEW PAGE
The selected frame opens a blank page.
2. Create this frame as you would create a new web page

Saving a Frames Page


You will now be prompted to either save each individual frame or each frameset. The
first time you save, if you have created a new page, you will be prompted to save each
frame separately. If you are using an existing page you will be prompted to save the
frameset. After the frames are saved, you will also be prompted to save the frameset.
NOTE: To save a frame, you must be in Design view.

Saving Individual Frames


1. Place the insertion point in the desired frame
2. From the File menu, select Save
The Save As dialog box appears, displaying the selected frame; only this frame
will be saved.
3. In the File name text box, type the desired filename for the selected frame
4. To save this frame, click SAVE
5. Repeat steps 1-3 for other frames

Saving the Frameset


If you are not saving for the first time you will be prompted to
save the frameset, rather than individual frames.
1. Place the insertion point in your frames page
2. From the File menu, select Save As...
The Save As dialog box appears, displaying the
selected frameset.

3. In the File name text box, type the desired filename


for your frames page
4. To save the frameset, click SAVE

Frames Page Views

Once you have selected a frames style and your new frames
page is open, you have an additional option for viewing your
page. The No Frames option displays the message that will be
shown when a web browser does not support frames. You
may alter this message.
FrontPage 2003 Intermediate Page 20 of 38

Inline frames are similar to frames pages except that the inline frame and its contents
are embedded on an existing Web page. Anything that you can put on a regular page
you can put in an inline frame. You can customize inline frames in the same ways as
regular frames and also enable scroll bars.
One of the advantages of using inline frames is that you don't need to create a separate
frames page in order to have embedded content.
You can use inline frames in a variety of ways:
 To insert a contract for your site visitor to fill out
 To give examples of what other Web pages look like
 As a container for a form
 As a scrolling box with products and prices

Add an inline frame to a page


1. In Page view, at the bottom of the document window, click Design .
2. On the Insert menu, click Inline Frame.
If the Inline Frame command is unavailable, do the following:
1. On the Tools menu, click Page Options.
2. Click the Authoring tab.
3. Select the Frames check box.
3. Set the initial page of the inline frame.

Forms
You can create a form using the
Form Page Wizard or without a
wizard. To create a form with the
wizard, use the Template for Form.

To create one yourself, do this:

1. In Page view, at the bottom of


the document window, click
Design.

2. Place your pointer where you


want to add the form.
3. On the Insert menu, point to
Form, and then click Form.

4. Place your pointer in the form


area, and on the Insert menu,
point to Form, and then select
the check box for each of the
fields that you want to add to
your form
FrontPage 2003 Intermediate Page 21 of 38

Form fields
You can request information or get feedback about your site by providing a form with
form fields for them to fill out. The form fields you choose depend on the information you
want to gather.

To add a form field to a form, from the Insert menu, point to Form, and then select a
form field from the list.

Types of forms fields

Text box
Use text boxes to collect a small amount of information in one line, such as first and last
names or e-mail addresses. To collect larger amounts of information from site visitors,
use text areas.

Option buttons A B C
Use option buttons (also called radio buttons) when you want site visitors to select only
one option from a group

Text area
Use text areas to collect one or more lines of text, such as a comment. This field scrolls
to accommodate varying amounts of text. To collect a small amount of information from
site visitors, use text boxes.Give feedback about this Web site:

Drop-down box or menu


Use a drop-down box or menu to provide site visitors with a list of choices. This field is
similar to using a group of option buttons, but takes less space on a form. Unlike option
buttons, you can configure a drop-down box to allow one or multiple selections.
Select a product:

Check box
Use check boxes for optional items. The site visitor can select or clear the check box.
They can also select multiple items. Yes, I would like to receive updates

Reset
Push button
Use push buttons to enable site visitors to submit a filled-out form, to clear fields by
FrontPage 2003 Intermediate Page 22 of 38

resetting the form, or to run your custom scripts. You can add a graphic to a form to use
in place of a submit button. After filling out a form, the site visitor clicks the graphic to
submit the form, and then the data from the form, including the name of the graphic
field, is sent to the form handler (A program on a server that is executed when a site
visitor submits a form. A form in FrontPage is associated with a form handler.)

Advanced button
By inserting the Advanced button into your form, you can write a script that will make
your form do more exactly what you need. The Advanced button is highly customizable
— you can use fancy fonts, colors, or even tables on the button.

Group box

Add a group box to a form when you want to assemble a


set of related controls or fields in a separate area from the rest of the form.

Submit Reset
File upload
Give your site visitors the opportunity to send a file to your Web site. When you insert
the File Upload form field, site visitors click the Browse button, locate their file, and
then click Submit.

Submit
Password field Password
When you want a site visitor to enter a password to have access to your Web site, add
a password field to your registration form. A password field is really just a one-line text
box. When a site visitor types in this field, most Web browsers will display the password
as asterisks, for confidentiality purposes.
FrontPage 2003 Intermediate Page 23 of 38

Set properties to send form results in an e-mail message

You can send form results n an e-mail message. Each time a site visitor submits a form,
a message containing the results of the form is sent to the e-mail address you specify.

You can also configure other options for the messages, such as the text for the Subject
line and the address for the From (Reply To) line.

To collect form results in an e-mail message, contact your Web server administrator to
ensure that the server is running FrontPage Server Extensions , SharePoint Team
Services version 1.0 from Microsoft, or Microsoft Windows SharePoint Services.
Additionally, the server must be configured to send e-mail. Contact your server
administrator to find out if the Web server that hosts your Web site is configured to send
e-mail.
1. In Page view, at the bottom of the document window, click Design
.
2. Right-click the form, and then click Form Properties.

3. Click Send to.


FrontPage 2003 Intermediate Page 24 of 38

4. In the E-mail address box, type the e-mail address to which you want to send
the form results.

5. If you do not want results saved to a file in addition to being sent in e-mail, clear
the File name box, and then click Options
.
6. Click the E-mail Results tab.

7. Then do one or more of the following:

o In the E-mail format list, click the text format you want.

o To specify the subject line of the e-mail message, under E-mail message
header in the Subject line box, type the text that you want. If you leave
this box blank, the default subject line in the e-mail will be "Form Results."

o If you want the subject line of the e-mail message to contain the results of
one field from your form, next to Subject line select the Form field name,
check box, and then type the name of the field in the Subject line box.

o If you want a specific e-mail address to appear as the sender of the e-mail
message (the From or Reply To line in the e-mail), type that address in the
Reply-to line box.

o If your form contains a field that collects the site visitor's e-mail address,
you can use that address as the sender's address. Next to Reply-to line, select the
Form field name, check box, and then in the Reply-to line box, type the name of the
form field.
FrontPage 2003 Intermediate Page 25 of 38

Create a database to store form results


Prior to performing these procedures, contact your server administrator to determine
which database file types are supported, and to ensure that the server hosting your
Web site has Microsoft FrontPage Server Extensions or SharePoint Team Services
from Microsoft installed.
Windows SharePoint Services 2.0 does not support Access .mdb files because
Windows SharePoint Services stores files in a Microsoft SQL database.

1. In Page view, right-click the form, and then click Form Properties.

2. Click Send to database, and then click Options.


FrontPage 2003 Intermediate Page 26 of 38

3. On the Database Results tab, click Create Database.

After FrontPage creates a Microsoft Office Access 2003 database, a confirmation


message displays the name of the database and its location in your Web site. For
example, /fpdb/Form.mdb indicates that the database is named Form, and is located in
the /fpdb folder created by FrontPage in the current Web site.

4. Click OK.

FrontPage automatically selects the new database as the database connection to use
and selects the table to store the form results in.

5. Click OK, and then click OK again.

If the extension of the current page is .htm, FrontPage prompts you to rename the file
with the .asp extension so that the file will work correctly.

Using the Database Results Wizard with ASP


The following procedures will not work on a Web site located on a server running
Microsoft Windows SharePoint Services.

By using the Database Results Wizard on a Web site hosted on a server running Active
Server Pages (ASP) (ASP: Active Server Pages. A server-side scripting technology that
is used to create dynamic interactive Web applications. An ASP file is an HTML page
containing scripts that are processed by a Web server before being sent to a browser.),
you can create Web pages to view and search database records.
Security Use this feature with caution. Sensitive or confidential information could be
revealed to others, such as other authors of your Web site, or site visitors on the
Internet or your intranet.

Start the Database Results Wizard


• On the Insert menu, point to Database, and then click Results.

Specify ASP as the server technology and the database connection


1. In the FrontPage has detected that your page will display best using area,
clickASP, so that your pages will work correctly on a Web site located on a
server running ASP.
2. Specify the database connection you want.
FrontPage 2003 Intermediate Page 27 of 38

Specify the record source


Do one of the following:
• To select the table or view you want, click Record Source.
• To create a custom query, click Custom Query, and then click Edit.

Specify the fields to be displayed on the database results page


You can do one or more of the following:
• To exclude fields from appearing in the database results region or to change the
order in which they appear, click Edit List.
• To filter, limit, or sort the database results, to set up a search form, or to provide
default values for the search, click More Options.

Specify the formatting options for the database results region


• You can format the database results region as a table, a list, or a drop-down list.

Specify whether to display all records together or to split them into groups
You can do the following:
• If you specified to display the records as a table or a list on the previous page of
the wizard, you can specify whether to display all of the records together or to
split them into groups of records with buttons to move forward or backward
through the records.
• Additionally, if you specified that you wanted to use a field as a search field in the
previous page of the wizard, you can specify here that you want to add a search form
to your page.

About creating data-driven Web sites

To create a data-driven Web site in FrontPage 2003, you must be using Microsoft
Windows SharePoint Services, which provides the component-based platform required
for FrontPage data-driven functionality. To use Windows SharePoint Services, the
following technologies are required on your Web server:
• Microsoft Windows Server 2003, Standard Edition, Enterprise Edition, Datacenter
Edition, or Web Edition
• Microsoft Internet Information Services (IIS) 6.0 in IIS 6.0 worker process
isolation mode
• ASP.NET

What is a data-driven Web site?
The Internet is full of Web sites that require the Web site creators to edit the HTML
every time a content change needs to be made. With so much to do to make changes, it
is no wonder there are so many static Web sites on the Internet!
A data-driven Web site, on the other hand, changes automatically because it draws its
content from external dynamic data sources. The data sources that FrontPage 2003
supports include:
• Windows SharePoint Services lists and document libraries
FrontPage 2003 Intermediate Page 28 of 38

• Extensible Markup Language (XML) (Extensible Markup Language (XML): files


on your Web site
• Uniform Resource Locators (URLs) that return XML
• XML Web services
• Microsoft SQL Server databases
• Microsoft Access
• Oracle
• Other databases that are accessible through OLE DB (OLE DB: A component
database architecture that implements efficient network and internet access to
many types of data sources, including relational data, mail files, flat files, and
spreadsheets.)
A well-architected, data-driven Web site is much easier to maintain than a static Web
site because most content changes require no change to the HTML behind the Web
site. Instead, changes are made to the data source that drives the Web site, and the
Web site automatically adjusts to reflect those changes. With a data-driven Web site,
you connect to and present live data from a variety of data sources. Web site visitors
upload the data from your Web site by using a Web browser.
When you create a data-driven Web site in FrontPage, you select a data source from
the data source catalog, and then you add a Data View to your Web site that extracts
data from the data source. When you add a Data View to your Web page, you're
actually inserting something called a Data View Web Part.

More about Data Views


By using FrontPage, you can add Data Views to your Web site that display data by
using Extensible Stylesheet Language Transformations (XSLTs) .
You can customize Data Views to create custom displays of your data in WYSIWYG
format by using the Formatting toolbar. You can also perform more advanced
customizations by using the Data View Details task pane:
• Style Choose a formatting style from a gallery of predesigned list view styles.
You can also add a toolbar for site visitors to perform custom filtering on the list.
• Filter Specify criteria to display a subset of the data in the Data View.
• Sort & group Display items in a particular order and optionally group them on a
Web page beneath collapsible headings.
• Conditional Formatting Set conditions for the data in your Data View.

Microsoft Windows SharePoint Services, which is built on the Microsoft .NET
Framework, provides the component-based platform required for FrontPage data-driven
functionality.

About Web Part connections


When you add Web Parts to your page by using FrontPage, you have more control over
how they appear than you would by working with them on your SharePoint site. You can
even create connections between Web Parts so that when you perform an action in one
Web Part, it changes the contents of another Web Part.
FrontPage 2003 Intermediate Page 29 of 38

Connecting sets of data from different data sources usually requires advanced
programming skills, but by connecting Web Parts, you can pass data between them and
synchronize their behavior. For example, you can connect a List View Web Part, which
contains a column with a hyperlink data type, to an Image Web Part, which contains a
picture of an employee. Each time you select a row in the List View Web Part, you can
see the picture of the employee displayed in the Image Web Part.
Although you can establish a Web Part connection by using the Web browser, by using
FrontPage, you can extend the functionality of Web Part connections. For example, you
can use the Form Web Part to filter the data in another Web Part, or you can establish
connections between Web Parts on two Web Part Pages in the same top-level Web
site.

About the Form Web Part


Form Web Parts are a case-sensitive, filtering mechanism, and they work with Microsoft
Windows SharePoint Services Web sites only.
By using the Form Web part in FrontPage, you can extend the functionality of Web Part
connections by enabling site visitors to enter data through a familiar form-like interface,
which passes data into a Web Part connection. Similar to a search box, site visitors can,
for example, filter on data contained in the List View Web Part by using the Form Web
Part.

By using the Form Web Part option, you cannot build a form that lets you collect data
and send it to a database or e-mail address. Instead, to collect data from your
customers, on the Insert menu, point to Forms, and then click List Form or Form.
If you are running a Web site based on Windows SharePoint Services, you can use the
following forms:
• List Forms, which are used to input data to a SharePoint list.
• Forms, which are used to collect data to a standalone text or XML file.
• Form Web Parts, which are used to filter for information on your SharePoint site,
and work by using the Web Part Connections technology.

If you are running a Web site that is not based on Windows SharePoint Services, such
as a disk-based Web or by using the FrontPage Server Extensions, on the Insert
menu, point to Forms, and then click Forms. The other forms options may be
unavailable because you are not running a SharePoint Web site.

Supplemental
Banner Ad Manager
By default, the Banner Ad Manager is not included as a menu option .
To add the Banner Ad Manager and other components to the Insert menu:
1. On the Tools menu, click Customize.
2. In the Customize dialog box, click the Commands tab.
3. Click the Insert menu. The Insert menu will continue to be displayed even when
you move your pointer away from it.
4. In the Customize dialog box, in the Categories list, click Insert.
FrontPage 2003 Intermediate Page 30 of 38

5. In the Commands list, locate and click Banner Ad Manager.


6. Drag the Banner Ad Manager entry to the Insert menu, and place it where you
want.
7. In the Customize dialog box, click Close.
8. Click the Insert menu to verify that the Banner Ad Manager command is there.

Once that is available, you can select it to build your picture banner by selecting the
graphics you want to include, height/width, transition and setting the link.

Style Sheets
A cascading style sheets (CSS) is a set of
instructions that tells the Web browser
how to display different HTML elements.
With CSS, you can also create special
effects, including text rollovers, as well as
control the placement of graphics, and
design the layout of a page. Here’s an
embedded style rule applied to the H1
element.. A style sheet is a set of
instructions that tells a browser how to
FrontPage 2003 Intermediate Page 31 of 38

present HTML elements, such as what font to use, what size the paragraph text should
be, what color the header text should be, whether or not there should be a background
color applied to specific elements, and so on.

Each style rule is made up of two parts: the selector and the definition. The selector
identifies the element affected by the rule, and the definition identifies how the element
will be displayed. The definition contains the property and the value of the element.
A style rule looks like this: selector {property: value; }
If you want all your <h1> tags to be blue, the final code would look like this:
h1 {color: blue; }

There are three types of cascading style sheets:

External style sheet, which you use


when you want to apply the same
styles consistently across all the pages
in your Web site that are linked to it.
Also known as linked style sheet.

Embedded style sheet, which you use


when you want to define styles for the
current page

Inline style sheet, which you apply to


individual elements on a page.
Each one has advantages and
disadvantages, and you can use all
three types in a Web site, making it
easier to manage the look and feel of
the entire site while also being able to
control each individual element down
Cascading style sheets can be located in
to the letter. More about this in the next
three different places in your Web site.
lesson.
An external, or linked, style sheet (note
Other benefits of CSS
the styles.css document in the folder list).
More control over the display of
individual elements on a page.
An embedded style sheet.
Faster download times.
An inline style sheet.
Easier site management.

It is important to use CSS because the FONT element has been deprecated by the
World Wide Web Consortium (W3C).

When the W3C deprecates an element, it means it's on its way to becoming obsolete.
FrontPage 2003 Intermediate Page 32 of 38

There will come a time when FONT tags will no longer work, and CSS will be the only
way to choose how to modify the appearance of the text in your Web site.

The three different kinds of


style sheet are applied to a
Web page in cascading order.

The linked style sheet is


applied first.

The embedded style sheet


is applied next, taking
precedence over the linked
style sheet.

The inline style is applied


last and takes precedence
over the embedded and linked
style sheets.

The more specific the style rule, the higher it is in the order in which it is applied.

An inline style will take precedence over an embedded style, and an embedded
style will take precedence over a linked style.

Good Reference site: http://www.w3schools.com/css/css_syntax.asp

Layers
A layer is a container in a Web page that holds page elements, such as text and
graphics. Layers can be used to create animations, flyout menus, or page layouts.
You can overlap, nest, and show or hide layers on a page. You can also animate layers
by using Behaviors, which add script to any element in a page.

In FrontPage 2003, a layer is defined as an absolutely positioned DIVISION.

You can create layers using the Insert menu, and move layers by clicking and dragging
them. You can also fine-tune the exact placement and stacking order of layers by using
the Layers task pane

Add a layer
1. In Page view, at the bottom of the document window, click Design.
2. On the Insert menu, click Layer.
FrontPage 2003 Intermediate Page 33 of 38

Set layer border, shading, and positioning properties


You can set layer properties for absolutely positioned layers by using the Layers task
pane

Borders and Shading


1. In Page view, at the bottom of the document window, click Design.
2. Click the layer for which you want to set properties.
3. On the View menu, click Task Pane.
4. In the Layers task pane, under Layer properties, click Borders and Shading.
5. In the Borders and Shading dialog box, click the Borders tab and choose from
among the border properties.
6. In the Borders and Shading dialog box, click the Shading tab and choose from
among the shading properties.

Positioning

Setting the Positioning style to any setting other than Absolute will prevent the layer
from appearing in the Layers task pane. A layer (or DIVISION element, represented by
the <div> tag) with a Positioning style set to None or Relative can be modified using
the mouse or the toolbar. Although the DIVISION will no longer appear in the Layers
task pane after the Positioning style is set to Relative or None, the ID will remain the
same.
FrontPage 2003 Intermediate Page 34 of 38

1. In Page view, at the bottom of the document window, click Design.


2. Click the layer for which you want to set properties.
3. On the View menu, click Task Pane.
4. In the Layers task pane, under Layer properties, click Properties.
5. In the Position dialog box, choose from among the position properties.

To modify layer visibility, layer z-index, and layer ID, use the Layers task pane.
Otherwise, use your mouse pointer for resizing the layers, or the task pane to control
precise layer dimensions.

To modify layer visibility


1. In Page view, at the bottom of the document window, click Design.
2. On the View menu, click Task Pane.
3. In Layers task pane, in the Layer Visibility column, click layer to modify.

The open eye icon indicates that the layer is visible by default.
The closed eye icon indicates that the layer is hidden by default.
No icon means that the layer inherits the visibility setting from the previous layer.

4. Click again to change layer visibility.

To modify layer z-index


1. In Page view, at the bottom of the document window, click Design .
2. On the View menu, click Task Pane.
3. In the Layers task pane, in the Layer Z-index column, double-click the layer that
you want to modify.
4. Type the desired z-index in the box.

To modify layer ID
1. In Page view, at the bottom of the document window, click Design.
2. On the View menu, click Task Pane.
3. In the Layers task pane, in the Layer ID column, double-click the layer that you
want to rename.
4. Type the desired layer name in the box.

To modify layer size


1. In Page view, at the bottom of the document window, click Design.
2. Click the corner of the layer that you want to resize and drag the corner until the
layer is the desired size.

To modify layer size to precise dimensions


1. In Page view, at the bottom of the document window, click Design.
2. On the View menu, click Task Pane.
FrontPage 2003 Intermediate Page 35 of 38

3. In the Layers task pane, right-click the layer that you want to modify, and then
click Positioning on the shortcut menu.
4. In the Position dialog box, under Location and size, enter the desired width and
height in the Width and Height boxes.

Behaviors
Behaviors in FrontPage are scripting options that enable you to quickly add interactivity
or increased functionality to text or other elements of your Web page.
A Behavior is a combination of an event and an action that you want to occur when a
site visitor interacts with a Web page or an element of a page.
You can customize built-in FrontPage Behaviors by using a task pane .

Events

An event is a condition that causes a Web browser to trigger a script. Event names
usually reflect how they are activated. For example, the onMouseOver event is
triggered when the mouse pointer moves over a page element. Likewise, the
onMouseClick event is activated when the user clicks a page element.

Actions
An action is an instruction that executes when an event occurs. Actions are
functions — prewritten blocks of script code — that perform a specific task, such as
swapping an image or opening a browser window.

After you attach a script to a page element (using the Behaviors task pane), the
browser "calls" the action that is triggered by the event.

Each action requires a set of properties and parameters in order to do a task. In


FrontPage, you can view or edit the properties for each action using the Behaviors task
pane.

You can customize built-in FrontPage Behaviors by using a task pane


1. In Page view, at the bottom of the document window, click Design.
2. On the Format menu, click Behaviors. The Behaviors task pane opens.
3. On the page, select the text or graphic you want to work with.
4. In the Behaviors task pane, click Insert, and then click the action you want.
5. In the dialog box that appears, select the options you want, and then click OK.
6. Under Events, point to the default event, and then click the arrow to choose the
event you want.
7. Depending on the action you choose, select any additional options that define the
event for the action.

Every Behavior is very simple to insert,


1. On the Format menu, click Behaviors.
2. In the Behaviors task pane, click Insert, and then select a Behavior.
FrontPage 2003 Intermediate Page 36 of 38

Redirecting users to another Web site


There are two ways to redirect a browser to another URL. The first is to use a metatag
redirect in the header of the HTML. The second is to use JavaScript, which is how the
Go To URL Behavior works.

The primary reason to use a scripted Behavior is flexibility; you can customize the script
for specific needs. You can also bind multiple Behaviors to a single event. The metatag
always acts alone and cannot easily be combined with other Behaviors.

To redirect a user to a new site:


1. In the Behaviors task pane, click the Insert button and choose Go To URL.
2. In the Go To URL dialog box, enter the URL in the Go To URL box,

Redirecting users with specific browsers


To accommodate different browsers and versions, you can create a common page that
redirects users of certain browsers and versions to one page, and users of all other
browsers and versions to another page.
1. Open your Web page.
2. In the Behaviors task pane, click Insert, and then click Check Browser.
3. In the If the current browser type is drop-down menu, click the target browser.
4. In the Version drop-down menu, click the browser version.
5. Select the Go To URL check box, and type the URL to redirect users who are
using the target browser.
6. In the Otherwise, for all other browsers section, select the Go To URL check
box, and then type the URL to redirect users who are not using the target
browser.
Sometimes you have to check whether users have a specific plug-in installed on their
computers. A common example is the Windows Media® player. FrontPage 2003 has a
Behavior called Check Plug-in to solve this issue. The Check Plug-in Behavior works
exactly like the Check Browser Behavior.

To check plug-ins:
1. Open your Web page.
2. In Behaviors task pane, click the Insert button, and then click Check Plug-in.
3. In the If the current plug-in is drop-down menu, click the target plug-in.
4. Check the Go To URL check box and type the URL to redirect users who are
using the target plug-in.
5. In the Otherwise, for all other plug-ins section, select the Go To URL check
box, and then type the URL to redirect users who are not using the target plug-in.

To create a drop-down jump menu:


1. Click the page on which you want to place the menu.
2. In the Behaviors task pane, click Insert, and then choose Jump Menu.
3. Click Add.
4. In the Add Choice dialog box, specify the text for the drop-down menu item.
5. In the Value box, type the URL associated with the menu item.
FrontPage 2003 Intermediate Page 37 of 38

6. To save the menu, click OK.

Creating rollover images


Rollover images add a nice professional touch without making the site unusable for
users who have a dial-up connection. With the Swap Image and Swap Image Restore
Behaviors, rollover buttons are easy to implement.

To create a rollover image:


1. Click an image to select it.
2. On the Behaviors task pane, click Insert, and then click Swap Image. Select the
Preload Images and Restore on mouseout event check boxes.
3. To locate the image for the rollover, click Browse.

Opening external links in a new window


There are times when you will want to open a page in a new window without closing the
current window. New windows can be opened from any hyperlink, whether text- or
image-based. For images, simply select the graphic and insert the Open Browser
Window Behavior from the Behavior task pane. In the Open Browser Window dialog
box, type the URL in the Go To URL box, and the name you want associated with the
new window in the Window name box.

For text hyperlinks, however, replace the http:// in the URL with JavaScript:// before
highlighting the text and adding the Open Browser Window Behavior. If you do not
change the http:// portion of the URL to begin with JavaScript://, when the link is clicked,
the page may open in the current window as well as in the new window, depending on
which browser is being used. Using JavaScript:// gives you more control over the
Behavior, regardless of which browser is calling the new window.
FrontPage 2003 Intermediate Page 38 of 38

Once you have replaced the http:// with


JavaScript://, simply select the URL and insert the
Open Browser Window Behavior from the
Behavior task pane. In the Open Browser
Window dialog box, type the URL in the Go To
URL box and the name you want associated with
the new window in the Window name box.

If you use A HREF, you can also use target=new to


open a link in a new window. However, much like
the Go To URL Behavior, using a Behavior in this
instance provides more flexibility. With the A HREF
tag, the new window will open to the default size of
the user’s browser.

With the Open Browser Window Behavior, you can


control the appearance of the new window,
including the size, the presence of scrollbars, and a
host of additional customizations.

For clickable links, you will want to make sure that


the Open Browser Window Behavior is set to work
on the onClick event. With the associated graphic
or text selected, you will see an event in the Event
column of the Behavior task pane associated with
the action Open Browser Window (which appears in
the Action column). Click the arrow that appears to
the right of the event in the Event column, and
select onClick from the drop-down list

Selecting the arrow to the right of the event in the


Behavior task pane reveals a drop-down list of
events from which you can select an event to associate with an action.

If you are using links from your local site, the Preview view may not operate properly
when testing your links. In these cases, use the Preview in Browser option from the File
menu.

To display text in the status bar:


1. In the Behaviors task pane, click Insert.
2. Click Set Text, and then click Set Text of Status Bar.
3. In the Message box, type your message, and then click OK.