English version

WebSitePP : Pré-processeur HTML


Exemple complet
Précédent  Suivant 

Cette page présente un exemple complet et son résultat. Il montre :
  • Comment utiliser la gestion des langues (2 langues : fr et en)
  • Comment placer des pages dans des répertoire différents (ici, un répertoire différent pour chaque page)
  • Comment faire un menu qui n'affiche pas le lien sur la page en cours
  • Un exemple de séparation de la mise en page et du contenu
L'exemple est divisé en deux fichiers :
  • le fichier lib.wspp décrit la façon dont les pages vont se présenter
  • le fichier main.wspp décrit le contenu des pages
Six pages Web sont générées, chacune avec un menu et un lien sur la seconde langue.
Note : Le code HTML généré pour une page peut être consulté en cliquant sur le bouton droit de la souris et en séléctionnant "View Page Source"


Cliquez ici pour afficher le site résultant de la commande 'webSitePP.py main.wspp'



Source du fichier main.wspp

/ * Defines the languages for this site * /
 <DEFINELANG fr /> 
 <DEFINELANG en />  

/ * Includes the library file (see source below) * /
 <INCLUDE lib.wspp />  


/ * Define a dummy test macro without parameters * /
 <DEFINE TEST_MACRO> 
  <p>
    <L fr>  Ceci est le texte de la macro de test  </L> 
    <L en>  This is the text of the test macro  </L> 
  </p>
 </DEFINE> 


/ * Defines the 3 site pages * /
/ * ======================== * /

/ * Define page 1 * /
 <PAGE DirA/MyPage1> 

  / * Call the PAGE_STRUCTURE macro, defined in lib.wspp. * /
   <PAGE_STRUCTURE> 
     / * First parameter is the page title * /
      <PARAM>   <L fr>  Ma page 1  </L> 
               <L en>  My page 1  </L>   </PARAM> 
 
    / * Second parameter is the page text background color * /
      <PARAM>  #DDEEFF  </PARAM> 

     / * Third parameter is the page text * /
      <PARAM> 
         <L fr> 
           <p>
	   Ceci est le texte français de la page 1.
           On peut y placer du <b>HTML</b> ou appeler des macros.
	   </p>
         </L>  

         <L en> 
           <p>
	   This is the English text of page 1.
           You can put <b>HTML</b> or call some macros.
	   </p>
         </L>  

         / * Call of the test macro * /
          <TEST_MACRO>            

      </PARAM>  / * End of the third parameter * /

 </PAGE> 


/ * Define page 2 * /
 <PAGE DirB/MyPage2> 
   <PAGE_STRUCTURE> 
      <PARAM>   <L fr>  Ma page 2  </L> 
	       <L en>  My page 2  </L>   </PARAM> 
      <PARAM>  #EEFFDD  </PARAM> 
      <PARAM> 
         <L fr> <p>Ceci est le texte français de la page 2.</p></L> 
         <L en> <p>This is the English text of page 2.</p></L> 
      </PARAM>  
 </PAGE> 


/ * Define page 3 * /
 <PAGE DirC/MyPage3> 
   <PAGE_STRUCTURE> 
      <PARAM>   <L fr>  Ma page 3  </L> 
               <L en>  My page 3  </L>   </PARAM> 
      <PARAM>  #FFDDEE  </PARAM> 
      <PARAM> 
         <L fr><p>Ceci est le texte français de la page 3.</p></L> 
         <L en><p>This is the English text of page 3.</p></L> 
      </PARAM>  
 </PAGE> 


Source du fichier lib.wspp

/ *
=================================================================
This file is part of an example for the webSitePP.py tool.

Content:
========
 It defines macros to avoid repeating code in the HTML pages:
      - Menu macros
      - Page structure macros

=================================================================
* /


/ * Three macros for the menu * /
/ * ========================= * /

/ * First: Define the color (red here) for
     the current page item in the menu * /
 <DEFINE CURRENT_ITEM_COLOR #FF0000 /> 


/ * Second: The MENU_ITEM macro creates the <li> code
    and adds the link to the page only if 
    not the current page, else set a special color.
   The parameters are (arbitrary choice):
	- parameter 0 : the page name
	- parameter 1 : the associated menu text * /
 <DEFINE MENU_ITEM> 

   <IF NEQUAL SELF_PAGENAME USEPARAM0 > 
      <a href=" <PAGEFILENAME USEPARAM0 SELF /> " > 
   <ELSE/> 
    <font color=" <CURRENT_ITEM_COLOR/> ">
   </IF> 

  / * Display the <li> line with the text inside * /
  <li> <p>  <USEPARAM 1 />  </p> </li>

   <IF NEQUAL SELF_PAGENAME USEPARAM0> 
    </a > 
   <ELSE/> 
    </font>
   </IF> 

 </DEFINE>  / * End of macro MENU_ITEM definition * /



/ * Third: The MENU macros defines a common menu to some site pages.
     It uses the previously defined MENU_ITEM macro.
     There is no parameter. * / 
 <DEFINE MENU> 
  <br><br><br><br>

  <ul>
   <MENU_ITEM> 
      <PARAM>  DirA/MyPage1  </PARAM> 
      <PARAM>   <L fr>  Cliquer pour voir ma page 1  </L> 
              <L en>  Click and see my page 1  </L> 
      </PARAM> 

   <MENU_ITEM> 
      <PARAM>  DirB/MyPage2  </PARAM> 
      <PARAM>   <L fr>  Cliquer pour voir ma page 2  </L> 
              <L en>  Click and see my page 2  </L> 
      </PARAM> 

   <MENU_ITEM> 
      <PARAM>  DirC/MyPage3  </PARAM> 
      <PARAM>   <L fr>  Cliquer pour voir ma page 3  </L> 
              <L en>  Click and see my page 3  </L> 
      </PARAM> 
  </ul>
  <br>

  / * Language selection * /
  <L fr><a href="<PAGEFILENAME SELF en>"> English version   </a></L>
  <L en><a href="<PAGEFILENAME SELF fr>"> Version française </a></L>  

 </DEFINE>  / * End of macro MENU definition * /




/ * One macro for the page structure * /
/ * ================================ * /

/ * This macro defines the structure of the pages in this example.
   By choice, we choose the following parameters:
       - Parameter 0 : the page title
       - Parameter 1 : The page text background color
       - Parameter 2 : The page text  * /
 <DEFINE PAGE_STRUCTURE> 

   <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
   <html>
     <head>
       <meta content="text/html; charset=ISO-8859-1"
                      http-equiv="content-type"> 
       <meta name="description" content=" <USEPARAM 0> " />  
       <title>
           <USEPARAM 0>   
        </title>
     </head>

     <body>
       <br><br>

       / * Create a big table to put the menu and the page content * /
       <table width="100%">

         / * Display the menu in the first column * /
         <tr>

           <td align="left" nowrap="nowrap"
               width="30%" rowspan="2">
              <MENU> 
           </td>
 
           / * Display the title in the first row, second column * /
           <td align="center" valign="top" height="20%">
                <h1>  <USEPARAM 0>  </h1>  
           </td>
         </tr>
 
         / * Display the page content in the
	    second row, second column (colspan above...) * /
         <tr>
           <td align="center" bgcolor=" <USEPARAM 1> "> 
              <USEPARAM 2>  
           </td>
         </tr>

       <br><br>
     </body>
   </html>
 </DEFINE>  / * End of macro PAGE_STRUCTURE definition * /


Précédent  Suivant 

visiteurs
Généré avec l'outil webSitePP.py
Dernières modifications le 20 octobre 2004