managing personal web pages in microsoft frontpage 2003
Post on 21-Jan-2017
219 Views
Preview:
TRANSCRIPT
1
IT Services
Managing Personal Web Pages Using Microsoft FrontPage
2003
Contents:
Introduction
Creating a Source and Publish Folder
Creating a Web
Publishing the Web
o Setting File and Directory Permissions
Different Views
o Web Pages View
o Folders View
o Navigation View
o Hyperlinks View
o Reports View
o Tasks View
Shared Borders and Navigation Bars
o Adding a Navigation Button
Themes
Republishing the Web
Further Tasks
Opening a Web
Logging Out
This document is an introduction to managing personal web pages on the University system.
Before attempting these notes you should have worked through the document entitled Creating
Personal Web Pages in Microsoft FrontPage or have your own existing web pages stored in My
Documents (your Unix home directory, drive N: on IT Services public PCs).
Introduction
Microsoft FrontPage can be used not just to create web pages but also to control them. These notes
cover its second function and show you how to manage your personal web pages whether they were
created using FrontPage or other software such as Microsoft Word.
The notes assume you have an existing personal web site, here at the University (for example, if you
took the Creating Personal Web Pages class, you would have created one). If you do not have the
necessary files then you can download a set of files via the link provided here (when prompted: [Run]
the file - do this 2 times; change the install path to n:\ and click [Install]; a public_html folder should
have been created under your_username on 'ndrive' (N:)).
2
Creating a Source and Publish Folder
Though it is not strictly necessary, it's good practice to have both a development and published web
site. This allows you to mess around with your web pages without affecting the information on your
published pages. Only when you are happy that your new developments are working satisfactorily do
you publish them worldwide. Having separate source and publish folders also acts as a back-up, just
in case you accidentally delete a file (or part of one) when modifying your site.
You should already have a set of pages in your public_html folder. These will become your source
and a new folder for published pages will be created:
1. Login as usual by entering your username and password
2. View your current files by clicking on [start], My Computer and double clicking on the N:
drive 3. Right click on the public_html folder
4. Select Rename then type in the new name for the folder source and press <Enter>
5. Now open the File menu, select New then Folder
6. Type public_html to rename the folder then press <Enter>
7. End by closing the My Computer window - click on the [Close] button
Creating a Web
The management tools in Microsoft FrontPage require that all the files used on your personal pages
are bundled together in a web. When you create a web, FrontPage generates additional (mainly
hidden) files and folders to manage your personal files. Once established, you can rename or move
files between folders within the web and FrontPage will automatically update the hyperlinks for you.
FrontPage can also check for broken hyperlinks or for orphaned files - ones which do not have a link
to them anywhere within your web.
1. Open the start menu, choose All Programs then Microsoft Office and finally Microsoft
Office FrontPage 2003 2. In the Getting Started Task Pane on the right, click on the link Create a new page or site...
under the Open heading
3. In the New Task Pane on the right, click on the link More Web site templates... under the
New Web site heading
The Web Site Templates window appears:
4. Click on the Empty Web Site icon/picture on the left-hand side of the window to select this
5. Click on the [Browse...] button under Specify the location of the new Web site:
6. In the New Web Site Location window, click on the [My Computer] button on the left
3
7. In the list that appears, double click on your_username on 'ndrive' (N:)
8. Select the folder source then click on [Open]
9. Back in the Web Site Templates window, it should be showing N:\source\ under Specify the
location of the new Web site:
10. Click on [OK]
A temporary window appears as FrontPage creates the new web, followed by the following window,
listing the component files in the web. Note the creation of two additional folders: images (which can
be used for storing your pictures) and _private (this and a further two folders, _vti_cnf and _vti_pvt,
are used by FrontPage to manage your web).
Publishing the Web
To publish the web into the public_html folder previously created:
1. Open the File menu and select Publish Site... (or click on the [Publish Site] button -
towards the left of the Standard toolbar)
2. A Remote Web Site Properties window appears
3. Click on the radio button (circle) next to File System
4. Click on [Browse...] next to the box under Remote Web site location:
4
5. The New Publish Location window appears, click on [My Computer] on the left
6. In the list that appears, double click on your_username on 'ndrive' (N:)
7. Select the folder public_html then click on [Open] - it should be showing N:\public_html
under Remote Web site location:
8. Click on [OK] to confirm the published web location
The first time you publish a new window will appear, stating that the web doesn't yet exist and asking
if you would like to create it. On future occasions this message won't be displayed.
9. Press <Enter> or click on [Yes] to confirm this
The main window changes to show the files currently in your source Local Web site on the left-hand
side and in your public_html Remote Web site on the right-hand side. This is the Remote Web site
View. Currently, all the files (not folders) in the source Local Web site have an arrow in front of them
indicating that they will all be published.
5
10. Press <Enter> or click on the [Publish Web site] button in the bottom right-hand corner of
the window
A little graphic is shown while the pages are copied from the source folder to public_html - this
shouldn't take too long. The Status in the bottom left-hand corner of the window should show you that
the web site published successfully. There are also some links in the Status area that let you view your
publish log file and your Remote Web site, and Open your Remote Web site in FrontPage.
11. Click on the View your publish log file link - this will open up the log in Internet Explorer
Note the Show only: button. This lets you choose different components in the Publish Log.
12. This particular report shows which files were copied over and when the web was published -
[Close] the Internet Explorer window
Unfortunately, the View your Remote Web site link will only show the icons of the files and folders
on the Remote Web site rather than a web page with links.
It is not usually advisable to Open your Remote Web site in FrontPage as you should work and
change things only in the source or Local Web site.
Setting File and Directory Permissions
Because you now have a new public_html folder, your web site has lost its access permissions. These
still exist on the old folder (now called source) but the University Web Server doesn't recognise this
folder as the source of your web pages. You must reset permissions to the public_html folder on the
main computer, as you did when you first published your pages on the Creating Personal Web Pages
class. If you did not come to this class then please refer to those notes.
1. Open the Windows start menu, choose All Programs followed by Communications and
finally Connect to Main (Unix)
2. In the PuTTY window, at the login: prompt, type in your_username (press <Enter>) - if you
type this in wrong then press <Ctrl d> to close the PuTTY window and repeat the previous
step 1
3. At the Password: prompt, type in your password (press <Enter>)
4. At the main% prompt, type cd public_html (press <Enter>)
5. Type publish (press <Enter>)
6. Hide the PuTTY window by clicking on the [Minimize] button
7. Click on the Internet Explorer icon in the Quick Launch area to the right of [start] in the
bottom left-hand corner of the screen (if this is not showing, then click on [start] followed by
Internet at the top of the start menu)
8. Click on the University of Reading shield at the top of the Home Page
9. Change the Address: to http://www.reading.ac.uk/~your_username and press <Enter>
10. Hopefully, your personal home page should now be showing - test out your links, if you like,
then [Minimize] the Internet Explorer window
Different Views
Along the bottom of the Microsoft FrontPage window are buttons that give you different views. The
sections that follow deal with each of these views in turn, showing you how they can be used to
manage your web site. As the mouse cursor is pointed to each view in turn, a help tip is displayed:
6
Folders - organize files and folders
Remote Web site - synchronise files between this web site and a remote web site (this view
was seen when publishing above)
Reports - analyse your web site and manage its contents
Navigation - design the web site's structure for navigation and link bars
Hyperlinks - view hyperlinks to and from any page
Tasks - create and manage tasks
Web Page Views
These views are not explained above, but they are what you used when creating your original pages.
As such, they were fully explored in the previous notes on Creating Personal Home Pages Using
Microsoft FrontPage. To access your pages for editing:
1. In the Folder List panel on the left-hand side, double click on the file to be edited - e.g.
index.htm 2. Move between Design, Split, Code and Preview as required by clicking on the relevant tab
3. In Design View hold down <Ctrl> and click on the My Interests hyperlink to open the file
interests.htm for editing
At the top of the web page, you should now see some tabs for the open index.htm and interests.htm
files.
4. There is also a tab called [Web Site] - click on this tab now
Folders View
The first button in the Views panel at the bottom of the FrontPage window is labelled Folders. As you
will see in a minute, this acts very much like Windows Explorer in that it allows you to move files
around, create/delete files and rename them. Whenever you move or rename a file, Frontpage
automatically updates any references to that file within the same web.
1. Click on the [Folders] button in the Views panel
The right-hand part of the window now displays the full details of your files - their size, when they
were last modified, etc. As in Windows Explorer you can sort the files on whichever attribute you
choose simply by clicking on the column heading. Clicking on the same heading a second time
reverses the sort order.
Begin by moving your picture files into the images folder. It's good practice to keep your images and
text separate, either storing all image files in a single folder or (for a big web) by having separate
image folders for the different parts of the web.
2. Drag and drop each image (.gif and .wmf) file in turn into the images folder (point to the file,
hold down the mouse button and drag the file to the folder)
A window briefly appears for each image stating that, for example, contact.gif is being renamed
images/contact.gif. You can, by the way, select a group of files (use <Ctrl> click for single files,
<Shift> click for a range) and move them in one go. In a minute you'll verify that the raw html or code
has been changed in your original files; first, try renaming a file:
7
3. Right click on the file interests.htm and choose Rename
4. Type hobbies.htm as the new name for your Interests Page and press <Enter>
You are now warned that this page should be updated so that the hyperlinks are not broken.
5. Press <Enter> for [Yes] to update the hyperlinks to this page
To see what's been happening, have a look at the html:
6. Click on the [index.htm] tab just below the toolbars
7. Click on the [Split] tab at the bottom of the page
8. Look for any image in the bottom window and click on it - in the top window, the code should
now include images/ to reflect your moving the file into the images folder
9. End by clicking on the [Web Site] tab at the top to return to the Folders view
Another command that is available from the shortcut menu which appears when you right click on a
file in Folders View is Publish Selected Files.... Try this next:
10. <Ctrl> click to select the modified files: index.htm, hobbies.htm and the images folder
11. Right click on the selected files and choose Publish Selected Files... - reply [Yes] if you are
prompted to overwrite a file
Whenever you re-publish to your public_html folder, you may have to reset the access permissions.
This will certainly be true if you add new files or rename existing ones (as here).
12. Move to Internet Explorer on the Task Bar and [Refresh] your page (or use <F5>) - you will
find that the contact image at the bottom of the index page is not showing. If you click on the
My Interests link, you will find that access to this page is forbidden
13. Move to the telnet window (C:\) on the Task Bar and type publish - press <Enter>
14. Hide the telnet window by clicking on the [Minimize] button
15. In the Internet Explorer window [Refresh] your page (or use <F5>) once more - it should now
be working again
16. Hide the Internet Explorer window by clicking on the [Minimize] button
Navigation View
Skipping over Remote Web site View (which will be looked at again when republishing is done) and
Reports View for the moment, the next icon, Navigation, repeats many of the functions available
within Folders View but in friendlier way. It also helps you visualise the overall structure of the web
and is the best way both to create new pages and reposition existing ones.
1. Click on the [Navigation] button in the Views panel
The right-hand pane of the screen shows a box representing your Home Page, with a little house
symbol denoting this. You use this area to create a diagram showing the structure of your web - how
the files relate to each other. Most people arrange their site hierarchically, with the home page at the
top and child (dependent) pages underneath. These in turn may have their own child pages, creating a
structure like a Family Tree.
2. Drag the file hobbies.htm from the Folder List to a position immediately below the Home
Page box - a little join line appears
3. Release the mouse button to establish the link
4. Click on the [-] button at the foot of the Home Page box to close this part of the web
8
5. Click on the [+] button which is now showing to reopen the link
Currently, you have no other pages to add to the tree but you can also use Navigation View to create
new (empty) pages, ready for you to fill with content.
6. Right click on the Home Page box and choose New then Page
A new page is created, called New Page 1.
7. Right click on New Page 1 and choose Rename
8. Type My Family then press <Enter>
9. Repeat steps 6 to 8 for a second new page, calling this one My Friends
10. Repeat steps 6 to 8 again but this time, right click on the My Friends box to create a page
called Photos under My Friends
When you rename a page in the structure you are changing the Page Title. As you will see later, this is
used in shared borders and navigation bars.
Hopefully, you created your new files in the correct places so that the structure looks like this:
Don't worry if your tree is slightly different, you are now going to learn how to move files around
within Navigation View. First, you need to refresh the Folder List to show the added files.
Tip: Occasionally FrontPage seems to lose track of what's happening. If you create and rename a file
then you can't move it until the Folder List is updated.
11. From the View menu, choose [Refresh] (or press <F5>) to see your new files in the Folder
List
12. In the right-hand pane, point the mouse cursor to the Photos box then hold down the mouse
button and drag the box from its current position to below the My Family box
13. When the join line moves to My Family, release the mouse button to confirm the file's new
position in the structure
You can also copy and paste files within Navigation View:
14. Right click on the Photos box and choose Copy
15. Right click on the My Friends box and choose Paste - you should now have a Copy of Photos
box under My Friends
16. Right click on the new box and Rename it Photos - press <Enter>
9
Though both files have the same Page Title, the filenames are different. To see this:
17. From the View menu, choose [Refresh] (or press <F5>) to refresh the Folder List
Tip: It's a good idea to rename your files from the default given them by FrontPage as you create
them. It's then less likely you will forget which is which!
18. Right click on photos.htm in the Folder List, select Rename and call it FamilyPhotos.htm -
press <Enter>
19. Repeat step 18 on photos1.htm, calling it FriendsPhotos.htm
You can also create new pages in the Folder List and then add them to the tree later. Folder List also
enables you to create new folders in which to store related files. To do this:
20. Right click on N:\source under Folder List, choose New then Folder
21. Type in the name for the new folder (call this one Friends) then press <Enter>
22. Drag and drop the files my_friends.htm and FriendsPhotos.htm into the new folder
Note: Though you are currently in Navigation View you are not affecting the tree structure - it's as
though you were in Folders View, changing your filestore structure.
One final thing you may need to know about Navigation View is how to remove a file from the
structure. To do this:
23. Right click on the Photos box under My Family and choose Delete
24. Press <Enter> for [OK] to Remove page from the navigation structure
The page will be removed from the tree but remains in Folder List. If you were to carry out step 23
within Folder List then the file would be permanently deleted. To restore your Family Photos page:
25. Click on the [Undo] button or drag FamilyPhotos.htm from the Folder List to its position in
the tree
Hyperlinks View
In the same way that Navigation View gives a graphical representation of the file structure of a web,
Hyperlinks View shows you the hyperlinks from and to your pages. This includes both links to your
own files and external links. Email (mailto) links are also shown.
1. Click on the [Hyperlinks] button in the Views panel (you will probably need to scroll
horizontally)
10
In the right-hand pane, a visual representation of the hyperlinks is shown. This is currently centred on
your Home Page, index.htm (that's the default setting) but any page can be the focus - you simply
select it in the Folder List. The lines connecting one page to another represent the hyperlinks, with
arrowheads denoting the direction of the link.
As you move the mouse cursor over a page in the right-hand panel, further information about the link
is displayed. For example:
2. Move the mouse cursor over the link to the University Home Page (http://www.reading.ac.uk)
and note that this is shown as an External Hyperlink which is Not Verified - you will see in a
moment how to verify your links
Some pages (e.g. hobbies.htm) have + signs attached, indicating that they in turn contain further
hyperlinks.
3. Click on the [+] button attached to hobbies.htm to the right of index.htm
4. To close the opened link, click on the [-] button now attached to hobbies.htm
The default Hyperlinks View displays filenames but excludes images. To see these and display the
more user-friendly Page Titles:
5. Right click in the background in the right-hand panel and select Show Page Titles
6. Right click again and this time choose Hyperlinks to Pictures
7. To return to normal settings (if you want to), repeat steps 5 and 6 to turn off these options
Note that you can also show Repeated Hyperlinks, using the above method, if you have more than
one link from one file to another.
Reports View
In Hyperlinks View you saw that certain links were Not Verified. Checking for broken hyperlinks and
various other useful features are available under Reports View. This is one of the most useful tools
provided by FrontPage.
1. Click on the [Reports] button in the Views panel
The Site Summary window appears:
11
In the left-hand column of the table is a list of the available reports. These are accessed by clicking on
the report name. A new Reporting toolbar should also have appeared just above. The drop-down
arrow attached to the first ([Site Summary]) button on this toolbar can be used to switch between
different reports or to return to the Site Summary.
Begin by exploring which files in your web are currently unreachable:
2. Click on the Unlinked files report - the third in the list
A list of all the new files you created under Navigation View is given. These files are often referred to
as orphans and FrontPage provides this very useful way of identifying them, reminding you that you
have yet to fill in the contents and link them to pages currently accessible.
3. Using the drop-down arrow attached to the first button (now showing as [Unlinked Files]) on
the Reporting toolbar, reselect Site Summary
4. From the Name list, this time choose Hyperlinks
You are now asked whether you would like the hyperlinks verified. Checking that hyperlinks are still
active is one of the biggest problems faced by websites, but FrontPage can do this for you.
5. Press <Enter> for [Yes]
All your hyperlinks should now be shown as OK. If FrontPage identifies a broken hyperlink then you
are informed. To see this, you first need to create an incorrect link on one of your own pages:
6. Click on the [index.htm] tab just above the Reporting toolbar
7. Check you are editing index.htm in Design View
8. Drag through the bulleted link to My Friends then click on the [Insert Hyperlink] button
9. Check you are linking to an [Existing File or Web Page] then type an Address of
my_friends.htm - press <Enter> for [OK]
10. Press <Ctrl S> to [Save] your changes
11. Click on the [Web Site] tab just above the Reporting toolbar
The Broken Hyperlinks report now shows a broken hyperlink - the one you have just added. To correct
this:
12. Right click on the broken hyperlink to my_friends.htm then choose Edit Hyperlink...
You now have the choice of Edit Page, which takes you to Page View (where you can make the
necessary changes either in Design View or Split View), or Browse..., which lets you edit the
hyperlink directly.
13. Click on the [Browse...] button
14. Double click on the Friends folder
15. Choose my_friends.htm then press <Enter> for [OK]
16. Click on [Replace]
In the Broken Hyperlinks report you should find that my_friends.htm is no longer shown as a broken
link.
Note: One set of reports which aren’t available via the Reports button list arrow on the University
system is Usage. This normally gives data on the number of hits to your website etc; however it is not
supported by our server. Such data is available for departments, research groups and clubs (but not
12
personal home pages) at the following address: http://www.webstats.reading.ac.uk/
Tasks View
The final Views panel button is labelled Tasks. This is a useful place to store your own notes about
your web site. You can record changes you have made and create lists of jobs to be done.
1. Click on the [Tasks] button in the Views panel
Currently you have no tasks and a message to that effect appears. To create a task:
2. Open the Edit menu and select Tasks then Add Task... - or right click on the empty
background of the right-hand panel and select the command from the shortcut menu
The following dialog box appears:
Note: If you use the command from the menu, you can open this window from anywhere in
FrontPage - you don't have to be in Tasks View.
3. Start filling in the New Task by typing a Task name: of Photos
4. Ignore the Assigned to: box - this is useful where several people are jointly developing a web
5. Finally, type in a Description: of the task - e.g. Scan in photos of my friends for the
FriendsPhotos page - click on [OK]
You can add further tasks, if you like, to remind yourself of the other jobs which need doing.
FrontPage can automatically generate tasks for you as you create pages, if you turn on the relevant
option. For example, it can remind you to check for missing hyperlinks or spelling errors:
13
6. Open the Tools menu and select Spelling...
The following dialog box appears:
7. Leave Check spelling of: set to Entire web
8. Under Options: turn on the Add a task for each page with misspellings checkbox
9. Press <Enter> for [Start]
A new task will now be created for each page with a spelling mistake.
10. [Close] or [Cancel] the Spelling window
Once a task has been generated you can activate it by right clicking on it. You can then:
Edit task - to add further comments or assign it to someone else, for example
Start Task - to start a task such as a spell check
Mark Complete - change the status of the task to show it has been completed
Delete Task - remove the task from the list
As an example, try out a spelling check:
11. Move back to [Tasks] view and right click on a Fixed Misspelled Words task (hopefully you'll
have one - if not then go back to one of your pages and deliberately make a spelling mistake!)
12. Select Start Task and the spell checker will start up on the selected page
13. Make any necessary corrections (or use [Ignore] if you are checking rubbish text)
14. Press <Enter> for [OK] when the spelling check is complete - note that the spell check took
place where you would normally edit/change the page
15. Press <Ctrl s> to [Save] the corrected version of your page - the following prompt will
appear:
16. Click on the [Yes] button to mark the task as completed
17. Make sure that you close any open files, e.g. index.htm and hobbies.htm (just click on the tab
at the top for the file, and then click on the cross to the far right of the tabs [but not the cross in
the top right-hand corner as this closes down FrontPage])
You are taken back to Tasks View and should find that the Fixed Misspelled Words task has now been
marked as Completed
14
18. To remove the completed task, right click on this task and select Delete Task - press <Enter>
for [Yes]
The task is now removed from the list completely. Some people like to retain completed tasks in the
list to remind them that the job has been done. It's particularly useful if a team of users is working
together on a web site.
Shared Borders and Navigation Bars
Shared borders and navigation bars are features employed by many web sites, including the official
University pages. These are areas at the side (left or right) and top or bottom of web pages which are
reserved for items which you want to appear consistently across your web. Examples might be an
image, such as a photograph of yourself, and a set of navigation buttons giving easy access to other
pages in the web.
You can set up these borders and navigation bars so that they automatically appear on each web page -
rather like headers and footers containing page numbers etc in a Word document. Once they have
been established, they can easily be modified to incorporate extra elements, which then appear on all
the pages.
In FrontPage 2003, you may find that shared borders aren't available by default (Dynamic Web
Templates are now preferred). To check this, click on the Format menu. If the Shared Borders...
option appears dimmed or grey then they are not available and you need to carry out the steps below:
1. Open the Tools menu and choose Page Options...
2. Click on the [Authoring] tab
3. Click in the checkbox next to Author-time Web Components (a tick should appear in the
box) and then click in the checkbox next to Shared Borders
4. Click [OK]
The shared borders should now be ready to apply them.
1. Click on the [Navigation] button in the Views panel
2. In the right-hand pane, check the My Home Page (or equivalent) box is highlighted (click on
it once)
3. Open the Format menu and choose Shared Borders...
4. In the new Shared Borders window check that Apply to: is set to All pages
5. On the right, turn on the Top and Left check boxes together with both their Include
navigation buttons boxes
This will set the shared borders along the top and down the left of your pages - if you prefer other
settings then the choice is yours. The window should now look as below:
15
6. Press <Enter> for [OK]
7. Double click on the My Home Page (or equivalent) box to see the result
You will find that borders have been added, with a main title across the top and links to your other
pages down the left. These make your current main heading and the bulleted list redundant (you can
remove these later, if you decide you like shared borders).
8. Click on the Preview tab to see how the page will appear when published
9. Try out the new link (on the left) to My Family
This is in fact currently an empty page, but it already has borders giving a link at the left to your
Photos, plus links across the top to your other pages, including your Home Page. What appears in the
shared borders is determined by the tree structure you created in Navigation View. The order of the
buttons is derived from your tree, reading left to right. The headings which form the links are
provided by the Page Titles you saw earlier. The links which are shown are the default settings and
can be changed in the Link Bar Properties window:
10. Click on the [Design] tab to return to editing mode
11. Now double click on the links in the shared border area on the left of your page - the following
window appears:
16
This window shows that the navigation buttons in the left-hand shared border link to child pages of
the current page. You can change the settings here if you want to provide other links (eg under
Additional pages: you can add a link to your Home page). You can also change the way the
navigation buttons look:
12. In the Link Bar Properties window, click on the Style tab - the following appears:
Here, the style of the buttons is set. Currently, the Brackets style is used with the orientation set to
vertical. There are many other different styles you can choose from, accessible via the scroll bar
provided.
13. Using the scroll bar, move to the top of the list and set Choose a style to Use Page's Theme
14. Press <Enter> for [OK] to confirm the changes
You should see no immediate change to your layout as you are not currently using a Theme - that's
coming in the next section. An independent set of hyperlinks is included in the navigation buttons in
the top border (double click on where it says Edit the properties... to see the properties, as before).
There is one further border property to examine namely the Page Banner Properties.
15. Double click on the My Home Page banner in the top shared border
16. Amend the wording of the current Page banner if required
17. Press <Enter> for [OK] to confirm any changes
18. Save the new version of your Home Page by pressing <Ctrl s>
You will see a new _borders folder appear in the Folder List. This is where information about the
shared borders is kept, and it is controlled by FrontPage.
17
Adding a Navigation Button
Once you have established shared borders with their navigation buttons, you can easily add new ones
simply by adding new pages to the Navigation View structure.
1. Click on the [Web Site] tab just above the web page
2. Right click on the Home Page box and choose New then Page
3. Right click on New Page 1 and choose Rename
4. Type My Work then press <Enter>
5. Click on the [Refresh] button or press <F5>
6. Drag the new page to the required position to set up the correct navigation button order
Having created the new (empty) page, its Title will have been added to your navigation buttons:
7. Double click on the My Home Page box
8. Click on the Preview tab to see the new link(s) to My Work
9. Click on the [Web Site] tab just above the web page
10. Click on the [Hyperlinks] button in the Views panel to see how that has changed
Themes
One final thing you may wish to apply to your web site is a Theme. This works in the same way as a
Template in PowerPoint - it provides you with fancy backgrounds and buttons in your shared borders.
Though these themes have been professionally designed, they may not comply with the UK
Government's Accessibility legislation. This includes things like colour schemes for partially-sighted
or colour-blind users. You may wish to consider these aspects when designing your own personal web
pages. Further information about accessibility can be found on the University's Web Information
Policy pages.
1. Click on the [index.htm] tab at the top, and then click on the [Design] tab at the bottom
2. Open the Format menu and select Theme... - a Theme Task Pane appears on the right
18
3. Initially No Theme is selected - scroll down through the preview boxes of the themes under
Select a Theme, and find one that you like
4. Move your mouse over the preview box of the preferred theme and you should find that a
vertical column with a down arrow appears on the right-hand side of the preview box. Click on
this column and select Customize...
For each theme, there are several options you can set (there are checkboxes to turn these on and off):
Vivid colors - turn this on/off to see which set of colours you prefer
Active graphics - some themes use animation and this option turns animation on/off
Background picture - take care using a picture for your background, the text may not be
readable
You can also modify an existing theme (the colours used etc) if you want. To modify the current
scheme and create your own based on it:
5. Click on the [Save As...] button, name the theme MyTheme then press <Enter> for [OK]
6. Now click on the [Colors...] button then on the [Custom] tab
7. Under the Item: heading select Banner Text
8. Using the list arrow attached to the Color box, select a new colour from those provided in the
palette (or click on More Colors... for a wider choice)
9. Press <Enter> for [OK] to close the Modify Theme window
10. Click on [OK] again then press <Enter> for [Yes] to save the changes to your theme
To now apply your theme to your web pages:
11. From the themes in the Theme Task Pane, you should now find a MyTheme preview box - move
to the preview box, click on the vertical column that appears on the right, and select Apply as
default theme
19
12. A warning message will come up asking if you really want to apply the theme
13. Press <Enter> for [Yes] to apply the theme (this may take some time)
You should now have your own individual scheme, which uses a different colour for your main
heading. You may notice that a new _themes folder appears in the Folder List. This is where
information about the theme is kept, and it is controlled by FrontPage.
Note: Changing the Background colour of a scheme only has an effect if a plain background is being
used - it has no effect on patterned or image backgrounds. To do this, turn off the Background picture
option.
14. If the [index.htm] tab has an asterisk/star next to it, make sure that you save the page by
pressing <Ctrl s>
15. Close down the index.htm page and the Theme Task Pane
Republishing the Web
Having made the changes to your development web site, it's now time to publish the results. As usual,
this is now done in two stages - first using the FrontPage Publish Web command, then resetting access
permissions on the main computer.
1. Open the File menu and choose Publish Site...
2. In the Remote Web Site Properties window that appears, check that the Remote Web site
location: is set to N:\public_html (if not then you need to carry out the same set of steps that
you did the first time you published the web site) - if it is, press <Enter> for [OK]
3. Press <Enter> or click on the [Publish Web site] button in the bottom right-hand corner of
the window
4. If asked, press <Enter> for [Yes] to remove files no longer in the current web - you may have
to do this a few times (if there are going to be a lot of files that you know can be deleted then it
may be better to choose [Yes to all] the first time you are prompted)
As before, the relevant pages are copied across from your source to your public_html folder. This
time, however, many more files are involved, including several used by FrontPage to manage your
web, so it will take longer to publish. When the process has ended, have a look at the log file:
5. Click on the View your publish log file link
6. Note how this is now much more detailed than when you published the first time - [Close] the
Internet Explorer window that opened to show the log
To make your web site visible to the world:
7. Click on the still-open telnet window on the Task Bar
8. Type publish then press <Enter>
20
9. Hide the telnet window by clicking on the [Minimize] button
10. Click on the Internet Explorer window on the Task Bar and press <F5> or click on the
[Refresh] toolbar button - your web page should be fully up and running again
11. Test out your links, if you like, then [Minimize] the Internet Explorer window
Further Tasks
You have finished working through the notes now, but there's plenty to be done to complete your web
site. Currently you have several empty pages, which need writing up. You will, no doubt, want to
create an entirely different structure, with different Page Titles etc. Spend some time now or later
practising what you have learnt today. Here's a list of further tasks:
In Tasks View create a list of outstanding jobs - keep this up-to-date as you work through them
Add text to any empty pages
Remove any headings and hyperlinks which are now shown in the shared borders
In Navigation View remove any unwanted pages and create new ones where required
Give your pages more suitable Page Titles
In Folders View, rename your files to match the new titles and move them within the file
structure, putting them into new folders where that's sensible
In Reports View check that your hyperlinks are all working properly
Modify the theme and shared border settings, if necessary
Republish your web site within FrontPage and reset the Unix permissions on main
View and test out any links in your browser (i.e. Internet Explorer)
Opening a Web
It's probably going to take several days work to complete your web site - and then you'll need to
maintain it over the coming years. To reopen your source web the next time you work on it:
1. Open up Microsoft FrontPage as usual
2. Open the File menu and choose Open Site...
3. Click on the [My Computer] button on the left
4. In the list that appears, double click on your_username on 'ndrive' (N:)
5. Select the folder source then click on [Open]
Note: If you are not using a public PC then you can, more easily, open the File menu and choose
Recent Sites then select your web site from the list which appears.
IMPORTANT: NEVER be tempted to edit the published web in public_html - ALWAYS edit the
source web then publish it.
Logging Out
You have now finished this training session, so save your pages, shut down any open windows and
log out:
1. Open the File menu and choose Exit to leave FrontPage
2. Press <Enter> for [Yes] if asked if you want to save the changes to your file(s)
3. Close Internet Explorer by clicking on its [Close] button
4. In the telnet window, type logout followed by pressing <Enter>, and then [Close] the
window
21
5. Finally, on IT Services machines, click on [Start], choose Log Off, and press <Return> for
[Log Off] to confirm this
TM
Trademark owned by Microsoft Corporation.
© Screen shot(s) reprinted by permission from Microsoft Corporation.
Page last updated Thursday, 29 November 2007
Email: its-help@reading.ac.uk © The University of Reading
top related