Введення в шаблонизатор Smarty

17

Від автора: Однією з найважливіших завдань будь-якого хорошого веб-розробника є поділ логіки сайту від його подання (дизайну). Це розділення забезпечує декілька переваг:

а) гнучкість програми – чіткий поділ логіки від дизайну дозволяє програмістам вносити зміни в логіку і структуру сайту, не зачіпаючи його оформлення, і в той же час дає можливість дизайнерам змінювати зовнішній вигляд сайту і при цьому не зачіпати логічну частину веб – додатки;

б) код веб-додатки стає чистим і елегантним;

Думаю багато веб-розробники, стикалися з цією проблемою – рішенням цієї задачі є застосування шаблонів. У цьому уроці ми будемо вивчати застосування шаблонів з використанням шаблонизатора Smarty.

Введення в шаблонизатор SmartyВведення в шаблонизатор Smarty

1. Формування завдання

Давайте для початку визначимося, що ж таке шаблон? Шаблон — це досить широке поняття, але якщо говорити простою мовою – це файл (документ), зазвичай в html або tpl форматі, який містить в собі html – теги (оформлення та структуру веб-додатки), а також спеціальні мітки, замість яких підставляються дані з логічної частини даних. Підстановкою даних і формуванням остаточного вигляду веб-додатки займається шаблонизатор.

Існує величезна безліч готових шаблонизаторов для PHP. Звичайно, шаблонизатор можна написати і самому придумати свої мітки шаблону і розробити алгоритм заміни цих міток. Але цей варіант не дуже зручний, якщо Ваш веб-застосунок будуть обслуговувати інші програмісти, або дизайнери, так як в цьому випадку їх доведеться присвячувати в нюанси Вашого шаблонизатора. Тому краще всього використовувати готове перевірене рішення з гарним функціоналом і якісною документацією.

Smarty – найбільш популярна і поширена система шаблонів для PHP. Робота Smarty полягає в компіляцію шаблонів. Це означає, що Smarty послідовно зчитує розмітку файлу шаблону і створює на їх основі готовий сценарій PHP, цей сценарій створюється один раз, а далі просто виконується. Smarty містить в собі велику кількість функцій, які дозволяють створювати шаблони складну логіку (якщо вона потрібна для правильного відображення даних): підключення інших шаблонів, циклічний розбір масиву і т. д. Звичайно, Ви можете і не створювати складну логіку шаблону, а обмежитися лише використанням чистого тексту і змінних.
На цьому вступна частина закінчена і можна приступати до вивчення.

2. Установка Smarty

Скачати Smarty можна з офіційного сайту http://www.smarty.net/, перейшовши на вкладку Download. На момент створення уроку остання стабільна версія це Smarty 3.1.7, її і викачуємо. При розпакуванні архіву ми бачимо папку Smarty 3.1.7, а в ній ще файли і папки:

demo – демонстраційний приклад використання шабонизатора;

libs – папка з дистрибутивом Smarty;

різні текстові файли readme, опис умов копіювання, опису відмінностей від більш старих версій).
Для установки Smarty необхідно скопіювати папку libs (з архіву) в кореневий каталог Вашого веб-додатки. Перелік файлів і папок каталогу libs повинен бути таким:

libs/
Smarty.class.php
SmartyBC.class.php
debug.tpl
sysplugins
plugins

Потім створити чотири директорії, з яких Smarty буде читати свої конфігураційні файли і файли шаблонів. За замовчуванням ці директорії мають назву: templates/, templates_c/, configs/, cache/(ці каталоги Ви можете назвати так, як Вам захочеться, але при цьому потрібно буде вказати шаболнизатору на їх назви – це ми розглянемо далі). Таким чином каталог з Вашим веб-додатком повинен бути наступного виду:

www.example.com/(або папка з Вашим веб-додатком)
libs/
Smarty.class.php
SmartyBC.class.php
debug.tpl
sysplugins
plugins
templates
templates_c
configs
cache
index.php

Давайте розглянемо, для чого потрібні створені чотири каталогу:

templates – тут зберігаються Ваші створені шаблони, шаблони Smarty створюються у форматі tpl);

templates_c – в цей каталог шаблонизатор записує скомпільований шаблон, на основі шаблону в каталозі templates;

configs – каталог для зберігання файлів конфігурації;

cache – каталог для зберігання кешованих файлів шаблону.

3. Створення простого скрипта на основі Smarty

Тепер коли Smarty встановлено та створені необхідні каталоги давайте створимо першу сторінку. Для цього насамперед необхідно підключити клас Smarty до нашого скрипта і створити об’єкт цього класу(вся логіка нашого скрипта буде у файлі index.php):

Тепер коли Smarty підключений і створений об’єкт його класу, давайте створимо змінну $name, з довільним значенням, та обміняємо це значення в Smarty і далі виведемо наш шаблон на екран(шаблон ми створимо нижче).

Так виглядає код файлу index.php:

assign(‘name’,$name);
$smarty->display(‘main.tpl’);
?>

Для тих хто мало знайомий з обьектно-орієнтованим програмуванням на PHP, $smarty – це об’єкт нашого класу Smarty(),assign() і display() – це його методи(так називаються функції класу). Для доступу до методу класу спочатку вказуємо об’єкт класу, далі два символи ->, далі сам метод і в дужках його параметри:

$smarty->assign(‘name’,$name);

У цьому рядку ми у об’єкта класу викликаємо метод assign з двома параметрами ‘name’, $name

Змінні передаються у шаблонизатор з допомогою методу assign() в який потрібно передати два параметри. Як Ви напевно здогадалися, перший параметр це назва змінної, другий це значення(цей метод можна викликати кілька разів, можна передавати як прості змінні, так і масиви). За допомогою методу display() ми викликаємо відображення нашого шаблону, ім’я шаблону передається як параметр звичайної рядком(назва файлу з Вашим шаблоном).

Тепер давайте створимо файл шаблону main.tpl (в каталозі templates з розширенням файлу tpl):

Передана змінна — {$name}

Як Ви бачите це звичайний html документ(тільки з розширенням tpl), тільки з спеціальною міткою {$name}, Smarty у фігурних дужках {} позначаються всі керуючі конструкції(теги) у нашому прикладі це змінна $name (та яку ми передали методом assign()). Таким чином що б відобразити в шаблоні змінну необхідно в фігурних дужках вказати ім’я змінної {$name}.

Якщо запустити скрипт на виконання на екрані браузера ми побачимо:

Передана змінна – Vasya

Це і є Ваш перший скрипт на основі шаблонизатора Smarty, як Ви бачите логіка сайту у нас міститься у файлі index.php, а зовнішній вигляд — у файлі templates/main.tpl, якщо Ви подивитеся в каталог templates_c, то побачите, що Smarty створив там скомпільований файл шаблону вміст якого і відобразив на екрані.

4. Основні керуючі конструкції шаблонів

Коментарі в шаблонах оформляються таким чином:

{* this is a comment *}

Відображення змінних в шаблонах:

{$name} – відображення простої змінної переданої Smarty з ім’ям name.

{$name[4]} – відображення п’ятого елемента масиву.

{$name.key} – відображення значення елемента масиву з ключем key, аналогічно запису в PHP $name[‘key’].

{$name$key} – відображення значення елемента масиву з ключем, значення якого зберігається у змінній $key, аналогічно запису PHP $name[$key].

{#name#} – відображення змінної name значення якої зберігається в конфігураційних файлів(перед відображенням такою зміною конфігураційний файл потрібно довантажити в шаблоні – ми це розглянемо нижче).

Умовні оператори в шаблонах.

Шаблони так само як і мова PHP підтримують умовні оператори, однак синтаксис їх небагато відрізняється від звичного нам. Кожен тег {if} повинен мати пару {/if}. {else} і {elseif} так само допустимі. Доступні всі квалификаторы з PHP, такі як ||, or, &&, and, is_array() і т. д. (більш розширений список кваліфікаторов ви можете подивитися в документації на офіційному сайті). Приклад:

{if $name == ‘Vasya’}
Передана змінна — {$name}
{else}
Інша змінна
{/if}

В даному прикладі якщо змінна $name дорівнює Vasya, то на екран виведеться Передана змінна – Vasya, якщо не дорівнює то — Інша змінна.

Цикл foreach в шаблонах.

Дуже часто в шаблон необхідно передати масив даних(наприклад вибірку з бази даннх), в цьому випадку дуже зручно використовувати цикл foreach для послідовного перебору всіх елементів масиву. Синтаксис функції foreach також схожий на синтаксис умовного оператора {if}. Кожен тег {foreach} повинен мати закриває пару {/foreach} (нагадаю, що всі теги в Smarty записують у фігурних дужках).

Синтаксис оператора foreach:

{foreach $arrayvar as $itemvar}
..дію..
{/foreach}
{foreach $arrayvar as $keyvar=>$itemvar}
..дію..
{/foreach}

Як Ви бачите синтаксис дуже схожий на PHP: $arrayvar – передається в шаблонизатор масив даних, as – ключове слово для оператора foreach (як і в PHP), $itemvar – змінна в яку буде записано значення першого елемента масиву, $keyvar – змінна в яку буде записано ключ першого елемента масиву(як і в PHP).

Оператор {capture}.

Оператор {capture} використовується для того, щоб зберегти результат обробки частини шаблону, між тегами, в якусь змінну, замість того, щоб відобразити результат. Будь вміст {capture name=’var’} і {/capture} зберігається в змінну, зазначену в атрибуті name.

Щоб вивести на екран збережені дані необхідно використовувати спеціальну змінну спеціальної змінної $smarty.capture.var, де var — значення, передане атрибуту name. Наприклад давайте збережемо результат роботи циклу {foreach} в змінну, а вже потім виведемо результат на екран.

{capture name=’var’}
{foreach $arrayvar as $itemvar}
{*..дію..*}
{/foreach}
{/capture}
{* ..дію.. *}
{* висновок на екран змінної var *}
{$smarty.capture.var}

Підключення допоміжних шаблонів.

Дуже часто необхідно в шаблон підключати додаткові шаблони, наприклад підключення шапки сайту або футера. Для цього використовується оператор {include}. Будь-які змінні, доступні в поточному шаблоні, доступні і підключається. Тег {include} повинен мати атрибут ‘file’, який вказує шлях до підключеному шаблоном. Наприклад:

{*підключаємо шапку шаблону*}
{include file=’page_header.tpl’}
{*основний шаблон*}
{*підключаємо футер шаблону*}
{include file=’page_footer.tpl’}

В прикладі до основного шаблону ми підключаємо файл шапки ‘page_header.tpl’ і файл футера ‘page_footer.tpl’.

Відображення змінних конфігураційних файлів.

Як Ви пам’ятаєте одним з обов’язкових каталогів в шаблонизаторе, є каталог configs, який зберігає в собі конфігураційні файли шаблонів (ці файли ми створюємо самі). Так от, якщо у нас є змінні, які не відносяться до логіки скрипта, а відповідають тільки за оформлення веб-додатки(колір, різні заголовки і т. д), ми можемо створити файл конфігурації(в папці configs у форматі conf), і прописати в ньому всі потрібні нам змінні. Потім довантажити цей файл шаблону і відобразити потрібні нам змінні.

Для початку давайте розглянемо, який вигляд повинен мати файл конфігурації.

Для прикладу я створив файл configs/my_conf.conf , з таким змістом:

#це коментар конфігураційного файлу

# глобальні змінні
pageTitle = «Hello world»
bodyBgColor = #000000
tableBgColor = #000000
rowBgColor = #00ff00

#секція змінних customer
[Customer]
pageTitle = «Customer Info»

Як бачите синтаксис файлу дуже простий: # — гратами позначаються коментарі, далі з нового рядка пишеться ім’я змінної і після знака одно її значення. Можна також змінні об’єднувати в секції, для цього ім’я секції потрібно прописати в дужках [ім’я сесії], але змінні з секції будуть доступні тільки після подгружения всієї секції, але про це нижче.

Після того як файл створено давайте подгрузим його в шаблон (з допомогою конструкції {config_load file=’ім’я файлу’} ):

{config_load file=’my_conf.conf’}
Змінна з конфігураційного файлу — {#pageTitle#}

Нагадаю що, якщо ви хочете показати значення змінної з конфігураційного файлу то синтаксис буде виглядати таким чином:

{#ім’я змінної#}

Якщо запустити скрипт на виконання на екрані ми побачимо — Змінна з конфігураційного файлу — Hello world, що означає що файл конфігурацій успішно подрузился і значення змінної було взято з нього. Для відображення змінних з секції файлу конфігурацій необхідно при завантаженні файлу вказати в тезі config_load атрибут section, після цього змінні в секції будуть доступні для відображення:

{config_load file=’my_conf.conf’ section=’Customer’}
Змінна з конфігураційного файлу — {#pageTitle#}

Після виконання скрипта на екрані ми побачимо — Змінна з конфігураційного файлу — Customer Info, зверніть увагу, що тепер значення змінної {#pageTitle#} взялося з секції.

5. Огляд основних методів Smarty

У випадку якщо Ви хочете змінити імена чотирьох системних директорій шаблонизатора, Вам буде потрібно вказати імена цих каталогів за допомогою наступних методів (ім’я каталогу передаємо параметром методу):

//визначимо основні директорії
//каталог з конфігураційними файлами Smarty
$smarty->setConfigDir(‘configs’);
//каталог з Вашими шаблонами в форматі tpl Smarty
$smarty->setTemplateDir(‘templates’);
//каталог з компилированными шаблонами Smarty
$smarty->setCompileDir(‘templates_c’);
//каталог у якому зберігається кеш шаблонів
$smarty->setCacheDir(‘cache’);

Вказувати ці каталоги потрібно відразу ж після створення об’єкта Smarty.

Методи для роботи зі змінними.

Нагадаю, що для передачі змінної в шаблон використовуємо метод assign(), з таким синтаксисом:

$smarty->assign(‘ім’я змінної’, ‘значення’);

Що б очистити передану в шаблон змінну застосовується метод clearAssign(‘name’), ім’я змінної передаємо методу як параметр(в даному випадку очищаємо змінну name). Приклад:

//Очищаємо змінну $name
$smarty->clearAssign(‘name’);

Можна також параметром методу, передати масив змінних, які потрібно очистити:

//очищаємо кілька змінних
$smarty->clearAssign(array(‘Name’, ‘Address’, ‘Zip’));

Для очищення всіх переданих змінних використовуємо метод clearAllAssign() (без параметрів):

//Очищаємо всі передані змінні
$smarty->clearAllAssign();

Методи для роботи з шаблонами.

Нагадаю, що виводить його на екран метод display(), параметром передаємо ім’я шаблону, наприклад (відображаємо шаблон main.tpl):

//Виводимо шаблон на екран
$smarty->display(‘main.tpl’);

Як тільки ми викликаємо метод display(), шаблонизатор перевіряє змінився наш шаблон, якщо змінився, або ми викликаємо метод перший раз – відбувається компіляція нашого шаблону і виведення його на екран браузера. Якщо шаблон не змінився то він просто виводиться на екран. За цю перевірку відповідає властивість шаблонизатора $compile_check, яке за замовчуванням дорівнює TRUE, якщо його змінити значення FALSE, то перевірки не буде, а після виклику методу display(), на екрані буде відображатися раніше скомпільований шаблон (це потрібно в тому випадку, коли Ви точно знаєте, що зміни в Ваш шаблон більше вноситися не будуть). Приклад:

//Скасовуємо перевірку на зміни в шаблоні
$smarty->compile_check = FALSE;

Видалити компільований шаблон можна за допомогою методу clearCompiledTemplate(), параметром передаємо ім’я шаблону, наприклад видалимо компільований шаблон main.tpl:

//видаляємо компільований шаблон
$smarty->clearCompiledTemplate(‘main.tpl’);

Іноді потрібно не вивести його на екран, а зберегти його відпрацьований значення в змінну. Для цього застосовується метод fetch(‘ім’я шаблону’), параметром передаємо ім’я файлу шаблону. У наступному прикладі ми зберігаємо відпрацювання шаблону в змінну, і потім виводимо його через звичну функцію echo:

//Зберігаємо відпрацювання шаблону в змінну
$var = $smarty->fetch(‘main.tpl’);
//Виводимо на екран
echo $var;

Що б отримати змінні, які вже передані в шаблон, або отримати значення однієї конкретної змінної, переданої в шаблон, потрібно скористатися методом getTemplateVars(), якщо викликати цей метод без параметрів, то він поверне масив всіх переданих шаблоном змінних, якщо в параметрі передати ім’я змінної то метод поверне її значення:

//Для прикладу виведемо на екран передані змінні шаблону
print_r($smarty->getTemplateVars());
//Виведемо на екран значення змінної name
echo $smarty->getTemplateVars(‘name’);

Якщо Ви розробляєте складне веб-додаток з великою кількістю шаблонів, то перед виведенням шаблону на екран(уникнення помилок), необхідно зробити перевірку існує виводиться шаблон чи ні, це дозволяє зробити метод templateExists(‘ім’я шаблону’), який повертає TRUE якщо шаблон існує і FALSE в протилежному випадку(параметр передаємо ім’я шаблону). Приклад:

//Перевіряємо чи існує шаблон
if( !$smarty->templateExists(‘main.tpl’) ){
exit(‘Такого шаблону не існує’);
}

У прикладі якщо шаблону main.tpl не існує, то відбувається завершення роботи скрипта, але в реальному прикладі треба було б викликати шаблон сторінки, яка виводить на екран помилки програми – це вже на Ваш розсуд від того що Ви робите.

6. Кешування в Smarty

Давайте розглянемо останню тему сьогоднішнього уроку — кешування в Smarty. Кешування застосовується для прискорення роботи методів display() або fetch(), за допомогою збереження результатів їх роботи в спеціальний файл, який зберігається в папці cache. Якщо кешування дозволено і файл доступний (вже збережений раніше), то замість повторної обробки шаблону, виводиться кешована версія виклику. Кешування може значно прискорити роботу, особливо у разі тривало оброблюваних шаблонів. Так як результат роботи методів display() або fetch() кешується, один файл кеша може складатися з декількох файлів шаблонів, конфігураційних файлів і т. д.

Але кешуванням потрібно користуватися обережно, потрібно чітко розуміти, що Ви кэшируете. Наприклад, якщо у Вас є головна сторінка скрипта, вміст якої змінюється рідко, в цьому випадку її можна кешувати на годину і більше. Якщо ж у Вас сторінка, на якій вміст змінюється дуже часто, то сенсу в кешування такої сторінки немає.

Для початку потрібно включити кешування (за замовчуванням воно вимкнено). Включити можна у двох режимах: перший – кешування з кешуванням сторінок на одну годину (час цього режиму встановлено за умовчанням), і другий – кешуванням з заданим часом кешування (ви цей час задаєте самі).

Спочатку давайте розглянемо перший варіант, і в наш найперший приклад після створення об’єкта Smarty, допишемо наступне:

//Включаємо кешування сторінки(за замовчуванням на одну годину)
$smarty->setCaching(Smarty::CACHING_LIFETIME_CURRENT);

Ось як виглядає файл index.php. Шаблон залишився без змін.

setCaching(Smarty::CACHING_LIFETIME_CURRENT);
//Створюємо змінну для прикладу
$name = ‘Vasya’;
//Передаємо змінну в шаблонизатор Smarty
$smarty->assign(‘name’,$name);
//Виводимо на екран
$smarty->display(‘main.tpl’);
?>

Метод setCaching() включає кешування сторінки, параметром до нього необхідно передати – який режим кешування потрібно активувати, в даному прикладі ми передаємо константу класу CACHING_LIFETIME_CURRENT, яка включає перший варіант кешування(кешування на одну годину). Далі при оновленні сторінки ми все побачимо Передана змінна – Vasya, але зверніть увагу, якщо ми в скрипті змінимо значення змінної $name на будь-яке інше значення, то змін ми не побачимо, скільки б не оновлювали сторінку (тільки коли пройде одну годину і час життя кешувати файлу закінчиться) – сторінка закэширована. Її файл кеша Ви можете побачити в каталозі cache. Тепер давайте видалимо ваш файл, з допомогою методу clearCache(‘ім’я шаблону’), параметром якого передаємо ім’я шаблону (кеш якого ми хочемо видалити). Допишемо перед методом display() наступний код:

//Видалимо кеш шаблону
$smarty->clearCache(‘main.tpl’);

А сам метод display() закомментіруем. Після оновлення сторінки браузера, подивіться в каталог cache, Ви побачите, що ваш файл пішов. Далі расскомментируем метод display(), і оновимо браузер – видно що змінна відобразилася із змінами, і з’явився файл кешу в папці cache.

Щоб включити режим кешування повідомлень із заданим часом кешування треба метод setCaching() передати параметром константу класу CACHING_LIFETIME_SAVED, а далі за допомогою методу setCacheLifetime (час кешування) встановити час кешування (передати параметром час у секундах):

setCaching(Smarty::CACHING_LIFETIME_SAVED);
//Час кешування
$smarty->setCacheLifetime(20);
//Створюємо змінну для прикладу
$name = ‘Vasya’;
//Передаємо змінну в шаблонизатор Smarty
$smarty->assign(‘name’,$name);
//Виводимо на екран
$smarty->display(‘main.tpl’);
?>

Так виглядає код файлу файл index.php з включеним кешуванням на 10 секунд. Після оновлення сторінки змініть значення змінної name на будь-яке інше значення, і оновити браузер, Ви побачите на екрані нічого не змінилося, але почекайте 20 секунд (час кешування), і оновіть сторінку заново – тепер зміни вступили в силу (час кешування минув).

Іноді буває корисним знати кэширована сторінка чи ні, в цьому нам допоможе метод isCached (ім’я шаблону), який повертає TRUE або FALSE, залежно кэширована сторінка чи ні.

//Перевіряємо кэширована сторінка
if($smarty->isCached(‘main.tpl’)) {
//Ваш код
}

Висновок

На цьому все, даний урок завершений, сподіваюся, Вам було цікаво. Нагадаю, що на офіційному сайті, є детальна інформація про всі методи і властивості шаблонизатора.

Всього доброго і вдалого Вам кодування!

Ваші побажання та зауваження буду радий побачити в коментарях до статті!