SSI. Используем шаблоны // Mash

Дизайн, дизайн… Как много в этом слове…

Я не силён в вопросах веб-дизайна и прочего, но вот некоторые свои соображения хочу предать огласке. С одной стороны мне будет приятно, если кому-то поможет эта заметка. Со стороны второй: нужно разложить по полочкам то, что задумал. Вот только не знаю, стану ли притворять это в жизнь. Если вы одновременно видите текстовые ссылки на разделы сайта и flash-меню, то не стал. Кстати, на момент написания заметки (17/10/02) flash-меню имеется, но только в состоянии зародыша и не в байтах, а в голове Redux"a.

Узнал я про SSI вовремя. Как раз назрела очередная необходимость в смене графического оформления сайта. Одним словом, старый дизайн надоел. Первая версия сайта… я плакалЪ :) Вторая версия была уже сурьёзнее. Ну, а когда настал черёд n-ой, жизненный опыт направил мои стопы к тропинкам снижения умственной активности и трудоёмкости процессов обновления содержимого (как графического, так и текстового).

SSI расшифровывается как Server Side Include. SSI — это набор команд, позволяющий включить в страницу информацию, недоступную средствами HTML, такую как вывод программ, значения переменных окружения и статистику по файлам (размер, дата создания и др.)

Распространенным применением SSI является формирование страницы из шаблона. В простейшем случае — это документ в начало и конец которого вставляются шапка и концевик:
<html>
<head>
<title>Test Page</title>
</head>
<!--#include virtual = "/ssi/header.html" -->
<h1>Тестовая страница</h1>
<p>Некий текст</p>
<!--#include virtual = "/ssi/global_menu.html" -->
<!--#include virtual = "/ssi/footer.html" -->
</body>
</html>

Подробнее можно почитать здесь и здесь.

Рапространенным, так распространенным. Всегда хотел шаблонный метод, да вот только ручки под php пока не заточены. Делаем как написано выше, получаем такую штуку (пример):

global_menu.htmlheader.html
some_article.shtml (основной текст)
footer.html

Получилась достаточно удобная вещь с точки зрения простоты изменения оформления. Появился новый раздел и для него нужно сделать пункт в меню навигации сайта? Без проблем. Изменил global_menu.html и меню навигации будет новым на всех страницах, сформированных из шаблона.Возникает резонный вопрос: «Почему бы „кирпичики“ шаблона тоже не сделать с расширением *.shtml?» Это даст определенное преимущество. Жизнь — штука сложная, а вдруг пригодится?

Кратко расскажу о процессе генерации страницы, которую вы сейчас читаете.

На сайте лежат следующие файлы-шаблоны (имена действующих лиц изменены, совпадения считать случайными): header.shtml, footer.shtml и menu.shtml. В header.shtml — вставка flash-клипа (меню). Файлы header.shtml и footer.shtm через <!--#include virtual="menu.shtml" --> включают в своё тело html-код файла menu.shtml. Последний содержит код текстового меню. А зачем два навигационных меню одной странице? Вот-вот. Будем искоренять!

Но для начала уберём совсем уж больные с точки зрения «здорового духа» usability вещи.

Посетитель, пришедший на главную страницу, т.е. набрав адрес http://redux.by.ru в адресной строке, видит следующую шапку меню: «Форум :: Новости :: Заметки :: и т.д.». Что произойдёт, если он кликнет на «Новости»? Правильно. Он снова попадёт на главную страницу (у нас новости там :)). Мелкое, досадное недоразумение, так не любимое «профессионалами». Ну что ж, будем скромно вливаться в их ряды при помощи этого:

if/else
Наличие такой команды не может не радовать… :) Применяется для управления выводом страницы по условию.
Синтаксис такой:

<!--#if expr = "УСЛОВИЕ1" -->
HTML-код, который будет выводиться, если УСЛОВИЕ1 истинно
<!--#elif expr = "УСЛОВИЕ2" -->
HTML-код, который будет выводиться, если УСЛОВИЕ1 ложно, а УСЛОВИЕ2 истинно
<!--#else -->
HTML-код, который будет выводиться, если все условия ложны
<!--#endif -->

Переменные окружения. «DOCUMENT_NAME» — локальное имя документа. А теперь пережуём и выплюнем:

[ кусок файла menu.shtml ]

<!--#if expr = "$DOCUMENT_NAME!=index.shtml" -->
<a href="http://redux.by.ru/index.shtml" title="Новости сайта"> Новости </a> 
<!--#endif -->
<!--#if expr = "$DOCUMENT_NAME!=zametki.shtml" -->
<a href="http://redux.by.ru/zametki/zametki.shtml" title="Мыслишки"> Заметки </a> 
<!--#endif -->
<!--#if expr = "$DOCUMENT_NAME!=fin.shtml" -->
<a href="http://redux.by.ru/fin/fin.shtml" title="Финансы"> Финансы </a> 
<!--#endif -->
<!--#if expr = "$DOCUMENT_NAME!=comp.shtml" -->
<a href="http://redux.by.ru/comp/comp.shtml" title="Компьютерное"> Компьютеры </a> 
<!--#endif -->
<!--#if expr = "$DOCUMENT_NAME!=smile.shtml" -->
<a href="http://redux.by.ru/smile/smile.shtml" title="Немного о весёлом"> Забавное </a> 
<!--#endif -->

[ /кусок файла menu.shtml ]

Набрав http://redux.by.ru, посетитель больше не увидит ссылки на раздел «Новости» в текстовом меню, т.к. локальное имя документа в этом случае примет значение index.shtml ("$DOCUMENT_NAME=index.shtml"). Оператор != — проверка условия неравенства.Не люблю я такие топорные вещи, но вроде как работает :)

Про flash-меню не забыли? Продолжение следует.

17 октября 2002