GED-GEN
Jun 122011
 

You can print your family group sheets using the Print command within your Internet browser. You may find the way GED-GEN formats pages more readable than those created by your favorite genealogy program. Visitors to your website will also appreciate the ability to print selected pages for their own research.

You can make it easier to print your family group sheets by providing a separate Cascading Style Sheet (CSS) file. This file optimizes the page display for printing. For example, since links are not clickable on a printed page, they are shown in normal font. Inter-page navigation links are hidden since they don’t work on paper.

Follow these steps to create your own CSS file and make your family group sheets easier to print.

Step 1: Create a CSS file.

Using an editor like the Windows Notepad program, open a new file. Use your mouse to select the sample contents below and copy it (press CTRL+C). In Notepad, paste the text using CTRL+V or the Edit | Paste command.

When you are done editing the file, save it to your destination folder. This is where GED-GEN places the web pages it creates. Name the file printable.css. (You can choose any name for the file.)

@media print
{
/*
** Since links are not clickable on printed paper,
** convert them all to regular text for readability
** and do not display inter-page navigation links.
*/
a
{
text-decoration:none;
color:black;
}
.gg-body A:link { color:black; }
.gg-body A:visited { color:black; }
.gg-body A:active { color:black; }
.gg-thmlnk,
.gg-lnksur,
.gg-lnkidx,
.gg-lnkbib,
.gg-lnkrep,
.gg-lnkfam,
.gg-lnkmed,
.gg-idxjmp
{
display:none;
}
.gg-idxnav a,
.gg-bibnav a,
.gg-repnav a,
.gg-thmnav a,
.gg-sldnav a
{
display:none;
}
/*
** Try to keep reasonable page-breaks
*/
.gg-tblimg,
.gg-tblimgpic,
.gg-cap,
.gg-bar
{
page-break-inside:avoid;
}
.gg-tblimg > tr
{
page-break-inside:avoid;
}
}

Step 2: Override your own styles if necessary.

If you already use your own CSS files to style your website, you may need to adjust those settings for printing as well. You can override your own styles in printable.css. For instance if you have a menu system, or you divide your pages into columns using CSS, you may want to hide certain elements or change formatting for best results.

You may need to explicitly override certain style elements. Here are some suggestions:

  • font-size: Use explicit font points rather than relative sizes. For example, use 10pt rather than 90%.
  • overflow: If you use the value hidden, it may prevent the entire page from being printed. Consider changing this to visible.
  • width: The width may need to be set to 800 pixels or less to ensure everything fits on the printed page.
  • background: Consider setting your background color to white.
  • border: Consider removing borders if they make the page less readable.
  • margin and padding: Consider readjusting margins and padding to reduce empty space on the printed page.
  • display versus visiblity:display:none; hides an element and the space it occupies. visibility:hidden; hides the element but leaves the space it occupied.

Step 3: Include the CSS file in GED-GEN.

In GED-GEN, you can include printable.css as just another external CSS file on the Attributes tab. However not all Internet browsers handle the @media print directive properly. Some browsers will not interpret your print settings in a CSS file linked in this way. Therefore they will ignore your print customizations.

Instead, the link to printable.css should have a media="print" attribute. To do this in GED-GEN, click the Options button. Click the Headers tab, then Advanced, then Standard Pages, then the <HEAD> Block tab.

Under the Before </HEAD> field, enter:

<link rel="StyleSheet" type="text/css" media="print" href="printable.css">

Now click the Multimedia Pages tab, then the <HEAD> Block tab.

Under the Before </HEAD> field, enter:

<link rel="StyleSheet" type="text/css" media="print" href="../printable.css">

If you use CSS to style your website with more complicated constructs like menus, you may also need to specify CSS standards mode for visitors who use Microsoft Internet Explorer. Otherwise some of your print customizations may be ignored. To do this, insert a meta tag with http-equiv="X-UA-Compatible".

On both the Standard Pages and Multimedia Pages tabs, under the After <HEAD> fields, enter:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

Of course if standards mode is incompatible with your website, you should omit the above line.

Now you can re-generate your web pages and GED-GEN will include a link to your printable.css file. When you use your browser’s Print Preview command, you should see your print customizations. If the settings are not quite right, you can re-edit printable.css, save it, then simply refresh the browser page. There’s no need to re-generate your web pages each time.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

*