Using Interactive Buttons

Site Navigation

Day One

Day Two

Day Three

Day Four

We use and recommend

for your on-line transactions

About Creating Interactive Buttons

I debated about including this section, as I never have found a good purpose for this feature. This is basically another type of hyperlink. You could use Interactive Buttons instead of Link Bars for site navigation. But you may want use these buttons on your site, so this page is included for your information. There is no exercise, if you want to use these buttons, just follow the directions on your own time.

Instead of creating buttons that just provide a hovering effect, you can create more visually appealing buttons that look as if they were created with an advanced graphics-editing tool. These new Interactive Buttons are more versatile than hover buttons because you have more control over what they look like.

And you don't need to be an imaging or coding expert to add or customize these buttons. Use the Insert menu to add them and then set their properties by double-clicking them. For example, you can:

Add the button text and select the button and background colors.
Specify the font style, size, and color for all states of the button, including the original, hover, and pressed states.
Set the horizontal and vertical alignment.
Change the size and proportions of the button.

After you add a button, you can link it to another page in the current Web site, to a site on the World Wide Web, or to an e-mail address.

When you add an Interactive Button, FrontPage creates the image files that make up the button. When you save your Web pages, FrontPage prompts you to also save the button image files.

To create and set the properties for an Interactive Button, see the following:

Add an Interactive Button

In Page view, at the bottom of the document window, click Design .
Place the insertion point where you want to add the button.
On the Insert menu, click Interactive Button. (Or Insert, Web Component, Dynamic Effects, Interactive Button.)
On the Button tab, in the Buttons list, click a button style.
In the Text box, type the text that you want to appear on the button.
Next to the Link box, click Browse.
Locate and click the file, URL (Uniform Resource Locator or web address), or e-mail address that you want the button to link to, and then click OK.

Note When you save the Web page, Microsoft Office FrontPage 2003 will prompt you to save the images associated with the button.

Set the Properties of an Interactive Button

Right-click the Interactive Button that you want to set the properties for, and then click Button Properties on the context menu.
Do one or more of the following:

Set the text

On the Button tab, in the Text box, type the text that you want to appear on the button.

Set the font

On the Font tab, select the font properties that you want.

Set the button background

On the Image tab, do one of the following:

To match the background of the button to a Web page with a solid background, click Make the button a JPEG image and use this background color, click the arrow on the list, and then click a color that matches your Web page.
To match the background of the button to a Web page with a varied background, click Make the button a GIF image and use a transparent background.

Set the size

On the Image tab, do one or both of the following:

To set the height and width of a button, in the Height and Width boxes, type or select the pixel values that you want.
To maintain the aspect ratio of the button, select the Maintain proportions check box.

Set the behavior

On the Image tab, do one or more of the following:

To display the button differently when a site visitor rests the mouse pointer on it, select the Create hover image check box.
To display the button differently when a site visitor clicks it, select the Create pressed image check box.
To load the images for the hover and clicked states of the button as the rest of the page loads, select the Preload button images check box.

Back

To Exercise

Next