Table of Contents
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
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:
<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>
Als voorbeeld een klein deel van de standaard weather28/wsMenuData.xml uit de download
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"
<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>
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 . Of een verwijzing naar een $SITE instelling . Voorbeeld: show="wdlPage" verwijst naar $SITE["wdlPage"]. Als die instelling op false gezet is wordt de pagina niet in het menu opgenomen | yes |
| hide | 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 | |
| top | 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" U moet alle mappen beneden de weather28/ map vermelden. | |
| 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. U moet alle mappen beneden de weather28/ map vermelden. | |
| 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:
<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>
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 Horizontaal of Vertikaal menu.
Breedte van het menu aanpassen
Standaard is het menu 140px breed via een setting. Voorbeeld hoe te wijzigen naar 180px;
$SITE['menuWidth'] = '180'; // 140 = default width of Vertical menu DO NOT CHANGE
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
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.
Vervang een enkele item in een drop-down menu
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)
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
De menu xml zier er dan zo uit ⇒
en het nieuwe menu is ook OK:
<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>
