TemplateEngine: Smarty
0. Inleiding
1. Voor designers
2. Voor coders
3. Meer
Inleiding
Smarty is een template/presentatie engines.
Het doet niet alleen aan templating, maar het is ook een "framework" dat je toelaat om je code of je design te veranderen zonder al teveel problemen.
Wat is een template engine?
Normaal gezien gaat een designer een site maken, en de coder deelt dan de HTML en zet zijn code erin. Dat is de theoretische situatie! Maar in de praktijk gebeurt dit zo niet: je klant wilt een pagina laten aanpassen of ze radicaal veranderen.
Dan kom je natuurlijk in grote problemen. Een template engine laat toe om de design en de code zeer strikt gescheiden te houden, zodat de designer minder rekening moet houden met de coder en omgekeerd.
Dit lijkt natuurlijk fantastisch; maar er is een negatief punt aan verbonden: de designer zal een paar basiscodes moeten leren gebruiken om de variabelen in zijn code te kunnen gebruiken.Om Smarty te installeren kun je best gewoon de bijgevoegde handleiding volgen. Meestal komt het erop neer dit in een directory te zetten in je server-root.
Dan kun je Smarty op verschillende manieren inroepen:
* voeg het toe aan je include path (in je php-configuratie bestand)
* ofwel geef je bij elke aanroeping het pad naar je smarty bestand
Persoonlijk roep ik Smarty zo aan:
define('SMARTY_DIR', $_SERVER['DOCUMENT_ROOT'].'smarty/');
require(SMARTY_DIR . 'Smarty.class.php');
|
Waarom een presentatie-programma?
Smarty laat je veel meer doen dan enkel variabelen te vervangen. Er zitten geavanceerde functies in die de designer tot een bepaald niveau toelaten tekst te manipuleren.
Een voorbeeld hiervan is dat je een cijfer in een variabele zou kunnen formateren, controlestructuren gebruiken, met sections kun je over arrays gaan, ... ga zo maar door.
Waarom zou je Smarty over TemplatePower ("TP") gebruiken?
Ik moet toegeven dat ik nooit heb gewerkt met TP. Maar uit de roddels die ik heb gehoord is TP gemakkelijker, maar ook minder krachtig. Smarty zou meer geavanceerde opties hebben.
Een andere reden is dat Smarty sneller zou zijn dankzij de caching van documenten.
Smarty heeft veel meer functies die niet enkel gericht zijn naar het vervangen van variabelen.
Waar kun je Smarty vinden?
heel simpel; op http://smarty.php.net!
Daar vind je alle bestanden en een heel volledige documentatie cursus.
 top
1. Voor designers
Hier vindt je de basiscodes die een designer zou moeten kennen om Smarty te gebruiken.
Variabelen
Variabelen zijn zoals in PHP waarden die afgedrukt kunnen worden. Zij worden meestal bepaald vanuit de PHP code
Om een variabele af te drukken gebruik je dit:
In een webpagina zou dit er zo uitzien
<html>
<body>
Welkom {$naam}!<br />
</body>
</html> |
De accolades zijn de standaard pattern-delimiters. Smarty zal op accolades zoeken naar informatie die voor de template engine bestemd is. Mocht je dit niet goed vinden, kun je dit veranderen.
Achter een variabele kunnen er modifiers staan, dit is een pipe-sign ( | ) en laat toe om bepaalde bewerkingen op de inhoud van de variabele te doen (zoals het veranderen van de hoofdletters, ...). Dit is voor een meer geavanceerde tutorial over Smarty.
Commentaar
De commentaar is enkel zichtbaar in de template: het komt nooit op het scherm van de gebruikers.
| {* Dit is maar blah blah blah *} |
Als je dus aan een website zou bouwen over windows zou je code er zo uit kunnen zien
<html>
<body>
Welkom {$naam}!<br />
{* insert hack here *}
</body>
</html> |
En dan weet een andere designer (of jijzelf) dat er daar nog iets moet komen...Include
De meeste HTML-pagina's bestaan uit 3 delen: een hoofding, de inhoud en een 'voet'-deel.
Smarty laat je toe om andere templates in je template in te voeren door de include te gebruiken.
| {include file="header.tpl"} |
Deze code zal in de huidige template "header.tpl" inroepen en vertonen.
Als je variabelen in je toegevoegd bestand wilt zetten kun je dit doen door ze gewoon als argumenten bij te zetten:
| {include file="header.tpl" hoofding="pagina"} |
Waarbij "hoofding" een variabele is die in je header staat.
if-structuur
Smarty heeft een redelijk complexe if-structuur; om de leesbaarheid te verhogen mag je de vergelijkingstekens in volle tekst schrijven.
Aangezien dit maar een introductiecursus is, zal ik de vergelijkingstekens gelijk in PHP tonen.
{if <voorwaarde> }
html code
{else}
html code
{/if} |
In een uitgewerkt voorbeeld krijg je dit:
Dit product is
{if bedrag < 5 }
goedkoop .
{elseif bedrag < 10}
een goede koop.
{elseif bedrag < 50}
duur.
{else}
de moeite niet!
{/if} |
Loops (secties)
Hiermee heb ik het meeste problemen gehad.
Aangezien Smarty oneindig veel geneste loops toelaat vraagt dit wat aandacht.
{section name=iteratie loop=$aantal}
{$variabelenaam.iteratie}
{sectionelse}
Variabelenaam heeft geen iteraties
{/section} |
Uitgelegd:
Het name argument is welke naam de iteratie gaat krijgen. Hiervoor kies je eenderwelke string, maar best iets dat geen key is in je array of iets dat op je variabele lijkt. Persoonlijk gebruik ik meestal "draai" en als ik meerdere geneste iteraties heb, dan gebruik ik "draai1", "draai2" enz.
Het loop argument is het aantal keren dat de herhaling gedaan moet worden. Indien je een array hebt, mag je hier gewoon je array zetten, zodat je automatisch evenveel keer gaat herhalen als er elementen in de array zijn.
Uitgewerkt kun je dit krijgen
Mijn vrienden zijn:
{section name=iteratie loop=$vrienden}
{$vrienden[iteratie]}<br />
{/section} |
Indien vrienden een array is met daarin alle namen van mijn vrienden, zal dit telkens de naam en een enter afdrukken.
Een complexer voorbeeld is:
<table>
{section name=user loop=$userID}
<tr
{if $smarty.section.user.iteration is odd}
bgcolor=#efefef
{else}
bgcolor=#ffffff
{/if}
>
<td> ID = {$userID[user]} </td>
<td> Name = {$name[user]} </td>
<td> Address = {$address[user]} </td>
</tr>
{sectionelse}
<tr>
<td>
Er is geen gebruiker.
</td>
</tr>
{/section}
</table> |
Dit zal om de twee lijnen een andere kleur geven en de info uit userID, name, address afdrukken.
top
2. Voor coders
Ik neem aan dat je je smarty goed kunt inroepen, en dus dat dit werkt. Anders kun je uit het eerste voorbeeldje het pad aanpassen om zo je smarty-object te kunnen aanmaken.
De eerste twee lijnen zullen het bestand inroepen en een object aanmaken.
De volgende lijn zal een variabele toekennen. In dit geval zal je de variabele $SiteNaam kunnen gebruiken in je template.
De laatste lijn zegt dat hij de template index.tpl moet gaan opzoeken, en die tonen.
<?php
require 'Smarty.class.php';
$smarty = new Smarty;
$smarty->assign('SiteNaam', 'Sitemasters');
$smarty->display('index.tpl');
?>
|
Mijn site is {$SiteNaam}! |
(Links zie je de code, rechts een voorstel voor de template)Je kunt ook arrays toekennen aan een variabele (zie de sections voor de designers)
<?
$sites = Array("sitemasters.be", "apple.com", "nosoftwarepatents.com");
$smarty->assign("WebSites", $sites);
?> |
Je variabele in smarty zal dan $WebSites worden.
3. Meer
Meer kun je vinden op http://smarty.php.net.
Daar staat een uitgebreide tut over smarty, met alle mogelijkheden.
Ik hoop dat ik tijd heb om later de geavanceerde tutorial te schrijven, want dit is wat Smarty net zo interessant maakt.
Je mag je vragen natuurlijk aan mij stellen of op het forum.
Op Google zul je ook meer informatie ivm. Smarty kunnen vinden.
top
|
Wat is jouw favoriete javascript framework? (S: 18, R: 2)
