Note that you can add your URL to a library for later use by clicking the plus sign to the right of the URL text box. In Figure 6-3, a link to a fictitious external website ( ) is referenced. Type a URL address that you want the viewer to go to after selecting this region. Select the item (text or graphics), right-click (Windows) or Control-click (Mac) the selected item, and choose Insert Hotspot from the contextual menu.Īfter you define a hotspot, you can define the location (typically, a web page) that you want the hotspot to link to. Click and hold down the Rectangle Hotspot tool to see that you have a choice of creating a rectangular, circular, or polygon hotspot.įigure 6-2:Click and drag over an area with the Hotspot tool to incorporate a hyperlink into your Fireworks document. Select the Hotspot tool in the Web section of the Tools panel and click and drag over the part of the image you want to create as the linked part of the image, as shown in Figure 6-2. You can define a hotspot by using either of two methods: To link text or a graphic to a web URL, you must first define it as a hotspot.
WEB SLICES HOW TO
In Chapter 7 of this minibook, you find out how to create buttons that interact with the user. In this section, you see how to create a hotspot - essentially, a simple link from text or a graphic to a URL (Universal Resource Locator) on the web.
Keep web components separate: Use the Web Layer to keep track of hotspots and slices as well as control the visibility of those items.įireworks gives you lots of ways to take advantage of hyperlinks.
Organize layers: Create appropriately named layers to house related sublayers, thereby gaining the ability to move, copy, or delete multiple layers at the same time. Rename layers: By double-clicking the layer or sublayer name, you can rename the layer, which can be a huge help later when you’re trying to find a specific object. Send objects forward and backward: Drag individual layers and sublayers to arrange objects on those layers in front of or behind each other. Hide and show layers: Click the Visibility (Eye) icon to hide or show a layer or sublayer. Here are just some of the things you can do in the Layers panel to organize your artwork better: (See Figure 6-1.)įigure 6-1: The Layers panel in Fireworks. Note that if you open an image from Photoshop that already has a Background layer, it carries through into Fireworks. The default Layer 1 includes sublayers that are created automatically for every object you add to the Fireworks canvas. In Figure 6-1, you see the links in the Web Layer section.
WEB SLICES CODE
The Web Layer serves as a repository for anything code related, such as links and slices. To see the Layers panel, choose Window⇒Layers.įigure 6-1 shows the two main components of the Layers panel: Read on to find out how to take advantage of Fireworks layers. In this chapter, you find out how Fireworks uses layers and then create navigational links by using the Slice feature.Įven if you’re an Adobe Photoshop or Illustrator user, the Layers panel in Fireworks may be somewhat of a mystery because it works differently from the way you might expect. By using layers in Fireworks, you can make those links dynamic and visually interesting. You can create a link by using a button, text, or even a move of the mouse pointer. Hyperlinking with hotspots and image mapsĮxporting images and HTML as tables or CSSĪ simple method for organizing content and making a website dynamic is the use of hyperlinks, simple links from one location of a site to another. Adobe Creative Suite 6 Design and Web Premium All-in-One For Dummies (2012) Book VIII Fireworks CS6 Chapter 6: Hotspots, Slices, and CSS Layouts
0 kommentar(er)
