Difference between revisions of "image"

From GeneWeb
Jump to: navigation, search
(Created page with "{{DISPLAYTITLE:Inserting images in notes}} It is possible to insert links to images or images within notes. This is achieved by inserting in the body of the note the followin...")
 
Line 31: Line 31:
 
</tr>
 
</tr>
 
</table>
 
</table>
 
 
<p><img SRC="%sm=IM;s=grande-ile.jpg" usemap="#test-chausey" border="0"> <br>
 
<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 :
 
<font size="-1"><em>(Carte construite à partir de celle disponible sur le site réalisé par P. Marques :
Line 38: Line 37:
 
<hr>
 
<hr>
 
</p>
 
</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.
 
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.
  
Line 48: Line 45:
 
<area shape="rect" coords="359,194,485,213" href="%sp=la+maison;n=pilet">
 
<area shape="rect" coords="359,194,485,213" href="%sp=la+maison;n=pilet">
 
</map>
 
</map>
 
 
</body>
 
</body>
 
</html>
 
</html>
Line 55: Line 51:
 
This example, opens an image file named <code>GeneWeb-Bases/src/base/images/grande-ile.jpg</code> using the HTML <code><map></code> named <code>test-chausey</code>.
 
This example, opens an image file named <code>GeneWeb-Bases/src/base/images/grande-ile.jpg</code> using the HTML <code><map></code> named <code>test-chausey</code>.
  
In this <code><map></code>, several lcickable areas have been defined (using the '''Mapedit''' tool for instance), and with each area is associated a <code>href</code> HTML command. Since the <code>GeneWeb-Bases/src/base/grande-ile.txt</code> file has been processed by gwd, occurences of '''%s''' have been replaced by the appropriate address.
+
In this <code><map></code>, several clickable areas have been defined (using the '''Mapedit''' tool for instance), and with each area is associated a <code>href</code> HTML command. Since the <code>GeneWeb-Bases/src/base/grande-ile.txt</code> 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 <code>href</code> command can be any valid GeneWeb URL.
 
Through the example above, one can see that the <code>href</code> command can be any valid GeneWeb URL.

Revision as of 23:35, 14 October 2015


It is possible to insert links to images or images within notes. This is achieved by inserting in the body of the note the following command:

  • link to an image: <a href="%sm=IMH;s=image-file-name.jpg">displayed text</a>
  • image : <img SRC="%sm=IM;s=full-image.jpg">
  • button image: <a href="%sm=IMH;s=image-file-name.jpg"><img SRC="%sm=IM;s=full-image.jpg"></a>
  • clickable image: <a href="%sm=SRC;v=full-image">displayed text or button image</a>

gwd reads those commands and replaces %s by the appropriate server address (localhost:2317 most often). Images designated by the s= parameter are found in the GeneWeb-Bases/src/base/images folder.

In the case of clickable images, gwd looks for the file full-image.txt in GeneWeb-Bases/src/base, scans the corresponding text, replacing % macros (see 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 GeneWeb-Bases/src/base/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 GeneWeb-Bases/src/base/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.