Inserting images in notes

The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Language:	English • français

Warning: This page is obsolete compared to the french version; it need to be reconciled with it.

Individual and main notes in GeneWeb can contain links to images or direct images. Here are the different possibilities using HTML:

text link to an image: <a href="%sm=IMH;s=image.jpg">text link</a>
direct image: <img src="%sm=IM;s=image.jpg" title="mouseover description" alt="alternative description">
button image: <a href="%sm=IMH;s=full-image.jpg"><img src="%sm=IM;s=thumb-image.jpg"></a>
text link to image maps: <a href="%sm=SRC;v=file">text link or button image</a>

The s= parameter refers to folder bases/src/mybase/images/ where alternative images for notes can be stored. The three subdirs of this path must be created by hand. Note that /bases/ directory is the name of the folder where all the databases are stored and that mybase is the name of the database where you want to place images. For example for the test base Grimaldi on default installation, images must go in bases/src/grimaldi/images/. GeneWeb replace the macros %s by the appropriate URL that keeps current base name, template and language parameters.

Style information can be added as needed.

To work the HTML tag img must present in bases/tags.txt (see tags).

Image maps example

In the case of image maps, gwd looks for bases/src/mybase/file.txt, replace macros by their values, and passes the resulting HTML back to the browser.

An example of such a text file is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<title>
Grande Ile
</title>
<html>
%rcss
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<table border="1" width="100%" height="60">
<tr align="left">
<td width="100%" height="16" bgcolor="#008080"><p align="center">
<font face="Garamond" color="#FFFFFFF"><big><big><strong><big>
La Grande Ile</font></big></strong></big></big></font>
</td>
</tr>
</table>
<p><img SRC="%sm=IM;s=grande-ile.jpg" usemap="#test-chausey" border="0"> <br>
<font size="-1"><em>(Carte construite à partir de celle disponible sur le site réalisé par P. Marques :
<a href="http://www.bretagne.iufm.fr/mentiontic19992000/productions/marques/pmarques/DATA/avpropos.htm"> www.bretagne.iufm.fr </a>).
</em></font>
<hr>
</p>
En déplaçant le curseur sur les lieux significatifs de l'île, vous verrez (peut être!) apparaitre son nom, et un click vous emmènera vers une description plus détaillée et des photos.

<map name="test-chausey">
	<area shape="poly" coords="206,272,212,255,241,254,240,291,217,290" href="%sm=NG;n=le+vieux+fort" alt="Le Vieux Fort">
	<area shape="poly" coords="132,75,170,78,168,110,132,111" href="%sm=NG;n=le+semaphore" alt="Le S̩maphore">
	<area shape="rect" coords="345,307,433,347" href="%sm=SRC;v=plan-pointe-du-phare">
	<area shape="rect" coords="359,194,485,213" href="%sp=la+maison;n=pilet">
</map>
</body>
</html>

This example, opens an image file named bases/src/mybase/images/grande-ile.jpg using the HTML <map> named test-chausey.

In this <map>, several clickable areas have been defined (using the Mapedit tool for instance), and with each area is associated a href HTML command. Since the bases/src/mybase/grande-ile.txt file has been processed by gwd, occurrences of %s have been replaced by the appropriate address.

Through the example above, one can see that the href command can be any valid GeneWeb URL.

Image maps builder tool

With version GeneWeb v7.1, a tool is proposed allowing the interactive construction of image maps as seen above. This "Work In progress" will be doculented more precisely soon.

Carousel

GeneWeb v7.1 includes the possibility to associate multiple images with a person in the form of a "Carousel". The menubar includes a button (at the far right) opening the Carousel if it exists, or the Carousel management tool otherwise. In the Carousel itself, the top left button opens the namagement tool.

The management tool allows the following:

selection of a portrait. pre-existing portrait is saved.
selection of an image (with possibly notes and source information).
the delete button associated with portrait and images pushes them in a "saved" area from which they can be "restored".
portrait and images can either be downloaded into the image area of the base, or described through an url to a separate Http server

An extension is being developed managing Coats of Arms:

selection of an image as coats of arms for this person and its descendants
identification of a person stopping the use of its ancestor's coats of arms
special buttons allow:
- use of a portrait or an image as coats of arms,
- push of a coats of arms up several generations
the coats of arms of a person is displayed as a portrait is none is available, or as a small image next to the person's name
the coats of arms of spouses is displayed next to the marriage information
as for portraits and images, deleting the coats of arms pushes it in a "saved" area from which it can be restored.

GeneWeb Manual