Overzicht en basis info over skins

Hoe Cotonti een webpagina opbouwt


Je kan Cotonti zien als een "domme machine", het neemt gewoon data van de MySQL database en stuurt het naar de client (webbrowser) via een template-motor, de "skin".


Skin - een set van bestanden xxx.tpl in folders binnen de /skins folder (bijvoorbeeld: /skins/myskin)
.TPL bestand - een bestand gemaakt van simpele HTML code, plus enkele "tags"

Tag - code tussen accolades ( {} ), tussen de HTML code geplaatst zoals:

    {PAGE_TITLE}
    {USERS_DETAILS_AGE}


Bijna alle pagina's (uitgezonderd popups) zijn op de volgende manier opgebouwd:

Systeem stukken:


Om te beginnen, Cotonti connecteerd met de MySQL database, neemt wat globale data, laad de levels, de categorien, statistieken en doet een aantal andere acties. Op dit moment is er nog niks verzonden naar de client (webbrowser).

De "header" :

Dan wordt het bestand /system/header.php geladen
Dit bestand geeft vooral de HTML code weer voor het bovenste gedeelte van de website.
Dit gebeurd door het TPL bestand : skins/.../header.tpl

De "body" :

Dan wordt de body van de pagina geladen, en zoals voorheen, HTML code wordt gemaakt voor het middenstuk van de pagina, nogsteeds met een skinbestand.


De "footer" :

Dan wordt /system/footer.php geladen.
Deze geeft de HTML code weer voor het onderste stuk van de website.
En opnieuw, dit gebeurt dmv een TPL bestand : skins/.../footer.tpl


Dus de pagina is altijd opgebouwd uit 3 verschillende delen :


- De "header" (de top) : Altijd header.tpl
- De "body" van de pagina (het middenstuk) : Een bestand *.tpl
- De "footer" (het onderste gedeelte) : Altijd footer.tpl

De "body" kan de home pagina, de forums, een event, de gebruikerslijst, het administratie paneel, een plugin, etc zijn.


Skins en tags - overzicht


#1. Skins :


Een "skin" is simpelweg een combinatie van TPL bestanden, TPL staat voor "template".
Een TPL bestand is gemaakt van HTML code, plus "tags".

In bijna alle pagina's , de HTML die verzonden wordt naar de webbrowser is gemaakt door3 TPL-bestanden, de één na de anderen, in deze volgorde :

    1: header.tpl
    2: Een TPL die afhangt van welke pagina weergegeven wordt
    3: footer.tpl

Bijvoorbeeld, Cotonti zal de homepage weergeven door gebruik te maken van : header.tpl + index.tpl + footer.tpl



Voor de forums home het gebruikt : header.tpl + forums.sections.tpl + footer.tpl

Alle skins zijn geladen in header.tpl

Dus als je van plan bent je eigen skin te maken, de snelste en gemakkelijkste manier is gebruikt te maken van een officiele skin en eerst de header.tpl, footer.tpl en het CSS bestand aan te passen. Door aleen deze 3 bestanden aan te passen krijg je al een interessant resultaat.

Voor enkele redenen, de popups voor de waarderingen en de enquetes volgen deze manier niet, deze alleenstaande pagina's hebben hun eigen header en footer in hun hoofd TPL bestand.

#2. Tags :


Tags zien er als volgt uit: {XXX_YYY}

In het kort, een tag is een object dynamisch gemaakt door PHP code, hierin zijn er waardes zoals strings, HTML code, URLs, foto's, etc.

Noteer dat tags die niet "global" zijn, zullen alleen werken in een specifiek TPL bestand. De naam van de tag geeft dikwijls weer waar deze tag geldig is.
(bijvoorbeeld: tag {PAGE_XXX} zal alleen werken in page.tpl, {COMMENTS_XXX} zal alleen werken in comments.tpl enz.)

Voor de volledige lijst van tags, bekijk TPL Tags Repository. Als je van plan bent een skin te maken voor Cotonti, dit zal een hulpmiddel zijn dat je veel zal gebruiken!

#3. Globale tags :


Globale tags zijn een speciaal soort tags, geldig in alle skinbestanden.
Meestal komen deze tags van PHP code variabelen, of van de configuratie tabel, of van globale plugins.

Alle globale tags zien er als volgt uit : {PHP.tagnamehere}

Voor de volledige lijst van globale tags, bekijk Global Tag Listing

Voorbeelden, sommige veel voorkomende globale tags :

{PHP.cfg.adminemail}
{PHP.cfg.maintitle}
{PHP.cfg.version}
{PHP.cfg.mainurl}
{PHP.usr.name}
{PHP.usr.level}
{PHP.out.copyright}


No comments yet
Only registered users can post new comments