website design tutorials, online income and website design resources

Add a hotspot to a graphic

You can add hotspots to graphics such as pictures and animated GIFs. A hotspot is an invisible region on a graphic to which you have assigned a hyperlink. When a site visitor clicks the region, the destination of the hyperlink is displayed in the Web browser. In Microsoft FrontPage, hotspots can be shaped as rectangles, circles, or polygons.

A graphic with one or more hotspots is called an image map. The image map usually gives cues about where it should be clicked. For example, a car manufacturer's Web site could use an image map of its new cars: when a site visitor clicks a car, a page with a detailed description of the car is displayed.

Image map example

  1. In Page view, click the picture.
  2. On the Pictures toolbar, click the Hotspot button corresponding to the shape you want:
    • Rectangular Hotspot Rectangular Hotspot button
    • Circular Hotspot Circular Hotspot button
    • Polygon Hotspot Polygon Hotspot button
  3. On the graphic, draw a rectangle, circle, or polygon, depending on the shape you chose. To draw a polygon, click where you want the first corner of the polygon to be, click to place each corner of the polygon, and then double-click to finish it.

    When you release the mouse button, the Create Hyperlink dialog box opens.

  4. Specify the destination for the hotspot:
    • If the destination is in a web, browse to the web and folder that contains the page, select it, and then click OK.
    • If the destination is on your local network, click File File button, browse to the page you want from your local network, and then click OK.
    • If the destination is on the World Wide Web, click World Wide Web World Wide Web button. In your Web browser, browse to the page that you want, and then press ALT+TAB to switch back to Microsoft FrontPage. The location of the page you visited will be displayed in the URL box. Click OK.
    • If you want to create an e-mail message when a site visitor clicks the graphic, click E-Mail E-Mail button. Type the e-mail address to which you want the message sent, and then click OK.

Add a text hotspot to a graphic

You can add text hotspots to graphics such as pictures, animated GIFs, and videos. A text hotspot is a string of text that you have placed on a graphic and assigned a hyperlink. When a site visitor clicks the text, the destination of the hyperlink is displayed in the Web browser.

  1. In Page view, click the picture.
  2. On the Pictures toolbar, click Text Text button.
  3. In the text box that is now displayed on the graphic, type the text.

    You can:

    • Resize the text box by clicking and dragging the handles.
    • Move the text box by clicking and dragging a border.
  4. To set the hyperlink for the text, double-click an edge of the text box.
  5. Specify the destination for the hotspot:
    • If the destination is in a web, browse to the web and folder that contains the page, select it, and then click OK.
    • If the destination is on your local network, click File File button, browse to the page you want from your local network, and then click OK.
    • If the destination is on the World Wide Web, click World Wide Web World Wide Web button. In your Web browser, browse to the page that you want, and then press ALT+TAB to switch back to Microsoft FrontPage. The location of the page you visited will be displayed in the URL box. Click OK.
    • If you want to create an e-mail message when a site visitor clicks the graphic, click E-Mail E-Mail button. Type the e-mail address to which you want the message sent, and then click OK.

Highlight the hotspots on a graphic

You can highlight hotspots on a graphic, for example if it's hard for you to see the hotspot outlines that are superimposed on the graphic.

  1. In Page view, click the graphic.
  2. On the Pictures toolbar, click Highlight Hotspots Highlight Hotspots button. Click this button again to display the graphic without highlighting

Edit, move, resize, or delete a hotspot on a graphic

You can edit the URL of a hotspot, or move, resize, or delete it.

  1. In Page view, click the graphic to view the hotspots.
  2. Click a hotspot.
    • To edit the URL for a hotspot, double-click it.
    • To move the hotspot, click the hotspot and drag it to a new position.
    • To resize the hotspot, click and drag the selection handles. Or, press the arrow keys.
    • To delete a hotspot, press DELETE.

Tip   When moving a hotspot, you can return a hotspot to its original position while you are still clicking the hotspot by pressing ESC.

Website Design by Doug WalkerPageResource.com Free Site Design Tips and Tutorials at thesitewizard.com Free Web Templates ScriptsBank.com