Create Legacy Web Pages
Getting Started
Legacy Opening Page
To start using the Legacy Web Creation pages go to Internet>Create Web Pages. The above screen-shot shows what the first page you will see looks like. We notice that on the right it is set for Pedigree Pages and we shall leave it at that for most of this blog. On the left are names which will be given to the folders which Legacy will create. Below that some headings and your name and contact address.
On the bottom right are Load and Save buttons which are for loading/saving the settings. As we are using the defaults there is no need to touch these. Instead simply click the big "Create Web Pages" button at the top right et voila! Your web pages. You will be asked if you want to view them - so why not?
My web pages (and I hope that you have had a look!) are in the Pedigree style, but without changing anything else use the radio buttons on the right to select each of the different formats and see which you prefer. Choose to overwrite the previous pages so as not to clutter your machine up!
The HTML Files
Providing you used the defaults when installing Legacy, the html files are stored in the C:\Legacy\Web\ folder. If you right click on one and open with notepad you will see the html which has been created. You can also view anybody else's as well. When you view a web site in your browser click View>Source and you will see their coding (the actual placing and name of this button varies between browsers: in IE7 it's also under the Page icon). If it looks incomprehensible at present don't worry we'll go through that in later blogs.
Notice also that in the Pedigree style the files are named by their RIN ie. 1.htm, 2.htm... etc. When one has a large number of files this is a very good reason for going to Options>Customise>Data Defaults on the main screens and unchecking "Reuse abandoned RINs".
In this blog, I will now look at two other screens in the web creation section:
1. Title Page
This is an easy page to set up! Simply choose the picture which you wish to see on your opening page using the "Select" button and enter your caption underneath. This picture should not be much larger than thumbnail size (see my "Contents" page for an idea of the size).
2. Miscellaneous
Miscellaneous Screen
At the top right is a box which says "Index". This should only be changed when familiar with the workings of web sites (if ever!). Below are two radio buttons for "htm" and "html". There is effectively no difference between them, so select the one you prefer and then stick with it!
Assuming this will be your first web site, the two lower boxes should be checked and brief details entered as above - if you cannot read them the top says "Ancestors of Ron Ferguson" whilst the lower "Genealogy, Ancestors, Family, Legacy Family Tree". These make no difference to your site but tell web search engines what it is about.
Good Practice
- Do not use spaces in file names as some servers will replace them and your files will not display; use a dash or underline instead.
- Adopt a consistent method of naming files If you look at the source code for this page you will see that the above picture is named WebMisc.png, this is my system but others vary.
- Picture extensions: File sizes need to be small so, avoid using .bmp as they are too big; .gif are small, retain transparency but are "lossy" ie. likely to lose definition if constantly altered; .png small, not really "lossy" and retain transparency; .jpeg are larger, do not retain transparency and are "lossy" (but better than .gif). Decide now whether you are going to use uppercase or lowercase for extensions and, again, stick with it or your files may not be recognised.
- Picture sizes: Pictures should be kept as small as possible - the ones above have a width of 340 pixels and I tend not to go above 400px for the longest side. It should be remembered that in your program you can reduce the size by setting it's size in the coding, but it should never be increased, else definition will be lost.
- Index Page: When first going to a site the browser looks for the "Index" or "Home" file. Obviously, therefore, You may only have one in any given folder.
- It's a good idea to check how your site looks in various browsers. Even if your coding is W3C compliant it may present differently. On finishing this page I noticed that the css for the scrolling header did not present properly in Netscape, Firefox and Opera but was fine with IE7.
Getting Started cont...
Expanded Graphics Tab
The Legacy Help Pages give a good resume of the options available under the Graphics Tab, so except for saying that clicking the "Select" buttons opens the choices available for each option, I will not expand on this.
Instead I am going to look at the colours. Clicking the colour block next to the "Select a solid background colour" (between the blue square and the red pin on the above screenshot) opens the limited colour palette shown on the right of the shot. Clicking the "Set" button opens the palette shown on the far left with 48 defined colours.
If this isn't enough click the "Define Custom Colours" button and the adjacent screen becomes available. To use this set the approximate colour you require from the rainbow and then click the slider on the right for the exact shade. Click "Add to custom colours" and when it shows on the left screen click the colour and OK . Alternatively one can pick a colour from the Web Safe Colours in My Blog 10 and enter the RGB decimal numbers directly into the number boxes.
Unfortunately there is no option just to insert the Hex number and as I have no wish to give a maths lesson on how to convert to decimal, the easiest way is to use the calculator which Windows kindly supplies for free. Simply remember that for #FF6789, the FF represents Red, the 67 Green and the 89 Blue (all are in Hex!).
One final point, it is not possible to change the background colours of the windows in the Pedigree format from within Legacy.
The Links Tab
Expanded Links Tab
Arguably the most interesting of all the tabs because here you can put almost anything! Clicking the little blue squares at the top right of each window opens enlarged windows for entering code etc. Caution is needed, however, as is is possible to end up with two "End Head" tags and two body tags as Legacy generates its own. If, as I do, one converts the Legacy pages to css then two body tags are inevitable and the Legacy generated one must be removed on all pages. I use PSPad to do this.
To give you some idea as to what can be included, all the coding for the headers down to the arrows on my Pedigree pages are included in the header window. Similarly all the footers from the "Ferguson Contents" etc. to the end are included in the footer window, and do not forget to save each when you are done!
The Project Tab
Yes, I know, this is what I called the "Opening Page" in Part 1! Deliberately, though, I put on one side the Introduction Window. As you will have seen, Legacy includes its own words in here but you can replace this with your own - yet again the little blue square expands the window. Even better one can also put in some coding if one wishes. My own introduction on the Contents page starts with " Good Morning" or afternoon or evening depending on the time of day in the viewer's location. Should you wish to do this the javascript coding is:
<script type="text/javascript">
//<!--
var todaydate = new Date();
var timeis = todaydate.getTime();
todaydate.setTime(timeis);
var houris = todaydate.getHours();
if (houris >= 17) display = "Evening"
else if (houris >= 12) display = "Afternoon";
else display = "Morning";
var welcome = ("Good " + display + ". Welcome ");
document.write(welcome);
// --> </script>
I could have included an audio file which says the same, and one day may so do.
Finally
All other tabs are well explained in the Legacy Help Pages and are pretty much the same as for reports, giving one the opportunity to personalise the outputs. I would add one point, though and that is, when using the Pedigree format it is suggested that the sources are included in the individual's pages. The reason for this is that should the site become too large (or too complex) for uploading all the pages onto the server and hence one selects only those new or changed, then the older source references are no longer correct.
When you have perfected all your settings do not forget to use the little save button at the bottom right to save them.
Bonne Chance
© Ronald Ferguson 2007 - 2008