Page 25

6.1 Using the Layout Tools

The Layout window is the place to design anything and everything on your web site,

and really exercise the true flexibility of ShutterBug. You can create your very own

unique look and feel, designing as little or as much as you want. Anything you create is

equivalent to a newly created theme. However, you cannot save your new theme to

the library in ShutterBug. To save your themes, you must export them to your

computer for storage and future use. This topic is covered in Chapter 8. Importing &

───────────────────────────────────────

Get Acquainted with the Interface

The Layout window is divided into three sections: page and template customization at

the top, web page viewer window in the middle, and the editing tools at the bottom.

This chapter focuses on the viewer window and editing tools (the features at the top of

the window are discussed later in Chapter 7). Recall that the layout window is

collapsable so you can hide the tools along the bottom and gain more work space in

the viewer window.

The bottom third of the window contains the editing tools for each element in your

website. There are eight tabs that contain the tools available for the corresponding

element. Elements include: Page, Text Contents, Masthead, Footer, Page Title,

Navigation, Photo Album, and Slideshow. All of these elements can be easily edited for

borders, inside margins, fonts, size, positioning, link colors, and other traits that are

unique to each element. Each tab is divided into two subsections: Properties &

Borders. The layout window is also the place to set the page background for your web

pages. The viewer window reflects the changes as they are made, as well as offering

mouse control to move and resize elements on the fly.

───────────────────────────────────────

Before you can view and use the editing tools for an element, you must first select the

element. The interface offers two different ways of selecting each element:

1. Click the tab for the element you want to edit. The element will be selected in the

viewer window with a grab handle box. The available editing tools will be revealed

in the pane below the tabs.

2. Alternatively, use your mouse to select the element from within the viewer window.

The corresponding tab will be selected displaying the editing tools in the pane

below the tabs.

The rest of this chapter covers the available editing tools under each tab, how and

what to use them for. If you are looking for a specific element to edit, select from the

navigation menu at the left. Otherwise, go through these pages one at a time, in the

same order as the navigation menu lists them.

───────────────────────────────────────