Наряду с неоспоримыми достоинствами бесплатного хостинга, есть и
существенные недостатки. Больше всего меня раздражает отсутствие SSI. Если и вас тоже, сообщаю: Выход есть! И довольно простой, как в
поговорке про все гениальное.
Для тех, кто не в курсе, поясняю. Вам наверняка хоть раз в жизни
приходилось собирать мозаику. Ну, или хотя бы соединять вместе
несколько частей в одно целое. В этом и заключается идея SSI -
собирать свой сайт из HTML-фрагментов. Для чего это нужно? Как
правило, на каждом сайте некоторые детали присутствуют на всех
страничках сайта. У меня, например, таким является оглавление слева.
И web-мастеры при создании новых документов просто переписывают их
туда. А если вдруг захочется изменить внешний вид, приходится
вносить изменения во все файлы. А если сайт содержит много
информации, то реконструкция сайта превращается в тягомотину. Можно,
конечно, использовать фреймы (про них рассказано в "HTML за
полчаса", но у них есть свои недостатки.
Предлагаемый мною способ, конечно, далек от совершенства, но он
лучше, чем ничего, да и не так уж плох (на мой субъективный взгляд).
Итак, все дело в следующем: как вы знаете (а если не знаете, то я
с удовольствием вас информирую), в HTML документ можно встраивать
скрипты, написанные на различных языках. Один из них - JavaScript -
довольно прост (о нем рассказано в статье Основы
JavaScript) и имеет то преимущество, что его понимают все
браузеры, а для выполнения используются ресурсы компютеров ваших
посетителей.
Так вот, скрипт на JavaScript не обязательно встраивать в HTML
документ, что бы там ни было написано в инструкции по его
использованию. Он может располагаться в отдельном файле,
следовательно, на него можно ставить ссылку/сноску из любого другого
документа, следовательно, его можно написать только один раз и
использовать в неограниченном количестве документов.
Наши файлы-кусочки будут иметь содержание
document.write('ваш HTML-код');
или
document.write("ваш HTML-код");
количество таких записей неограничено, внутри кавычек/апострофов
вы пишете строчку с вашим HTML. Естественно, что если вам надо
использовать кавычки, вы берете первый вариант, а если апострофы, то
второй. Файл с кусочком встраиваемого HTML сохраняете в виде
name.js, где вместо name используете любую комбинацию
цифр и латинских букв.
Когда вы написали все фрагменты, начинаем их склеивать. В том
месте, где должен быть нужный элемент, пишем
<script language="JavaScript" src=source></script>
,где source - адрес этого фрагмента.
Таким образом, ваша страничка (в идеальном варианте) будет иметь
следующий вид
<html><head>
<title>Название страницы</title>
<meta name="description" content="описание странички">
<mete name="keywords" content="ключевые слова через пробел">
<script language="JavaScript" src="body.js"></script>
<script language="JavaScript" src="content1.js"></script>
...
<script language="JavaScript" src="contentX.js"></script>
</body></html>
По-моему, вполне элегантно.
Только старайтесь, чтобы ваши кусочки были осмысленными,
самостоятельными и логически законченными. Потому что если написать
какой-нибудь открывающий тег в одном, а закрывающий в другом
фрагменте, скорее всего не сработает.
Не бойтесь того, что общий размер странички увеличивается из-за
многократного повторения document.write. Так как страничка
состоит из нескольких кусочков, ее загрузка будет происходить даже
немного быстрее.
Если захотите что-либо уточнить, пишите. НО!!! Я не буду отвечать
на вопросы типа "я все сделал так как написано, но ничего не
работает". Значит, не совсем так. Шевелите извилинами и ищите
ошибки. Самая распространная - многие забывают, что в адресах и в
JavaScript большие и маленькие буквы РаЗлИчАюТсЯ.
Передача и обработка данных средствами SSI
Передача данных (1-й способ)
Данные передаются точно так же, как и для обычных html файлов -
через URL либо с помощью формы методом GET. В принципе, и
обрабатывать их можно точно так же. Но,
если вы хотите изменять SSI-вставку в зависимости от переданных
данных, читайте дальше.
Особенности
Для SSI данные лучше передавать в виде name=value. Метод GET
формы так и делает, а вот если вы самостоятельно формируете строку
запроса, она должна выглядеть так:
file.shtml?var1=value1&var2=value2 и т.д.
Получение данных
Нам мало передать данные. Нам надо еще и получить их. Для того,
чтобы увидеть, что мы там себе передали, включите в файл строку
<!--#printenv -->
Эта строка нам в дальнейшем не понадобится. Она нужна лишь для
того, чтобы увидеть, передается ли хоть что-нибудь. В дальнейшем,
если что-то не так пойдет, вставьте эту строку в файл и проверьте,
может вы где-то не так буковку написали.
Самый простой способ использования
Допустим, у вас на сайте есть FAQ, но ответы на вопросы такие
объемные, что хотелось бы выводить их по одному и при этом, если
потом приспичит поменять дизайн, чтобы долго не возиться. Мы делаем
одну страничку (назовем ее faq.shtml), оформляем ее как положено, а
в том месте, где должен быть ответ, пишем
<!--#include virtual="${file}" -->
Учтите, что может быть, для вашего сервера надо использовать не
фигурные, a круглые скобки или даже вообще без них обойтись.
Теперь ответы на вопросы пишем каждый в своем html-файле, в
котором нет ничего, кроме текста да тегов, с ним связанных (B, FONT
и т.д), и желательно не использовать атрибуты COLOR, чтобы потом не
мучаться.
Ссылки на ответы надо делать следующим образом
<a href="faq.shtml?file=url">
где url - адрес html-файла, содержащего ответ, можно
относительный - только смотрите не запутайтесь.
В принципе, весь сайт можно организовать по такому принципу. Если
вы любите менять дизайн, то чтобы это сделать, достаточно будет
изменить всего один файл - и вот у вас новый сайт.
Обработка данных
Все это хорошо. Но хочется еще чего-нибудь похитрее. Если вы уже
знакомы с SSI, дальше нового вы не узнаете, если нет - читайте.
В файлах SSI можно использовать переменные. Они объявляются так
<!--#set var="name" value="value" -->
Передача данных
file.shtml?username=Alexey&birth=1974
эквивалентно
<!--#set var="username" value="Alexey" -->
<!--#set var="birth" value="1974" -->
Возможности по использованию этих бесценных сведений в SSI
довольно ограничены, но мы можем попытаться с ними что-нибудь
сделать.
Можно просто вставить переменную в документ.
<!--#echo var="name" -->
Например, используя переданные ранее данные, можно написать
Привет, <!--#echo var="username" -->
В результате чего на экране появится Привет, Alexey
Пример посложнее. Если в файле написать
<!--#set var="title" value="заголовок" -->
то потом в вызывающем файле можно использовать
<title><!--#echo var="title" --></title>
Таким образом, мы можем передавать из включаемых файлов в
вызываемые различные конфиденциальные сведения. Пользователь не
видит инструкции SSI - они обрабатываются сервером и передаются уже
в итоговом, "готовом к употреблению" виде.
Можно поизвращаться и попробовать проанализировать переданные
данные и на их основе что-нибудь сделать.
Условные операторы выглядят так
<!--#if expr="condition" -->
<!--#elif expr="condition" -->
<!--#else -->
<!--#endif -->
Элемент endif является обязательным. elif можно повторять сколько
угодно раз. После if и elif пишется HTML-код, который будет
подставляться при истинности условия. После else пишется код,
который подставится, если ни одно из имеющихся ранее условий не
выполнилось.
Например
<!--#if expr=($username="Alexey") -->
<h1>Привет, <!--#echo var="username" --></h1>
<!--#else -->
<h2>Привет, <!--#echo var="username" --></h2>
<!--#endif -->
Такой нехитрый код выводит приветствие, но если человека зовут
Alexey, буквы будут чуть-чуть побольше.
Передача данных (2-й способ)
Можно передавать данные и средствами SSI. Плюс у этого метода в
том, что он, в отличие от первого способа, проходит незамеченным для
пользователя. Чтобы передать данные, надо их присвоить какой- нибудь
переменной. Все переменные, объявленные в файле, доступны и в
вызываемых, и в вызывающих файлах. Но!!! Само cобой разумеется, что
надо сначала подключить файл, а потом использовать имеющиеся в нем
данные, а в подключаемых файлах использовать можно только то, что
имеется к моменту подключения.
Второй способ организации сайта
Он немножко сложнее, но (имхо) прогрессивнее.
Все свои статьи пишем в формате html, но избегаем применения
тегов, меняющих цвет, и не указываем body. Сохраняем (допустим в
файле text.html), и запоминаем адрес этого сайта. Никому его не
говорим - он будет для сугубо внутреннего использования.
Теперь создаем "публичный" файл для этой статьи, его мы будем
заносить в каталоги и рекомендовать знакомым. Он состоит всего из
нескольких строчек.
<html>
<!--#set var="description" value="описание" -->
<!--#set var="title" value="Заголовок" -->
<!--#set var="keywords" value="ключевые слова" -->
<!--#set var="file" value="url статьи" -->
<!--#include virtual="файл интерфейса.shtml" -->
Как видите, мы указали в нем заголовок, ключевые слова, описание
и "приватный" файл, в котором содержится статья (text.html). Можно
еще написать то, что вы там еще обычно пишете в заголовке. Я чаще
всего ограничиваюсь одним title. Как-то спокойно отношусь к тому,
что релевантность маленькая окажется :-).
Теперь создаем файл интерфейса (*,shtml). Начало его выглядит
так:
<html><head>
<title><!--#echo var="$title" --></title>
<meta name="description" content="<!--#echo var="$description" -->">
<meta name="keywords" content="<!--#echo var="$keywords" -->">
</head>
Далее оформляем внешний вид - вешаем баннеры, вставляем счетчики,
добавляем новости и т.д. Наконец в том уголке, где должна быть
статья, пишем
<!--#include virtual="$file" -->
Теперь для радикального изменения дизайна всего сайта достаточно
изменить лишь наш файл интерфейса.
Нюансы
В зависимости от ситуации а так же различного программного
обеспечения может быть разным синтаксис написания имен переменных.
Если вы все сделали как тут написано и ничего не вышло, попробуйте
следующее:
Вставьте строку <!--#printenv --> и посмотрите, есть ли
вообще у вас хоть какие-то переменные. Если есть, но использовать их
не получается, попробуйте другой способ написания:
"name"
"$name"
$name
"${name}"
"$(name)"
Один из них сработает.
Если у вас не работает даже printenv, Возможно, вам сначала нужно
сделать из своего компьютера сервер. Самый простой способ -
установить программу Small Http
Server. Проста в установке и использовании, инструкция на
русском языке. После установки сможете тестировать на своем компе
CGI, SSI, PHP и т.д.