Insérer des images dans les notes

From GeneWeb
Revision as of 00:05, 29 November 2016 by Henri83 (Talk | contribs) (suppress m=IM;v=)

Jump to: navigation, search
150px-Geographylogo svg.png Language: English • français

Les notes individuelles, et les notes générales de la bas peuvent des liens vers des images contenir ou directement des images. Voici les diverses possibilités offertes pas la combinaison de HTML et GeneWeb :

  • lien textuel vers une image : <a href="%sm=IM;s=image.jpg">lien textuel</a>
Le fichier image.jpg est recherchée dans le répertoire bases/src/basename/images.
  • image directe : <img src="%sm=IM;s=image.jpg" title="mouseover description" alt="alternative description">
  • image bouton : <a href="%sm=IM;s=full-image.jpg"><img src="%sm=IM;s=thumb-image.jpg"></a>
  • lien textuel vers une image map: <a href="%sm=SRC;v=file">lien textuel vers une image</a>

GeneWeb remplacera les macros telles que %s par la valeur appropriée pour atteindre votre serveur, et le paramètre de s= pointe vers le dossier bases/src/mabase/images/ où se trouve l'image recherchée. Le nom du fichier fourni doit inclure l'extension (.jpg, .png).

Une information de style peut être ajoutée selon le besoin.


Le tag HTML img doit être présent dans la liste des tags acceptés par GeneWeb mémorisés dans le fichier bases/tags.txt.

Example d'Image contenant une "image map"

Dans le cas des images avec "image maps", permettant de désigner dans l'image des zones cliquables, la commande GeneWeb n'est plus m=IMH mais m=SRC, et le paramètre v= désigne un fichier .txt qui réside dans le dossier bases/src/mabase/. Attention, pour le paramètre v=, il ne faut pas fournir l'extension .txt!! Dans le fichier .txt désigné, on trouvera du code HTML et quelques macros GeneWeb comme le montre l'exemple qui suit :

Contenu du fichier bases/src/mybase/grande-ile.txt 

<!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)
</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>

Appel de ce fichier dans les notes d'un personnage : 

<a href="%sm=SRC;v=grande-ile">une photo cliquable de l'ile</a>

Cet appel recherche le fichier bases/src/mybase/grande-ile.txt traite les macros GeneWeb et envoie l'ensemble à votre navigateur. Celui ci détecte la demande 

<img SRC="%sm=IM;s=grande-ile.jpg" usemap="#test-chausey" border="0">

qui a été transformée en 

<img SRC="localhost:2317/mabase?sm=IM;s=grande-ile.jpg" usemap="#test-chausey" border="0">

Cette image fait appel au tag HTML <usemap #test-chausey> qui définit des zones de l'image auxquelles sont associées des URL (avec un outil comme Mapedit par exemple). Là encore, avant d'envoyer le résultat à votre navigateur, GeneWeb aura transformé les lignes 

<area shape="rect" coords="345,307,433,347" href="%sm=SRC;v=plan-pointe-du-phare">

en 

<area shape="rect" coords="345,307,433,347" href="localhost:23127/mabase?m=SRC;v=plan-pointe-du-phare">

et un click sur la zone définie provoquera un nouvel appel à GeneWeb (une nouvelle image en l’occurrence, mais les autres lignes du <ni-owiki><usemap></nowiki> appellent des personnages.

Notez que grâce au traitement effectué par GeneWeb, et la macro%s, ces fichiers, et la base correspondantes peuvent s'exécute sur n'importe quel serveur, local ou distant!!


Manuel GeneWeb

Rembrandt Old Man Reading a Book.jpg

Utiliser et gérer une base généalogique

Annexe technique

Retrieved from "https://geneweb.tuxfamily.org/w/index.php?title=image/fr&oldid=2997"