3 Шаблонізація за допомогою smarty|
Розділення оформлення і змісту - одвічна проблема веб-сервера-розробника. Для утримувача невеликого сайту в декілька сторінок такої проблеми не виникає. Зміна дизайну, або інша правка зовнішнього вигляду сторінок для нього не представляє труднощів. Проте для крупних веб-ресурсів|, порталів змішення цих двох найважливіших компонентів сайту: оформлення і зміст - просто неприпустимо. Інакше сайт стає настільки неповороткий, що власник ресурсу втрачає над ним управління.
Зіткнувшись одного разу з такою проблемою, сайтобудівники| почали сушити голову над тим, як зробити так, щоб інформація не прив'язувалася ніяким| чином до дизайну і навпаки, щоб зовнішній вигляд всього сайту мінявся буквально одним рухом руки. Необхідно сказати, що способу ідеального розділення оформлення і змісту в наші дні поки не знайдено. Але все таки створені певні напрацювання і технології, які дозволяють максимально наблизитися до цього ідеалу. Перш за все це технологія використання шаблонів.
Поняття "шаблон" задоволене обширне. Але найчастіше під шаблоном розуміється якийсь документ (зазвичай у форматі HTML|), що містить в собі все оформлення ресурсу, або тільки його частини, а також спеціальні мітки, які в процесі генерації сторінки замінюються на інформаційні дані.
Серед величезної кількості шаблонних систем можна виділити дві групи:
Системи, покликані повністю відокремити оформлення від програмування.
Системи, покликані відокремити бізнес логікові (роботу з даними) від логіки візуального уявлення.
У першому випадку програміст займається підготовкою всіх даних в кінцевому вигляді, тобто віддає їх шаблону простими змінними. Верстальник же тільки підставляє їх в потрібне місце макету, задаючи відповідно до побажань дизайнера якими квітами, шрифтами вони будуть відображені. При цьому верстальник не використовує ніякої коди і взагалі може не мати анінайменшого уявлення про програмування.
У другому випадку верстальникові дається більше свободи. Тепер він самостійно може, наприклад, обрізати рядок тексту до заданої величини, щоб вона не розтягувала дизайн, представити переданий програмістом масив даних у вигляді таблиці, тексту, діаграми. В цьому випадку верстальникові доводиться вивчити синтаксис шаблонів. Це кінцево мінус, але невеликий: зазвичай мова шаблонів не така вже і складна і складається з 10-20 конструкцій і правил.
Для роботи з шаблонами використовуються спеціальні веб-сервера-застосування (якщо говорити про веб-розробках|), які можуть володіти різними властивостями і функціями. Але найчастіше їх роль зводиться до того, щоб замінювати вищезгадані мітки на інформаційні блоки і сполучати отримані частини сторінок в єдине ціле.
Напевно, у всіх мовах вебпрограмуванняі| є подібні інструменти для роботи з шаблонами: у Perl| це FastTemplate| (який, до речі, існує і для PHP|, але його використання не рекомендується, оскільки прийнятні для роботи версії відносяться ще до третьої версії PHP|), відносно PHP| - це великий і багатофункціональний Smarty|, а також ряд інших дрібніших "шаблонізаторів|".
Smarty| - одна з найкрупніших розробок подібного роду. Реалізований він, як і практично всі застосування подібного типу, у вигляді класу.
Smarty| - це компілюючий обробник шаблонів для PHP|. Кажучи чіткіше, він надає один з інструментів, які дозволяє добитися відділення прикладної логіки і даних від уявлення. Це дуже зручно в ситуаціях, коли програміст і верстальник шаблону - різні люди.
Цей "шаблонізатор|" має величезну кількість можливостей: він не тільки здійснює заміну виділених ділянок шаблону вказаними даними, але і надає використання усередині шаблону виконуваних ділянок, функцій, конфігураційних файлів і інше.
3.1 Використання Smarty|
Smarty| розташований в теці modules/Smarty, конфігураційний файл smarty|.php, який визначає шляхи і створює об'єкт, знаходиться в теці config|.
Smarty| підключається в ті файли, в яких відбувається безпосереднє виведення даних на екран. Розглянемо виведення статті за допомогою шаблонізатора|.
За виведення статті відповідає файл article_print|.php, який розташований в кореневій директорії. Розглянемо код цього файлу:
<?php
error_reporting|(E_ALL| & ~E_NOTICE);
if|(!defined("ARTICLE|")) return|;
if|(!preg_match("|^|[\d]+$|",$_GET['id_position|'])) return|;
if|(!preg_match("|^|[\d]+$|",$_GET['id_catalog|'])) return|;
// Обробка тексту перед виводом
require_once|("dmn/utils/utils.print_page.php");
// Виводимо список каталогів
$query = "SELECT| * FROM| $tbl_paragraph
WHERE| id_position| = $_GET[id_position|] AND|
id_catalog| = $_GET[id_catalog|] AND|
hide| = 'show|'
ORDER| BY| pos|";
$par = mysql_query|($query);
if|(!$par) exit|("Помилка при зверненні до параграфів позиції");
$type_catalog = "";
// SMARTY| блок
$smarty->assign ("mode","article_print|");
//----- Кінець SMARTY-блока| ------//
if|(mysql_num_rows|($par)> 0)
{
$par_index = 0;
while|($paragraph = mysql_fetch_array|($par))
{
// З'ясовуємо тип вирівнювання параграфа
switch|($paragraph['align|'])
{
case| 'left|':
$paragraph_align[] = "left|";
break|;
case| 'center|':
$paragraph_align[] = "center|";
break|;
case| 'right|':
$paragraph_align[] = "right|";
break|;
}
// Зображення позиції
$image_print = "";
$query = "SELECT| * FROM| $tbl_paragraph_image
WHERE| id_paragraph| = $paragraph[id_paragraph|] AND|
id_position| = $_GET[id_position|] AND|
id_catalog| = $_GET[id_catalog|] AND|
hide| = 'show|'";
$img = mysql_query|($query);
if|(!$img) exit|("Помилка при витяганні зображень");
if|(mysql_num_rows|($img))
{
// Витягуємо зображення
unset|($img_arr);
while|($image = mysql_fetch_array|($img))
{
$images_alt[$par_index][] = $image['alt|'];
$images_small[$par_index][] = $image['small|'];
$images_name[$par_index][] = $image['name|'];
$images_big[$par_index][] = $image['big|'];
$images_id[$par_index][] = $image['id_image|'];
$size = @getimagesize($image['big|']);
$images_size[$par_index][] = $size;
}
}
// З'ясовуємо тип параграфа
switch|($paragraph['type|'])
{
case| 'text|':
$paragraph_class[] = "text|";
break|;
case| 'title_h1|':
$paragraph_class[] = "h1|";
break|;
case| 'title_h2|':
$paragraph_class[] = "h2|";
break|;
case| 'title_h3|':
$paragraph_class[] = "h3|";
break|;
case| 'title_h4|':
$paragraph_class[] = "h4|";
break|;
case| 'title_h5|':
$paragraph_class[] = "h5|";
break|;
case| 'title_h6|':
$paragraph_class[] = "h6|";
break|;
}
$paragraph_body[] = $paragraph['name|'];
$par_index ++;
}
$smarty->assign ("images_alt",$images_alt|);
$smarty->assign ("images_small",$images_small|);
$smarty->assign ("images_name",$images_name|);
$smarty->assign ("images_big",$images_big|);
$smarty->assign ("images_size",$images_size|);
$smarty->assign ("images_id",$images_id|);
$smarty->assign ("paragraph_align",$paragraph_align|);
$smarty->assign ("paragraph_class",$paragraph_class|);
$smarty->assign ("paragraph_body",$paragraph_body|);
}
?>
Як видно з коди файлу article_print|.php, спочатку визначається змінна mode|, яка використовується в шаблоні, щоб визначити режим виведення головної сторінки.
Далі, після отримання даних з бази даних і відповідних перевірок, визначаються змінні smarty|. Тепер ці змінні зберігають текст статті і шляху до зображень.
Виведення шаблону здійснюється у файлі articles|.php.
// SMARTY| блок. Підключення шаблону
$smarty->display('index|.tpl');
//----- Кінець SMARTY-блока| ------//
Розглянемо код шаблону index|.tpl
{if| $mode == 'article_print|'}
<table| class="imagetable|" border=0|>
section| name=| sec_aprint| loop=$paragraph_body|}
<tr><td|>
section| name| = sec_aprint_images| loop=$images_small|[sec_aprint|]}
<а href=#| onclick="show_img| ('{$images_id[sec_aprint|][sec_aprint_images|]}', '{$images_size[sec_aprint|][sec_aprint_images|][0]}', '{$images_size[sec_aprint|][sec_aprint_images|][1]}' ); return| false"><img| src| = '{$images_small[sec_aprint|][sec_aprint_images|]}' alt=|'{$images_alt[sec_aprint|][sec_aprint_images|]}'> </a>
/section|}
</td></tr>
<tr><td|>
if| $paragraph_class[sec_aprint|] !='text' && $paragraph_class[sec_aprint|] !=null}<{$paragraph_class[sec_aprint|]}>{$paragraph_body[sec_aprint|]}</{$paragraph_class[sec_aprint|]}>
else|}
<p style='text-align|:{$paragraph_align[sec_aprint|]}'>{$paragraph_body[sec_aprint|]}</p>
{/if|}
</tr></td>
/section|}
</table>
{/if|}
Як видимий, циклічно виводиться кожен параграф, для якого, вкладеним циклом, виводяться зображення, які відносяться до цього параграфа (Рис 3.1).
Рисунок 3.1 – Виведення статті за допомогою шаблонізатора| Smarty|