Часть I. Стандартный шаблон системы, или "Что мы имеем?"

В качестве "подопытного кролика" я выбрал стандартный шаблон системы #971, стоящий в настройках дизайна по умолчанию для вновь созданного сайта на uCoz-платформе.

Вы также можете выбрать этот шаблон (хотя, можете и другой - принцип работы останется тем же) в Панели управления сайтом, зайдя в Настройки - Общие настройки и в поле "Дизайн сайта" нажав ссылку "Выбрать дизайн"

Откроется список стандартных шаблонов системы, на 5-й странице находите 971-й шаблон, кликаете по нему, во всплывающем окне с диалогом "Дизайн выбран. Закрыть окно?" нажимаете "Да".

Идём дальше. Давайте посмотрим код главной страницы нашего сайта с предустановленным дизайном #971. Для этого в Панели управления сайтом переходим по ссылке "Редактор страниц" в вертикальном меню слева, далее жмём ссылку "Управление дизайном модуля" и перед нами откроется html-код страницы "Страницы сайта" (отвечает за визуальное оформление главной страницы сайта по умолчанию).
Это и будет наша рабочая среда, на примере этого шаблона мы и будем обучаться адаптированию сторонних шаблонов сайтов в систему uCoz.

Начинаем знакомство?

Code

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>$SITE_NAME$ - $MODULE_NAME$</title>
<?$META_DESCRIPTION$?>
<link type="text/css" rel="StyleSheet" href="http://s50.ucoz.net/src/css/971.css" />
</head>
<body style="background-color:#FFFFFF; margin:0;padding:0;">
$ADMIN_BAR$
$GLOBAL_AHEADER$

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td valign="top" style="padding:3px">
$GLOBAL_CLEFTER$
</td>
<td valign="top" width="80%" style="padding-top:5px">
<table border="0" cellpadding="10" cellspacing="0" width="100%" style="border:1px solid #D7D7D7;"><tr><td style="background:#F8F8F8;">$CONTENT$</td></tr></table>
</td>
<td valign="top" style="padding:3px">
$GLOBAL_DRIGHTER$
</td>
</tr>
</table>

$GLOBAL_BFOOTER$
</body>
</html>

Для начала я хочу сразу акцентировать Ваше внимание на различные коды, заключённые в знаки $

Code

Например:

$ADMIN_BAR$
$GLOBAL_AHEADER$
$GLOBAL_CLEFTER$

и другие...

Назовём их системными. Почему? Потому что именно такие коды обеспечивают функционал системы: вывод заголовков страниц, админ-бара, глобальных блоков, информеров и много чего другого.

Кстати говоря, чуть ниже окна редактирования шаблона находится список всех системных кодов, работа которых обеспечивается на данной странице, с кратким пояснением к каждому отдельному коду

Очень удобно и наглядно. Но мы сейчас не будем на них останавливаться, а рассмотрим те системные коды, которые непосредственно есть в HTML-коде шаблона "Страницы сайта"

Code

$SITE_NAME$ - $MODULE_NAME$

Благодаря этому коду в интернет-браузере пользователя выводится заголовок этой страницы, по умолчанию что-то вроде Персональный сайт - Главная страница

Скажу сразу, в таком виде заголовок лучше не оставлять, он обезличен и не несёт никакой информации. Гораздо лучше будет, к примеру, обозначить в заголовке название Вашего сайта и кратко описать его, например: PS-Studio.Info: Портал веб-решений

Тогда всё сразу встанет на свои места и посетитель этой страницы будет знать, где он находится и о чём эта страница.

А потому строку

Code

<title>$SITE_NAME$ - $MODULE_NAME$</title>

мы берем и твердою хозяйскою рукой заменяем на свою

Code

<title>PS-Studio.Info: Портал веб-решений</title>

Старайтесь, по-возможности, не делать слишком длинных заголовков страниц, у поисковых систем есть лимит (ограничение) на число знаков текста, который ими учитывается. Обычно это 60-70 знаков. Всё что сверх лимита - игнорируется.

О функционале системного кода

Code

<?$META_DESCRIPTION$?>

я могу только догадываться. исходя из его названия, поскольку явного описания в перечне кодов я не нашел и как, и главное где им можно попользоваться не понятно (пока). Скорее всего, данный код будет задействован в недалёком будущем, либо еще в разработке.

Скорее всего, будет отвечать за вывод мета-тега description. О назначении этого тега можете почитать в интернете по запросу "мета-теги"
А пока просто возьмём и заменим

Code

<?$META_DESCRIPTION$?>

на это

Code

В поле content вместо троеточия вставьте сочетания слов, наиболее полно отражающие тематику и содержимое данной страницы Вашего сайта, например:

Code

Узнать подробнее о том, как правильно составлять описания для мета-тега description вы можете на интернет-ресурсах по продвижению и оптимизации сайтов или специализированной литературе.

А мы вернёмся к нашим баранам) Следующий системный код в шаблоне

Code

$ADMIN_BAR$

Этот код позволяет выводить на странице сайта, а точнее - в её верхней части, админ-бар

такую узкую полоску во всю ширину экрана монитора, серого, либо иного цвета, на фоне которого размещены пункты пользовательского меню.

Штука полезная, но решать, нужна ли она Вам на каждой странице или нет, Вам. Лично я оставил вывод админ-бара на одной единственной странице сайта, на всех прочих убрал.

А теперь мы рассмотрим сразу несколько системных кодов, и я объясню почему

Code

$GLOBAL_AHEADER$ - отвечает за вывод содержимого верха страницы ("шапки")

$GLOBAL_CLEFTER$ - отвечает за вывод содержимого левой колонки макета страницы

$GLOBAL_DRIGHTER$ - отвечает за вывод содержимого правой колонки макета страницы

$GLOBAL_BFOOTER$ - отвечает за вывод содержимого низа страницы ("подвала" или "футера")

Что их объединяет? А то, что это системные коды, выводящие на страницу сайта необходимое содержимое посредством так называемых глобальных блоков.

Если кратко: глобальные блоки позволяют в коде разных страниц сайта заменить большие, повторяющиеся участки кода всего лишь одной строкой типа

Code

$GLOBAL_DRIGHTER$

Как создаются глобальные блоки и можно ли их использовать при адаптации шаблонов, мы рассмотрим чуть позже.

А пока познакомимся с последним системным кодом шаблона "Страницы сайта" и, пожалуй, самым главным в коде этой страницы

Code

$CONTENT$

Этот системный код отвечает за вывод контента , который Вы добавляете на главную страницу сайта. Да-да, именно это волшебное $CОNTENT$ и позволяет увидеть на главной странице сайта материалы новостей например.

Мы рассмотрели, таким образом, основные системные коды, используемые в шаблоне "Страницы сайта" стандартного дизайна системы.

В шаблоне "Страницы сайта" есть лишь один системный код. без которого нам точно не обойтись при адаптации сторонних шаблонов, это и есть код $CОNTENT$, без остальных кодов системы, в принципе, можно обойтись, но не всегда это есть хорошо).

До встречи в следующем уроке!

Ссылка:

BB-код:

HTML-код:

Ещё по теме:

Всего комментариев: 2