====== Installeer de Leuven-Template stap 6 ======
  - De weather28/ map opladen naar uw website
  - Zet de correcte lees/schrijf-rechten van alle mappen en bestanden 
  - Test de web-server van uw web-hoster eerst 
  - Stap voor stap uw eigen instellingen invoeren 
  - Wat en hoe met er opgeladen worden  
  - **U bent hier** 
  - Bijna klaar 

<WRAP tabs>
  * [[how_to_install|1]]
  * [[folder_contents|2]]
  * [[test_program|3]]
  * [[settings|4]]
  * [[upload|5]]
  * [[menu|Het menu]]
  * [[how_to_install7|7]]
</WRAP>
===== Technische aspecten van het menu =====

De menus worden gedefinieerd in een xml bestand in de root van de template: **weather28/wsMenuData.xml**
De xml structuur is een verdere ontwikkeling van wat ook in de Saratoge-Template wordt gebruikt om menus in xml onder te brengen.
==== XML ====
De algemene structuur van de menu xml: 
<code> <menu>
    <item   caption=value   param=value . . . /> 	een menu van het hoogste niveau
    <item   caption = value  > 				begin uitklap menu
        <item   caption=value param=value . . ./>		een menu-keuze op het tweede niveau
        <item   caption=value param=value . . ./>		een menu-keuze op het tweede niveau
    </item>						einde uitklap menu
</menu></code>

Als voorbeeld een klein deel van de standaard **weather28/wsMenuData.xml** uit de download

<WRAP column 30%>{{:menu.jpg}}


In de XML zijn er 6 menus, maar in het plaatje zie je er maar 3

Menu nummer 23 en 24  hebben "no" in de "show" instelling omdat de instelling  in de settings voor de **MeteoplugPage** op false staat. En voor menu 21 is er geen Clientraw dus die staat ook op "no" 

</WRAP>
<code><item   caption = "Live Data">
	<item 	nr      = "21"	show    = "wdlPage"
	        img     = "img/menu_updated.gif"
	        caption = "WD Live" 	
		link    = "wdl/incWdlive.php"	 	
        />
	<item 	nr      = "22"  show    = "mwPage"
	        img     = "img/menu_updated.gif"
	        caption = "Meteoware Live"
		link    = "mwlive/wsMWlive_v3.php"	
        />	
	<item 	nr      = "23"  show    = "MeteoplugPage"
	        caption = "WD Live Meteoplug" 
		link    = "inc/meteoplugWDlive.php"					 			
        />			
	<item 	nr      = "24"  show    = "MeteoplugPage"
		caption = "Meteohub/plug Live Data"	                
		link    = "inc/meteoplugDashboard.php"
        />
	<item 	nr      = "25" 	show    = "yes"
		caption = "Steelseries"
		link    = "gauges/gaugePage.php"
        />
	<item 	nr      = "26" 	show    = 'wuId'
		caption= "WU live"
		link    = "inc/WU_Live.php"
        />	
</item>	</code>
==== Parameters ====
^parameter^omschrijving^standaard^
|nr|Uniek nummer (als tekst) wat de pagina identificeert.\\ Alleen dit "nummer" is in de browser adres regel te zien.\\ De naam (of link) van het script wordt niet in de adres regels of ergens anders getoond.| |
|show|Geeft aan of het menu item wel ("yes") of niet wordt afgebeeld. Toegestande waardes zijn "yes" "no" true or false .\\ <wrap hi>Of een verwijzing naar een $SITE instelling .</wrap> Voorbeeld: **show="wdlPage"** verwijst naar **$SITE["wdlPage"]**. Als die instelling op false gezet is wordt de pagina niet in het menu opgenomen|yes|
|<wrap hi>hide</wrap>   |Als deze parameter voorkomt (de waarde doet er niet toe) is het menu item wel bekend, dus er kan aan gerefereerd worden in een link, maar de keuze staat NIET in het menu zelf| |
|<wrap hi>top</wrap> |Als deze parameter voorkomt met de waarde "no" , wordt alleen voor deze pagina ook de header direct getoond en wordt dus niet de pagina naar boven geschoven om zo veel mogelijk van de details te laten zien. Deze parameter wordt door enkele scripts intern gebruikt om naar onderdelen van de pagina te gaan.|
|caption|Deze korte beschrijving wordt in het menu afgebeeld.| |
|external|Om een link naar een externa pagina op te nemen| |
|title|Als een langere beschrijving gewenst is. die wordt getoond in het bekende gele blokje als er boven een menu ge"hover"d wordt. | |
|link|De naam van het (PHP) script die de pagina genereert of de direct de naam van html pagina zelf| |
|gizmo|Insetlling of wel ('1') of niet ('0') de "ajaxgizmo" wordt afgebeeld.|  0  |
|css|Sommige pagina's hebben een eigen CSS bestand nodig, die met deze instelling wordt aangegeven.\\ Voorbeeld: een **WU-HistoryTan.css** in de map **wu** wordt ingesteld met  **css="wu/WU-HistoryTan.css"**\\ <wrap important>U moet alle mappen beneden de weather28/ map vermelden.</wrap>| |
|head|Voor sommige programma's (GOOGLE map V2 of mesonet bijvoorbeeld) moet er specifieke code worden uitgevoerd in de head section van een pagina.\\ De instelling **head="progr_name.php"** resulteert in het uitvoeren van dat script net voor het einde van de html head sectie van de gegenereerde pagina. Een dergelijke pagina zal normaal gesproken speciale CSS genereren of bevat slechts een nofollow metatag.\\ <wrap important>U moet alle mappen beneden de weather28/ map vermelden.</wrap>| |
|noutf8  |sommige pagina's kunnen niet correct worden afgebeeld met de UTF-8 "character set". Hier kunt u aangeven welke character set dan gebruikt moet worden.| |
===== Werking van de menu scripts =====
==== Generatie van de menu bestanden ====
Tijdens de opbouw van de menupagina wordt
   * het **wsMenuData.xml** ingelezen
   * een <ul><li> structuur gegenereerd om het menu juist af te beelden op basis van alle settings
     * in deze  <ul><li> staan alleen de keuzes die in het menu mogen worden afgebeeld.
   * en het menu wordt eveneens bewaard in een tijdelijke tabel om de validitiets controles op de menu-keuze van de bezoeker uit te kunnen voeren.
     * In de  tijdelijke tabel staan ook nog de toegestane maar niet in het menu (hide) voorkomende keuzes. 

Ons voorbeeld van de vorige pagina resulteert dan in:
<code><li class="withImg"><a href="#" title="">Live Data</a>
   <ul>
     <li><a href="index.php?p=22" >Meteoware Live</a></li>
     <li><a href="index.php?p=25" >Klokjes</a></li>     
     <li><a href="index.php?p=26" >WU live</a></li>
   </ul>
</li></code>
Nogmaals, er wordt geen script naam of script map  vrijgegeven,alleen een interne code. Deze code wordt met een 
GET (zichtbaar in de browser adres balk) straks doorgestuurd als de gebruiker een menu keuze maakt.

Ook worden de teksten voor het menu nog geconverteerd middels de vertaal routines. Daarom staat er bij menu 25 "klokjes" en geen "Steelseries"

In ons voorbeeld, als de gebruiker kiest voor  Meteoware Live, wordt die keuze doorgegeven als: **%%http://www.your_web_site.com/weather28/index.php?p=22%%**\\ 
De enige informatie die een hacker kan zien is het nummer 22.
==== Validiteits controle ====
Elke door de gebruiker aangeklikte (of getypte!) menukeuze wordt gecontroleerd tegen de menu tabel wanneer de keuze door index.php is ontvangen. Nummers die niet in de tabel staan moeten door de bezoeker (hacker?) handmatig ingetypt zijn. Deze onbestaande keuzes worden doorgeleid naar de standaard start-pagina.

==== Diversen ====
=== Horizontaal versus verticaal ===
Er is geen verschil in behandeling in de scripts of html tussen een **H**orizontaal of **V**ertikaal menu.
=== Breedte van het menu aanpassen ===
Standaard is het menu 140px breed via een setting. 
Voorbeeld hoe te wijzigen naar 180px; 
<code>$SITE['menuWidth']	= '180';	// 140 = default width of Vertical menu DO NOT CHANGE</code>
=== xml aanpassen ===
Ook Ken True geeft in zijn documentatie aan: xml is erg streng op typefouten of verschrijvingen en de minste onachtzaamheid in het aanpassen van de menu xml resulteert in een totale stop van de template.

=== Niet alle menu keuzes zijn geschikt voor de produktie versie van uw web-site. ===
Een aantal menu keuzes zijn alleen bruikbaar tijdens de opbouw van de web-site. Om te lange en overbodige menus te voorkomen worden dergelijke pagina's  automatisch onzichtbaar gemaakt.  De menukeuzes met als parameter show="debug" verdwijnen immers als de debug is uitgezet.  Als dan later even snel getest wordt met de parameter &debug=y  op de opdrachtregel dan verschijnen ook deze menukeuzes weer.

=== Niet alle menu keuzes zijn direct na opladen van de weather28/ map beschikbaar. ===
Een aantal pagina's zijn afhankelijk van de juiste instellingen in uw settings . Zij worden pas in het menu afgebeeld als deze instellingen correct zijn ingevuld.

===== Hoe passen we het menu aan =====
<WRAP important>PAS OP: xml is nog veel kritischer op fouten als PHP. 
Dus maak altijd een copie van het menu bestand voordat u iets wijzigt. Zo kunt u snel terug als uw web-site op blank gaat na een type-fout.</WRAP>
==== Vervang een enkele item in een drop-down menu ====
<WRAP column 50%>{{ :menu_apadapt1.jpg?nolink  }}
Er zijn menu's met zeer veel keuzes en dan gebruiken we een "drop down" = uitklap-menu om zaken te groeperen. Maar soms bevat zo'n uitklap-menu nog maar 1 keuze nadat alle settings zijn ingesteld.

En als er dan maar 1 keuze is, kunnen we beter het uitklappen weghalen en de keuze rechtstreeks in het menu zetten. Dat staat veel professioneler.

We moeten dan de menu-opbouw in het ** weather28/wsMenuData.xml** bestand aanpassen.
De veiligste manier om dat te doen is:
  - **Kopieer** de specificatie van de te verplaatsen menu-keuze (3) vanuit de omsluitende <item ..></item>(1-2) en
  - plak dit net voor de omsluitende <item ..></item>(1)
  - en voeg een **show="no"** to aan de omsluitende <item ..></item>(4)  
</WRAP>
{{ :menu_apadapt2.jpg?nolink|}}
<WRAP clear></WRAP>
Waarom doen we dit op deze manier? Omdat als er later door toevoegingen wel meerdere menu-keuzes komen, we alleen de **no** / **yes** hoeven aan te passen

<WRAP column 50%>De menu xml zier er dan zo uit =>

en het nieuwe menu is ook OK:
{{ :menu_apadapt3.jpg?nolink  }}
</WRAP>
<code><item   nr="25"   show="yes"		
	link="gauges/gauge.php"
	caption="Steelseries"
	title="Steel series"
	head="gauges/topcss.php" />
</item>
<item caption="Live Data" show="no">
    <item   nr="21"   show="wdlPage"
	link="wdl/incWdlive.php"
	caption="WD Live"
	title="WD Live Data" />
    <item   nr="23"   show="MeteoplugPage"
	link="inc/meteoplugWDlive.php"
	caption="WD Live Meteoplug" 
	title="WD Live Data by Meteohub" />
    <item   nr="24"   show="no"
	link="inc/meteoplugLiveDashboard.php"
	caption="Meteoplug"	
	title="Meteohub/plug Live Data" />
    <item   nr="25"   show="yes"		
	link="gauges/gauge.php"
	caption="Steelseries"
	title="Steel series"
	head="gauges/topcss.php" />
</item></code>