2 Domain Hosting

An image map is an image that contains one or more clickable sections, called hotspots, which function as hyperlinks. In Dreamweaver, you can create oval, rectangular, or polygonal hotspots. You can also edit hotspots by selecting, moving, and deleting them, or by changing a hyperlink.

This document covers the following techniques for working with hotspots:

• Creating Hotspots

• Editing Hotspots

For more information on links, see Linking to Pages in Your Collection and Linking to Internet Resources. For image map terminology and examples, please refer to Creating Clickable Images with Image Maps. A good example of hotspots is the Campus Virtual Tour, which provides a map of the campus that links to all of the campus buildings at UW-Eau Claire.

Creating Hotspots

In Dreamweaver, you can create three different types of hotspots: oval, rectangular, and polygonal.

Creating Oval or Rectangular Hotspots

This procedure will allow you to create oval or rectangular hotspots. For example, if a portion of an image contains an oval image such as a basketball, an oval hotspot is the best choice. A rectangular hotspot can be used for portions of images that resemble a rectangle or square.

1. Select the image that will contain the hotspot
   The Image Properties pane appears.
   

2. Click OVAL HOTSPOT TOOL or RECTANGULAR HOTSPOT TOOL

3. Position the pointer over the selected image

4. Click and drag the pointer to create the desired shape and size of the hotspot
   The Hotspot Properties pane appears.
   

5. To assign a URL to the hotspot, in the Link text box, type the correct link information
   OR
   To browse for a select the file, click BROWSE FOR FILE
   OR
   To point to the file, click POINT TO FILE and drag to the correct file in the Files pane
   The hotspot is created.

Creating Polygonal Hotspots

This procedure allows you to create an odd-shaped hotspot. For example, if your image is a map of the United States, each state would be an individual hotspot with a hyperlink assigned to it. Thus, the Polygon Hotspot Tool is your best choice for creating precisely shaped hotspots.

1. Select the image that will contain the hotspot
   The Image Properties pane appears.
   

2. Click POLYGON HOTSPOT TOOL

3. Position the pointer over the selected image

4. On the image, click where you want the first corner of the polygonal hotspot to start

5. Continue placing additional corners by clicking elsewhere on the image
   The Hotspot Properties pane appears.
   

6. To assign a URL to the hotspot, in the Link text box, type the correct link information
   OR
   To browse for and select the file, click BROWSE FOR FILE
   OR
   To point to the file, click POINT TO FILEand drag to the correct file in the Files pane
   The polygonal hotspot is created.

Editing Hotspots

After you have created a hotspot, you can manipulate it in a variety of ways, including: selecting a hotspot, moving a hotspot, deleting a hotspot, and changing a hotspot's hyperlink.

Selecting a Hotspot

Selecting hotspots is the first step in editing them. You must select a hotspot before you can change it.

1. Click the image containing the hotspot you wish to select

2. To select a hotspot, click it once
   Sizing handles will appear on the sides and corners of the hotspot.
   NOTE: To select more than one hotspot, click each hotspot while pressing [Shift].

Moving a Hotspot

It is easy to move hotspots to new locations within an image.

1. Select the hotspot you want to move
   Sizing handles will appear on the sides and corners of the hotspot.

2. Click and drag within the hotspot to move it to the new location
   HINT: Do not click the sizing handles.

Deleting a Hotspot

If you have an image with a hotspot you no longer want or need, it is easy to delete it.

1. Select the hotspot you want to delete
   Sizing handles will appear on the sides and corners of the hotspot.

2. Press [Delete]

Changing a Hotspot's Hyperlink

Sometimes it is necessary to change the hyperlink for an existing hotspot.

1. Select the hotspot that contains the hyperlink you want to change
   Sizing handles will appear on the sides and corners of the hotspot. The Hotspot Properties pane appears.

2. To assign a new hyperlink to the hotspot, in the Link text box, type the correct link information
   OR
   To browse for and select the file, click BROWSE FOR FILE
   OR
   To point to the file, click POINT TO FILEand drag to the correct file in the Files pane
   The link is updated.