Использование smarty для создания сайта. Статьи. wb0.ru - Все для веб-мастера, on-line сервисы

Использование smarty для создания сайта

Как написано в Википедии smarty - это компилирующий обработчик шаблонов для PHP, один из инструментов, позволяющих отделить прикладную логику и данные от представления.

А, говоря простым языком, это означает следующее. Как Вы знаете, сайт состоит из различных информационных блоков (новости, навигационное меню, реклама, ссылки) и просто графической обшивки (дизайна). Даже сам основной контент сайт, это всего лишь блок, который содержит индивидуальный текст для каждой странички сайта.

Теперь представьте себе, каждый такой блок хранится в обычной переменной, а переменная вставляется в обычную html страничку, и в результате получается уникальная страничка. А уникальна она тем, что в каждую страничку вставляется переменная, которая отличное от предыдущей странички значение.

Таким образом и работает шаблонная технология smarty. У Вас есть шаблон страницы, красиво оформленной html странички, но без текстового наполнения. Текст Вы можете, например, получать из базы данных, заносить его в переменную, потом переменную вставлять в оформленную html страничку и выдавать ее пользователю. Что же тут особенного, а то, что для создания красивого сайта, Вам понадобится лишь одна или несколько универсальных страничек, красиво оформленных, а создавать на основе ее Вы можете 1000-чи уникальных информационных страниц сайта.

Давайте, рассмотрим небольшой пример созданного сайта на основе шаблонной технологии Smarty и Вам все станет понятно. Тест-платформой сделаем бесплатно скачанный шаблон с уже готовыми рисунками и библиотекой css. Сайт, который мы собираемся сделать будет выглядеть примерно как на рисунке. Как Вы видите на рисунке, сайт будет состоять из навигационного меню (слева, вверху), новостного блока (слева, внизу) и контентной (текстовой) части (справа, ниже). Таким образом, наш шаблон будет состоять из всех элементов, кроме вот этих блоков. На каждой страничке сайта будет свой уникальный контент. А что касается новостей и навигационного меню, то хотя они и будут повторятся, однако они могут динамически изменятся, например, добавятся свежие новости, или появится новое подменю.

Итак, пример динамического сайта с использованием smarty будет состоять 3-x шагов:

  • 1 шаг - создать папку с библиотекой smarty, которую надо подключить;
  • 2 шаг - написать код php, в котором будут наши переменные и которые в последствие будут вставляться в шаблон, а также подключить библиотеку Smarty;
  • 3 шаг - создать сам шаблон, куда все будем вставлять.
Для того, чтобы Вы не тратили свое время на перекопированние кода, который наведен ниже, можете скачать уже готовый пример (в готовом примере работает три первые ссылки в главном меню и генерируется блок новостей) и изучить его так сказать изнутри. Проект требует установленного web-сервера и php. Создайте какую-то тестовую папку на Web-сервере и настройте виртуальный хост. Проект будет состоять из набора следующих папок и файлов:

[..]
file[smarty_library] - это папка с библиотекой smarty, переписываем всю ее сюда;
file[tpl] - папка с шаблонами;
     file [cache]
     file [configs]
     file [templates]
          file [index.tpl] - это наш основной шаблон страницы
          file [news.tpl] - это вспомогательный шаблон страницы
     file [templates_c]
file[images] - папка с рисунками;
file[css] - папка с css стилями;
file[index.php] - непосредственно наш индексный файл.

Ну что ж, давайте сделаем первый шаг навстречу сайту и установим библиотеку smarty.

Для начала работы со smarty, скачайте его последнюю версию на официальном сайте http://www.smarty.net/download.php. Пакет smarty абсолютно бесплатный, так что кряк искать не придется :) Если вы скачали и распаковали пакет, там будет всякого добра полно, но Вам непосредственно нужны все файлы и папки в папочке libs (это и есть библиотека smarty, все остальное на не нужно).

Ее содержание будет выглядеть вот так:

[..]
file[internals]
file[plugins]
file[Config_File.class.php]
file[debug.tpl]
file[Smarty.class.php] - этот файл мы будем подключать для вызова библиотеки Smarty
file[Smarty_Compiler.class.php]

Перекопируйте все это, со всем содержимым внутри, в папку нашего проекта [smarty_library]. Далее создайте папку [tpl], а в ней подкаталоги

Теперь переходим ко второму шагу и создаем файл [index.php]. Содержимое файла будет следующее:

  1. <?php
  2.  
  3. /*********************** подключаем библиотеку smarty ***********************/
  4.  
  5. define('SMARTY_DIR','smarty_library/');
  6. require(SMARTY_DIR.'Smarty.class.php');
  7.  
  8. $smarty = new Smarty ();//объект smarty
  9.  
  10. $smarty->template_dir='tpl/templates/';//указываем путь к шаблонам
  11. $smarty->compile_dir='tpl/templates_c/';
  12. $smarty->config_dir='tpl/configs/';
  13. $smarty->cache_dir='tpl/cache/';
  14.  
  15.  
  16. /***************************** создаем переменные php ************************/
  17.  
  18. $arr_meta_tags['title'] = "Мой личный хостинговый сайт";
  19. $arr_meta_tags['keywords'] = "хостинг, площадка, хостинг-услуги";
  20. $arr_meta_tags['description'] = "Лучший хостинговый сайт предоставит хостинг-услуги по оптимальным ценам";
  21. $arr_meta_tags['content'] = "Хостинг - это услуга, по размещению вашего сайта на сервере, за которым следят квалифицированные специалисты, поддерживающие его работоспособность 24 часа в сутки и 7 дней в неделю. Не многие хостинг-компании способны предоставить хорошие условия, и только единицы могут дать приемлемое для вас соотношение цены и качества. Таковой компанией является Hostland.";
  22.  
  23. $arr_meta_tags['news'] = array ('1' => array('date' => '09/12/2008', 'title' => 'Смена банковских реквизитов', 'text' => 'Уважаемые клиенты, обращаем Ваше внимание на то, что с 29 октября 2008 года у нас сменились реквизиты.'), '2' => array('date' => '11/12/2008', 'title' => 'Обновление линейки тарифных планов', 'text' => 'Теперь на всех наших тарифах еще больше места, еще больше доменов.'));
  24.  
  25. /********************************** производим анализ ************************/
  26.  
  27. if (!empty($_REQUEST['page']) && $_REQUEST['page'] == "about") {
  28. $arr_meta_tags['content'] = "С каждым днем растет число сайтов созданных для развлечений - это сайты об играх, фан сайты, сайты досуга, в том числе <домашние> страницы и т.д. Никогда еще не было так просто, чем сегодня, открыть свой сайт. И если для бизнес проектов важным аспектом выбора хостинга является стабильность и надежность, то для некоммерческих, мало бюджетных сайтов главным оставалось и остается - доступность, т.е. невысокая цена. Мы предлагаем уникальное решение, делая свои услуги доступным для всех пользователей сети и даем гарантии качества и надежности.";}
  29.  
  30.  
  31. if (!empty($_REQUEST['page']) && $_REQUEST['page'] == "our_clients") {
  32. $arr_meta_tags['content'] = "Уважаемые клиенты, уважаемые пользователи!
  33. Коллектив компании Hostland.Ru от всей души поздравляет Вас с наступающим новым годом.
  34. Этот год был очень насыщенным для нашей компании, мы славно потрудились, но многое впереди!
  35. Мы поздравляем Вас, желаем всем успехов в бизнесе, благополучия в семье и крепкого здоровья! С НОВЫМ ГОДОМ!";}
  36. /************* передаем значение переменных php в переменные smarty *************/
  37.  
  38. $smarty->assign('title',$arr_meta_tags['title']);
  39. $smarty->assign('keywords',$arr_meta_tags['keywords']);
  40. $smarty->assign('description',$arr_meta_tags['description']);
  41. $smarty->assign('news',$arr_meta_tags['news']);
  42. $smarty->assign('content',$arr_meta_tags['content']);
  43.  
  44. $news_tpl = $smarty->fetch("news.tpl");
  45. $smarty->assign('blok_news',$news_tpl);
  46.  
  47. /*********************** запускаем показ шаблона smarty ************************/
  48.  
  49. $smarty->display("index.tpl");
  50.  
  51.  
  52. ?>

Давайте, кратко пройдемся по содержимому файла. Итак, начинается файл с подключения библиотеки smarty, для этого мы прописываем путь к библиотеке, создаем объект и прописываем для объекта пути к шаблонам.

Папки templates_c, configs и cache являются системными для библиотеки, а детально про это Вы можете почитать в документации FAQ Smarty.

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

Под анализом данных в примере подразумевается проверка поступлений с помощью методов Get или Post переменной 'page' со значениями, которые обозначают какую страницу запросил пользователь. В данном примере будут создаваться 3 уникальные странички - это "Главная", "Про нас", "Наши клиенты". Остальные Вы сможете создать немного разобравшись и модернизировав этот пример.

И, наконец, самая интересная часть - передача значений переменных php в переменные smarty. Как видите, делается это простой операцией: $smarty->assign('description',$arr_meta_tags['description']), где description - это будущее имя переменной smarty, а $arr_meta_tags['description'] сама переменная php.

Остановимся на таком моменте, посмотрите на эту функцию: $news_tpl = $smarty->fetch("news.tpl"). Знаете что она делает? Присваивает переменной php уже готовый блок новостей. Как же он появился, ведь у нас была лишь переменная php массива с новостями? А все очень интересно, smarty позволяет создавать множество дополнительных шаблонов, которые создаются с помощью функции fetch, а потом встраиваются в основной шаблон . Давайте посмотрим из чего состоит дополнительный шаблон [news.tpl]:

  1. {foreach from=$news item=new}
  2.  
  3. <div style="font-size:12px;padding-bottom:16px;">
  4. <span style="font-size:11px;">{$new.date}</span><br>
  5. <span style="font-weight:bold;">{$new.title}</span><br>
  6. {$new.text}<br>
  7. <span style="font-size:10px;"><a href="#">подробнее</a></span>
  8. </div>
  9.  
  10. {/foreach}

Если Вы уже знакомы с языками программирования и работой с массивами, то команда foreach будет Вам знакома. А если еще не успели, то Вы должны знать, что smarty поддерживает небольшой перечень логических структур управления и среди них такие как: if и foreach. Команда foreach работает с массивами и означает что с каждым элементом массива (в данном случае $news) выполнить нижеследующий код. И таким образом, внутренняя переменная new будет в порядке очереди каждым элементом массива $news. Чтобы все понять комплексно, еще раз вернемся назад и посмотрим на такую цепочку в файле [index.php]:

  1. $arr_meta_tags['news'] = array ('1' => array('date' => '09/12/2008', 'title' => 'Смена банковских реквизитов', 'text' => 'Уважаемые клиенты, обращаем Ваше внимание на то, что с 29 октября 2008 года у нас сменились реквизиты.'), '2' => array('date' => '11/12/2008', 'title' => 'Обновление линейки тарифных планов', 'text' => 'Теперь на всех наших тарифах еще больше места, еще больше доменов.')); //создаем массив из новостей
  2. $smarty->assign('news',$arr_meta_tags['news']);//создаем массив $news (она же переменная smarty) с новостями
  3. $news_tpl = $smarty->fetch("news.tpl");/*обработали дополнительный шаблон, с каждым элементом и подэлементом массива выполнили код и занесли в переменную php уже готовый блок новостей*/

Если Вы еще не поняли, как обрабатывать дополнительные шаблоны, оставьте это на потом, в первое время можно обойтись и без этого.

Следующим и последним третьим шагом будет создание основного шаблона, в котором в определенных местах будут находится переменные smarty. Давайте посмотрим содержимое файла [index.tpl]:

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3. <head>
  4. <title>{$title}</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  6. <META HTTP-EQUIV="Pragma" content="no-cache">
  7. <META HTTP-EQUIV="Expires" Content="Mon, 28 Mar 1999 00:00:01 GMT">
  8. <meta name="Document-state" content ="Dynamic">
  9. <meta name="description" content="{$description}">
  10. <meta name="keywords" lang="ru" content="{$keywords}">
  11. <meta name=Robots content="all">
  12.  
  13. <link href="css/style.css" rel="stylesheet" type="text/css">
  14.  
  15. </head>
  16.  
  17. <body>
  18.  
  19. <div id="wrap">
  20. <div id="conteiner">
  21. <table width="100%" border="0" cellspacing="0" cellpadding="0">
  22. <tr valign="top">
  23. <td width="235" style="background:url(images/lbg.gif); background-position:right; background-repeat:repeat-y;">
  24.  
  25. <div class="company_name">Web-хостинговые услуги</div><div class="company_name_shadow">Web-хостинговые услуги</div>
  26. <img src="images/p2.jpg" alt="image">
  27. <div class="lmenu">
  28. <a href="?page=main">Главная</a>
  29. <a href="?page=about">Про нас</a> <a href="?page=our_clients">Наши клиенты</a>
  30. <a href="#">Площадки</a>
  31. <a href="#">Наши цены</a>
  32. <a href="#" style="background:url(images/lbullet2.gif);background-repeat: no-repeat;background-position: 14px 8px;">Контакты</a> </div>
  33. <div class="lblock">
  34. <h2>Поcледние новости</h2>
  35.  
  36. {$blok_news}
  37.  
  38. </div>
  39.  
  40. </td>
  41. <td ><table width="100%" border="0" cellspacing="0" cellpadding="0">
  42. <tr>
  43. <td><img src="images/p1.jpg" alt="" width="515" height="267"></td>
  44. </tr>
  45. <tr>
  46. <td class="body_txt"><h1>Приветствуем Вас на нашем хостинговом сайте!</h1>
  47.  
  48. {$content}
  49.  
  50. <br>
  51. </td>
  52. </tr>
  53. </table></td>
  54. </tr>
  55. </table></div></div>
  56. <div id="footer">
  57. <div class="bottom_menu">
  58. <a href="#">Главная</a>
  59. <a href="#">Про нас</a>
  60. <a href="#">Наши клиенты</a>
  61. <a href="#">Площадки</a>
  62. <a href="#">Наши цены</a>
  63. <a href="#">Контакты</a>
  64. </div>
  65. <div class="bottom_addr">&copy; 2008 Company Name. Все права защищены.</div>
  66. </div>
  67.  
  68. </body>
  69. </html>

Вы видите обычную страничку html, а в ней {$keywords} такого рода символы. Эти символы, согласно синтаксиса библиотеки smarty, ее переменные. Их значение мы устанавливаем в файле [index.php] таким вот способом: $smarty->assign('keywords',$arr_meta_tags['keywords']);//где keywords означает {$keywords} в шаблоне

В шаблон можно передавать массив, и соответственно в скрипте лучше выполнить

$smarty->assign('meta_tags',$arr_meta_tags);

вместо

  1. $smarty->assign('title',$arr_meta_tags['title']);
  2. $smarty->assign('keywords',$arr_meta_tags['keywords']);
  3. $smarty->assign('description',$arr_meta_tags['description']);
  4. $smarty->assign('news',$arr_meta_tags['news']);
  5. $smarty->assign('content',$arr_meta_tags['content']);

А в шаблоне подтянуть значения: {$meta_tags.content} и т.д. Если же сделать так:

$smarty->assign($arr_meta_tags);

то на выходе мы получим те же переменные, что и в примере ($title, $keywords и т.д.).

Кроме того, во избежание ошибок правильнее проверять в шаблоне существование выводимой переменной: {if isset($a)}{$a}{/if} ...

Ко всему выше добавлю что использование smarty значительно облегчит Вашу задачу по созданию своего сайта. Сделав один шаблон, Вы можете создавать на основе немного множество интересных страниц сайта. А использование дополнительных шаблонов, дает Вам возможность любую конструкцию Ваших страниц. Удачи!


Дата публикации: 15.05.2011
info-pages.com.ua


Комментарии:
  1. novichok: ссылка не работает!!!!!!!!!!!
    Добавлен: 2011-05-28

  2. novichok: статья хорошоая, но пример взять не могу, исправте пожалуйста
    Добавлен: 2011-05-28

  3. Admin: Проверил. Ссылка работает
    Добавлен: 2011-05-28

  4. Os: Ссылка не работает!
    Добавлен: 2012-03-26

  5. Gunya: Ссылка на пример не открывает 404
    Добавлен: 2012-04-05

  6. джон смит: пример не работает на php 5.3 на 5.2 все работает
    Добавлен: 2013-01-23

  7. джон смит: заработал на 5.3 после добавления файла .htaccess
    Добавлен: 2013-01-23

  8. yura200676: Делал по этому примеру, только всё по своему. Всё работает!
    Добавлен: 2013-02-03


   Ваш псевдоним:
Ваш комментарий:

Новости Интернет


Поиск




Наши партнеры




Последний пересчет

тИЦ:07 Окт 15
PR:09 Дек 13

Посетители

On-Line:14
Рекорд:1794
Зафиксирован:01 Окт 13

Наши партнеры

wservices.ru - регистрация доменов, Whois-сервисы Смайлы на все случаи жизни


Календарь событий


 
Copyright © 2006-2017, wb0.ru