Page 35
7.4 Masthead, Page Title, & Footer Tabs
Like the Text tab, the Masthead, Footer, and page Title tabs are also divided into two
subsections: Properties & Borders. The Borders section behaves exactly the same as it
does for the Text tab, and performs the same operations. Therefore we will not repeat
the Borders features here, and will focus only on the editing options available in the
Properties section for these three elements. To learn about using the options in the
Borders interface, you can refer back to the Borders instructions for the Text Tab, as
they also apply directly to the Masthead, Footer, and Page Title elements.
───────────────────────────────────────
Masthead & Title Tabs
The Properties for the Masthead and page Title offer the same options and hence,
both will be covered here at the same time. Click the Masthead tab to view the editing
options. Then click the Title tab to see that the options are the same. The editing
options under the Masthead and Title tabs allow you to edit the following properties:
Position and Size of the Masthead and Title Boxes
You can position and resize these boxes by either grabbing them with your mouse in
the Layout viewer window, or by using the spinbox controls to move them over, up,
down, or to adjust them for width and height. To move the boxes from within the layout
window, select the box (or corresponding tab) to activate the grab handle box. Select
the box with your mouse and drag it to a new position. Select the grab handles with
your mouse to resize the box. Alternatively, click on the spin box controls under the
Position and Size section of the interface to adjust the position and increase or
decrease the dimensions of the box.
Edit the Font used for the Masthead and Page Title Text
You can edit the text you previously input while in the Content window for font type,
size, color, alignment, as well as underline, italicize and/or bold the text. The Font
section contains a pop up list of available fonts in ShutterBug. Click on the pop up
button to reveal the list and select the desired font type to change it. Increase or
decrease the font size by clicking on the font sizing spin box control. Click the color well
to open the color palette and select the desired color for your font. Select from the
icons to underline, italicize, or bold the text, as well as to left, center, or right align the
text within the box. The inside margins under the Borders section can be adjusted to
move the text in from the edges of box.
───────────────────────────────────────
Footer Tab
The Footer tab contains the tools for editing the footer text that you input while in the
Content window. You can edit the font, edit the links, reposition and resize the footer
box on the page, as well as offset the footer box from the content in the body of your
page. The editing options under the footer tab allow you to edit the following
properties:
Position and Size of the Footer Box
Clicking the pop up button at the top left corner of the Properties interface, will reveal
two main options for positioning the Footer box relative to the other content on your
page: Bottom of Page and Absolute.
Bottom of Page: The Bottom of Page option will automatically move the footer box to
the bottom of the page, positioned after all of your content and the other elements
(text, photo albums, slideshows, masthead, page title, xtra boxes). The "bottom" of the
page is determined by where your content ends. This option will always make the
footer automatically position itself beneath your content. If you add more text or photos
making the height of the content taller or larger, it will automatically push the footer
down to adjust for the increase in content, ensuring the footer does not end up
overlapping or lying on top of your content. This saves you the step of manually
moving the footer box around each time you add more content.
Absolute: The Absolute option will release the footer box from any automatic
positioning. When you select Absolute, the footer box will jump to the top of the page,
above all of your other content, including the masthead and page title. You can grab
the footer box with your mouse and move it to wherever you want on the page,
including overlapping other elements if you so desire. Selecting the Absolute option
means that the footer box will not automatically adjust when more content is added.
You will have to reposition it yourself or select Bottom of Page to make it jump back
down to the end of the content. Note: The primary purpose of Absolute positioning,
born from various user requests, is the ability to place the footer at the top of the page
or to use the box for some other purpose such as a subtitle that is separated from the
masthead and page title and appears on every page the same way the masthead
does.
Offset Value: The Offset control allows you to increase or decrease the amount of
space between the footer box and the bottom of your content (when set to Bottom of
Page) or the amount of space between the footer and the very top of the page (when
set to Absolute). When set to Bottom of Page, Offset refers to the footer box's position
relative to the end of the content in the body of your page. It will be offset by the
amount of pixels you select by increasing or decreasing the offset value, and will
always jump down by that value as the content grows taller. When set to Absolute, the
Offset value is the number of pixels the footer box is from the top of the page. It will
always stay there regardless of where the other content and elements are, unless you
move it yourself or change the offset value.
Other Sizing & Positioning Controls: The Left, Width, & Height controls are like all
the other sizing and positioning controls for the other elements. They allow you to
move and resize the footer box by clicking the spin box controls to increase or
decrease the values. Alternatively, you can grab the footer box in the viewer window
and reposition it by dragging and dropping it to a new position on the page, and select
the grab handles with your mouse to resize it.
Font & Link Editing Options for the Footer Text
Like the other elements, the footer text can be edited for font type, size, and color, as
well as for the colors of any linked text.
Edit the Font: Click the pop up button to select the font type from the pop up list of
available fonts. Increase or decrease the value in the font size controller to change the
font size, and click the color well to change the font color.
Edit the Link Colors: The Links section lets you select the font colors for the different
states of any linked text in your footer. You can make the linked text be distinct or
stand out from the normal text state by giving it a different color and/or by underlining
it. The Normal color is the color of the linked text in its normal or idle state. The Hover
color is the color that will display on the text when someone rolls the mouse over it.
The Click color is the color that will display when the linked text is clicked with the
mouse. Click each color well to select the desired font color for the corresponding text
state.
Include the "Created With" Badge on Your Site: If you would like to include the
Created With ShutterBug badge on your website, simply click the check box labeled
"Show Created With" Badge. The badge will be automatically centered at the bottom of
the page below all of your other content (scroll down to the footer of this manual to see
the position). The badge does not display in Preview mode, but you can see what it
looks like below, after the footer of this page. To remove the badge from your website,
uncheck the box and upload the change.
───────────────────────────────────────
