Sitestepper skeletons.

Terug naar de inhoudstafel

Doelstelling van deze Steples

• Een beschrijving geven van Sitestepper skeletons en waarom deze een essentieel deel vormen van de werking van Sitestepper,

Steplessen die best gevolgd zijn vooraleer deze Steples te starten

• Steples – onderdelen van een Sitestepper-bronpagina

Voorkennis

Logische vervolg

Wat zijn Sitestepper skeletons?

Sitestepper gebruikt skeletons als sturende elementen om het uitzicht van een webpagina te bepalen.

Een Sitestepper skeleton is een normale html-geformatteerde webpagina, waarin op bepaalde plaatsen een aanduiding geplaatst is die zal aanduiden welke bronpagina's van de projectboom moeten worden toegevoegd aan de skeleton teneinde een volledige webpagina te genereren.

Dezelfde skeleton zal worden gebruikt voor alle webpagina's in all te genereren talen. Het is dan ook aan te raden om in de skeleton dan ook alleen de grafische elementen van de paginaopbouw op te nemen en de teksten onder te brengen in aparte bronteksten.

Koppelen van een skeleton aan een pagina

In de paginaparameters kan aan elke pagina in de projectboom een skeleton worden gekoppeld. In afbeelding 1 is de pagina 'fotos' gekoppeld aan de skeleton 'default'.

Voorbeeld van een Sitestepper skeleton

De gekleurde voorbeeldpagina is hier nogmaals (verkleind) herhaald ter referentie, waarna de gekoppelde skeleton wordt getoond met de lijnen die de bronpagina's zullen invoegen in de skeleton weergegeven in dezelfde kleurcodering als de kleurcodering van de afbeelding

De skeleton gekoppeld aan de bronpagina die de afbeelding hiernaast zal genereren:

De gekleurde lijnen in HTMLcode 1 komen overeen met de gekleurde delen in afbeelding 1.

StepIncl-lijnen

De StepIncl-lijnen zijn verantwoordelijk voor het samenstellen van de webpagina.

Deze lijnen zullen bij het verwerken van de skeleton aanduiden dat op de plaats en ter vervanging van de StepIncl-lijn, de inhoud van een andere pagina dient te worden toegevoegd.

De StepIncl-lijn bestaat uit de volgende 4 delen:

1. de normale html-code voor het begin van commentaar (<!--)
2. het gereserveerde woord StepIncl.
3. een steplink-keyword
4. de normale html-code voor het einde van commentaar (-->)

De StepIncl-lijnen zijn dus normale html-commentaarlijnen en zullen, als dusdanig, door elke html-editor worden genegeerd.

Builden van een pagina

In het voorbeeld van afbeelding 1 op pagina 22 zal Sitestepper op het moment dat de webpagina 'fotos' dient aangemaakt te worden:

1. de skeleton 'default' inlezen
2. alle StepIncl-lijnen herkennen
3. de inhoud van de bronpagina's aangeduid door de steplink keywords op de StepIncl-lijnen op de correcte plaats tussenvoegen in de ingelezen skeleton
4. het geheel als nieuwe webpagina onder de naam 'fotos' wegschrijven op de website

Aangemaakte webpagina

Ter illustratie is hierna de gegenereerde webpagina weergegeven, weerom met de tussengevoegde kleuren aangeduidt in dezelfde kleur als de kleurcodering gebruikt in afbeelding Afbeelding 1: Opstartscherm Sitestepper na installatie op pagina 22.

deel 1

deel 2

deel 3

Als bovenstaande html-code wordt vergeleken met de HTMLcode 1: Kleurgecodeerde skeleton van de voorbeeldpagina op pagina 45 dan zal snel duidelijk worden dat deze pagina heel wat meer lijnen bevat dan de originele skeleton.

En wat meer is: bovendien worden alle gekleurde delen toegevoegd aan elke bronpagina in de projectboom die is toegewezen aan de skeleton genaamd 'default'. Het aanpassen van één van de teksten in één van de gekleurde bronteksten (die geplaatst worden in de 'Includes' sectie van de projectboom), zal automatisch worden doorgevoerd op elke pagina die is toegewezen aan deze skeleton.

En of dat nog niet voldoende is: uiteraard kan één van de gekleurde delen ook worden gebruikt in een andere skeleton gebruikt binnen het project. Dus alhoewel bepaalde pagina's op de website een andere skeleton krijgen toegewezen (om een andere grafische layout te bekomen), toch gebruiken zij dezelfde (gekleurde) delen van de pagina's waaraan de skeleton genaamd 'default' is gekoppeld. Het aanpassen van één van de teksten in deze (gekleurde) bronpagina's, wordt dan ook nog eens doorgevoerd op alle pagina's die gekoppeld zijn aan verschillende skeletons.

Aanpassen van de gekoppelde skeleton

Elke skeleton is, net zoals alle bronpagina's, een html-bestand dat kan worden aangepast in de StepEdit html-editor.

De gekoppelde skeleton kan worden aangepast:

• het kiezen van de menu-optie 'Skeleton – Editeer skeleton' (of de Ctrl-Alt-0)
• het kiezen van 'Editeer skeleton' in de contextmenu
• het dubbelklikken van de gekoppelde skeletonnaam in de 'Skeletons' tabulatie van de 'tabbladen projectbestanden'.
  
• elk bestand in één van de bestandslijsten, kan ook worden aangepast door de 'Edit'-optie te kiezen in de contextmenu (de geselecteerde bestandsnaam wordt dan bovenaan het menu getoond)

Hoe een andere skeleton toewijzen aan een bronpagina

Een gekoppelde skeleton is een paginaparameter en kan dan ook pas worden veranderd indien de paginaparameters aanpasbaar zijn.

Paginaparameters kunnen worden aangepast door de menuoptie: 'Edit – Node data – Editeer' (of de sneltoets Ctrl-E) te kiezen. Rechts van het scherm kan ook de 'Editeer' knop worden aangeklikt.

De projectboom wordt op niet-editeerbaar gezet (te merken aan de gekleurde kleur), en de projectparameters worden aanpasbaar geplaatst (te merken aan de witte kleur van de velden).

De 'selecteer'-knop zal, na het aanklikken, alle aanwezige skeletons tonen. Door het selecteren van één van de skeletons, wordt de geselecteerde skeleton gekoppeld aan de bronpagina. De volgende maal dat de website wordt aangemaakt, dan zal de geselecteerde bronpagina de nieuwe skeleton gebruiken om de webpagina aan te maken.

De koppeling zal definitief worden door het bewaren van de paginaparameters (aanklikken van de 'Save' knop of het kiezen van de menu-optie: 'Edit – Node data – Opslaan' (of het intoetsen van de sneltoets Ctrl-S).

De 'Cancel'-knop zal de aanpassingen ongedaan maken.

Hoe een nieuwe skeleton aanmaken

Indien een nieuwe skeleton dient te worden aangemaakt (omdat een webpagina een nieuw grafisch uitzicht dient te krijgen), dan dient in de lijst getoond in Afbeelding 6: Opstartscherm na creatie van een eerste Sitestepper-project. (hierboven getoond), de optie '<new skeleton>' te worden geselecteerd.

De naam van een nieuwe skeleton kan worden ingevoerd (zie afbeelding 7).

Sitestepper zal:

• de nieuwe skeleton aanmaken in de correcte skeletonfolder
• de nieuwe skeleton automatisch toewijzen aan de geselecteerde bronpagina
• 
  een inhoud van de skeleton met naam 'Default' gebruiken als basis voor de nieuwe skeleton (m.a.w. de nieuw aangemaakte skeleton zal niet leeg zijn, maar een kopie zijn van de default-skeleton).

Automatisch toekenning van skeletons aan nieuwe pagina's

Bij het aanmaken van nieuwe pagina's zal de nieuwe pagina automatisch dezelfde skeleton toegewezen krijgen als de parent-pagina waaronder de nieuwe pagina wordt aangemaakt.

Tip: dit is trouwens één van de (goede) redenen om een logische onderverdeling aan te maken in de projectboom ☺.

Na het aanmaken van twee nieuwe pagina's ('fotos kinderen' en 'vakantiefotos') onder de reeds bestaande pagina met naam 'fotos' (waaraan zonet de skeleton 'default zonder menu' is gekoppeld), heeft Sitestepper automatisch dezelfde skeleton koppelen.

Tip: Afbeelding 9 is een deelafdruk van het rapport dat wordt gegenereerd door de menu-keuze: 'Rapporteer – keywords'. Dit rapport zal een lijst tonen van alle pagina's in de projectboom met onder meer de gekoppelde skeletons.

Hoe een skeleton toewijzen aan meerdere pagina's

Sitestepper maakt het zeer gemakkelijk om skeletons toe te wijzen aan een aantal bronpagina's in de projectboom, voor zover zij aanwezig zijn onder eenzelfde parent-pagina.

Selecteer de parent-pagina, en kies de menu-optie 'Node – Meer acties... - vervang skeleton'.

Het volgende selectiescherm zal worden getoond.

Na het selecteren van één van de aanwezige skeletons, zullen én de parent, én alle kinderen van de geselecteerde pagina de geselecteerde skeleton toegewezen krijgen.

Ter info: een confirmatie zal worden gevraagd vooraleer de toekenning gebeurt.

Terug naar de inhoudstafel