Page 10
2.3 Set Up General Website Properties
Before you begin adding any content in the Content window, take a moment to create
a few properties that pertain to your whole website; or in other words, properties that
are constant across every page in your site: the Masthead and Footer text. All text and
links entered in the content window can be easily changed or deleted in the future, so
don't worry if you aren't sure what you want to include for these items just yet, you can
change them at any time.
The Masthead is the title or name of your website and shows up on every page in your
site (note that the masthead is not the title of your individual web pages). It is most
commonly used at the top of your website (hence its name), but can be placed
anywhere on the page. This could be a Company or Business name, a personal name
such as "My Online Gallery", or your domain name such as mydomainname.com, or
whatever you would like to call your site. The masthead can also include a link such as
linking it to the home page when someone clicks on it, or linking to another website.
The Footer is the text that displays at the bottom of every page in your website and is
also the same for every page. It most commonly includes copyright information,
contact information, and sometimes a link to the parent site or another website, but
you can include whatever information you want to.
Both the Masthead and Footer can be absent of text and only include an image if
desired. For example, you may only want to include a clickable logo for your masthead
without any text. Either way, it's all editable and can be changed at any time, very
quickly and easily.
───────────────────────────────────────
Creating the Masthead Text
To assign a name to your website (the masthead), follow these 4 steps:
1. Click the Content tab to reveal the content window.
2. The Navigation pane on the left will contain a heading called Website at the very top
and is the starting point for your site. Use your mouse to select the Website
heading.
3. The interface on the mid-right side of the Content window will display the areas for
setting several different properties. For now, focus on the Masthead text field at the
top of the interface.
4. Go to the Masthead text field and click inside the field with your mouse to input the
masthead name. By default this field will contain the words "My Online Gallery."
Note: The fonts and alignment of the masthead text can all be edited later in
the Layout window. If you want to include a logo in the masthead and no text,
just leave the Masthead text field blank - you can drop a logo graphic into the
masthead box later in the Layout window.
Hyperlinking the Masthead
You can include a link in your masthead, even if you don’t use any text, and just plan to
use an image. This link will be included on every page in your site. To insert a link into
your masthead, follow these 4 steps:
1. In the same window as above, go to the text field just below your masthead text,
called Clicking Masthead navigates to:
2. You can link the masthead to another page in your website or link it to an external
website. Enter the URL of the page or website you want the Masthead to link to.
3. To link the masthead to a different website, include the http:// prefix like this:
http://www.somewebsite.com
4. To link the masthead to another page in your ShutterBug website, drop the prefix
and enter the page name like this: index.html or mypagename.html
───────────────────────────────────────
Creating & Editing the Footer Text
The Footer text box is located just below the Masthead text and link fields, as shown in
the picture below. To add the footer text and edit it, follow these 3 steps:
1. Click in the Footer text field area and enter the text you would like to have in your
website's footer, such as copyright information or any other information you want to
include.
2. To edit the footer text for alignment, click anywhere on the text (you don't have to
highlight it), and choose from the icons: left, center, or right align.
3. To bold, italicize or underline some, or all, of the footer text, select and highlight the
desired text with your mouse. Then choose from the icons to underline ( U ),
italicize ( I ), or bold ( B ) the selected text. Unlike the alignment, you must have the
text highlighted in order for the text to change.
Hyperlinking the Footer Text
You can easily include a link in some of your footer text. You can link to another page
in your website, you can link to an external website, link to an external file, and include
email links as well. Take note of the new "Easy" button, which makes it even easier
than before to add links. Email links can be encrypted to protect the email address
from being harvested by spam bots on the Internet.
To link some footer text to another page in your website, follow these 5 steps:
1. Go to the footer text field box and click anywhere on the desired text that you want
to link. You do not have to highlight the entire word, unless it is more than one word
that you wish to link.
2. With the text selected, click the Easy button located just below the footer text field. A
panel will slide out from the top of the interface.
3. Click the pop up button to reveal the list of options. Choose Page in ShutterBug site
from the list.
4. Then select the page you want to link to and click OK to return to the main window.
5. You will see the page link in the Link: input field and your text will now be linked to
the selected page.
Note: Alternatively, you can manually input the page link instead of using the Easy
button. But why not give your hands and fingers a rest since it's so easy?!
To link some footer text to an external website, follow these 4 steps:
1. Go to the footer text field box and click anywhere on the desired text that you want
to link. You do not have to highlight the entire word, unless it is more than one word
that you wish to link.
2. With the text selected, input the full URL of the web page you want to link to, into
the Link: text field. Be sure to include the http:// prefix. For example -
http://www.somewebsite.com or http://www.somewebsite.com/about.html.
3. To have the link open in a new browser window, click the checkbox located to the
right of the link text field, called New Window. To have it open in the same window,
leave the check box blank.
4. Your selected text will now be linked to the chosen external website.
To add an email link to some footer text, follow these 5 steps:
1. Go to the footer text field box and click anywhere on the desired text in which you
want to insert an email link. You do not have to highlight the entire word, unless it is
more than one word that you wish to link.
2. With the text selected, click the Easy button located just below the footer text field. A
panel will slide out from the top of the interface.
3. Click the pop up button to reveal the list of options. Choose Email Address from the
list.
4. A text input field will appear. Simply input the email address into the text field. Do
not include the "mailto:" prefix. ShutterBug will automatically encrypt the address to
protect it from being harvested by spam bots on the Internet. Click OK to return to
the main window.
5. The linked email address will now be inserted into your text. You will see the email
link in the Link: input field. Don't be alarmed if it looks like a long blurb of gibberish.
This is the encryption code that ShutterBug has added to the email address, so
don't remove it or try to modify it in any way.
Note: Encrypting your email address today does not protect against any spam bots
that may have already harvested the address, but it does protect against future
harvesting.
Note: Alternatively, you can still manually input the email link
(mailto:me@mydomain.com) instead of using the Easy button. But why would you want
to do that? It will not be encrypted and leaves the email address open to harvesting.
To link some footer text to an external file, follow these 6 steps:
1. Go to the footer text field box and click anywhere on the desired text that you want
to link. You do not have to highlight the entire word, unless it is more than one word
that you wish to link.
2. With the text selected, click the Easy button located just below the footer text field. A
panel will slide out from the top of the interface.
3. Click the pop up button to reveal the list of options. Choose External File from the
list.
4. A list of files, which you've added to your site package for upload to the web, will
appear. These are the files that you've added in the Files window located in your
Navigation list (covered in Chapter 3, Section 3.7).
5. Select the file you want to link the text to and click OK to return to the main window.
6. You will see the file name in the Link: input field and your text will now be linked to
the selected file.
───────────────────────────────────────