SSI на практике
SSI используется не только для вывода каких-либо значений, но и для упрощения построения сайта и добавления некоторых удобных вещей, которых лишён HTML. Рассмотрим некоторые примеры применения SSI в деле.
Ссылка на главную страницу
Обычно ссылку на главной странице на саму себя не делают, чтобы не сбивать пользователей с толку. При этом на остальных страницах такая ссылка есть и она ставится на заголовок сайта. Пусть файл с главной страницей называется index.shtml, тогда нам надо определить, не совпадает ли имя открытого документа с этим и в зависимости от совпадения решаем, делать или нет ссылку. В примере 1 переменная DOCUMENT_URI сравнивается со значением /index.shtml и если оно не равно, иными словами, у нас любая страница кроме главной, тогда картинку делаем ссылкой.
Пример 1. Главная страница
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SSI</title>
</head>
<body>
<!--#if expr="($DOCUMENT_URI != \"/index.shtml\")"-->
<a href="/"><img src="logo.gif" alt="Логотип"></a>
<!--#else-->
<img src="logo.gif" alt="Логотип">
<!--endif-->
</body>
</html>
Определение Internet Explorer
В некоторых случаях для браузера Internet Explorer необходимо загружать отдельный код, который отличается для других браузеров. Тогда используем переменную HTTP_USER_AGENT и сравниваем её со значением MSIE. Обратите внимание, что если просто вывести HTTP_USER_AGENT, то текст будет совсем другой. В примере 2 показано, как задать один текст для всех версий IE и другой для остальных браузеров.
Пример 2. Определение IE
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SSI</title>
</head>
<body>
<!--#if expr="$HTTP_USER_AGENT = /MSIE/"-->
<p>Ваш браузер устарел, пожалуйста, замените Internet Explorer на другой.</p>
<!--#else-->
<p>Добро пожаловать на сайт!</p>
<!--endif-->
</body>
</html>
Создание шаблона
Все страницы сайта строятся, как правило, по одному шаблону и имеют некоторые повторяющиеся элементы вроде шапки и подвала. Чтобы не повторять их в каждом HTML-документе, их код можно вынести в отдельный файл и подключать одной строкой. Это позволяет не редактировать десятки файлов, а ограничиться всего одним.
Предположим, что типовой документ на сайте имеет структуру, показанную в примере 3. Различаться будет только содержимое <article>, а всё остальное кочует из файла в файл.
Пример 3. Типовой файл
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SSI</title>
<!-- Стилевые файлы и скрипты -->
</head>
<body>
<header>Шапка сайта</header>
<article>Содержание текущего документа</article>
<aside>Боковая панель</aside>
<footer>Подвал</footer>
</body>
</html>
Чтобы не писать каждый раз одно и то же, вынесем похожие фрагменты в текстовые файлы и поместим их в папку assets. Тогда шаблон будет иметь вид, как показано в примере 4.
Пример 4. Шаблон
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SSI</title>
<!--#include virtual="/assets/link.txt"-->
</head>
<body>
<!--#include virtual="/assets/header.shtml"-->
<article>Содержание текущего документа</article>
<!--#include virtual="/assets/aside.shtml"-->
<!--#include virtual="/assets/footer.txt"-->
</body>
</html>
Обратите внимание, что файлs header.shtml и aside.shtml имеют расширение .shtml, для того, чтобы в них подключать директивы SSI.
Выделение текущего пункта меню
Аналогично главной странице пункт меню, который указывает на текущую страницу не делают ссылкой, а вставляют как рядовой текст, выделяя его с помощью стилей. В примере 5 показано содержимое файла aside.shtml, который используется в предыдущем примере.
Пример 5. Меню для сайта
<ul>
<!--#if expr="($DOCUMENT_URI = '/1.shtml')"-->
<li class="active">Эрик Картман</li>
<!--#else-->
<li><a href="1.shtml">Эрик Картман</a></li>
<!--#endif-->
<!--#if expr="($DOCUMENT_URI = '/2.shtml')"-->
<li class="active">Кенни Маккормик</li>
<!--#else-->
<li><a href="2.shtml">Кенни Маккормик</a></li>
<!--#endif-->
<!--#if expr="($DOCUMENT_URI = '/3.shtml')"-->
<li class="active">Стэн Марш</li>
<!--#else-->
<li><a href="3.shtml">Стэн Марш</a></li>
<!--#endif-->
<!--#if expr="($DOCUMENT_URI = '/4.shtml')"-->
<li class="active">Кайл Брофловски</li>
<!--#else-->
<li><a href="4.shtml">Кайл Брофловски</a></li>
<!--#endif-->
</ul>
На сайте сделано четыре файла с именами 1.shtml, 2.shtml, 3.shtml и 4.shtml. Чтобы SSI различал, какому пункту меню какой файл соответствует, используется переменная DOCUMENT_URI. Если её значение совпадает с именем открытого документа, то ссылка не добавляется.
Версия для печати
Версия для печати содержит то же самое содержание, что и текущая страница, но специально оптимизированное для печати документа, к примеру, может отсутствовать реклама, какие-то декоративные элементы. Чтобы различать «нормальную» страницу и её версию для печати, к адресу документа добавим ?print, а с помощью SSI будем проверять, есть эта добавка или нет. Поскольку адрес документа может быть произвольным, воспользуемся переменной DOCUMENT_URI для его получения и создания ссылки на печатную версию (пример 6).
Пример 6. Версия для печати
<!--#if expr="($QUERY_STRING = 'print')"-->
<p>Версия для печати</p>
<!--#else-->
<p>Обычная страница</p>
<p><a href="<!--#echo var="DOCUMENT_URI"-->?print">Версия для печати</a></p>
<!--#endif-->
С помощью переменной
QUERY_STRING идёт проверка, есть ли в адресе ключевое слово print или нет. Если оно присутствует, тогда выводится одна версия страницы, если этого ключевого слова нет, тогда отображается другая версия страницы со ссылкой.