Table of Contents

[Edit]

Настройка шаблона на примере поставляемого с системой

Раздел представляет собой перевод англиийской версии. В данный момент он перерабавтывается с учетом актуальной версии CMS.

Contents

Все шаблоны, поставляемые с системой, содержат практически один и тот же HTML код. Они отличаются только типом меню и количеством включенных в них блоков контента. Всё остальное оформление назначается только через таблицы стилей.
Такое возможно потому, что исходные шаблоны не содержат таблиц. Вместо них? для определения каждого блока использованы теги <div>. Расположение и внешний вид каждого такого блока может быть настроено с помощью CSS.
Далее мы пройдемся по всему шаблону, раздел за разделом, чтобы объяснить что это такое и что в нем можно изменить.
Внешний вид и поведение будущей страницы затем настроим с помощью таблиц стилей, привязанных к каждому шаблону.
Исходный код шаблона:

Тег {process_pagedata}

{process_pagedata}

Этот служебный плагин запускает обработку дополнительных данных и логики шаблонизатора Smarty, если они были добавлены к странице в специальном поле редактора. Этот тег необязателен, если Вы не используете этот механизм. Но если всё-таки решили использовать, то этот тег обязательно должен стоять в самой первой строке шаблона.

Объявление DOCTYPE и назначение языка страницы

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
Это DOCTYPE (document type declaration - объявление типа документа). Эта строка сообщает браузеру, что данный документ использует определенную версию(X)HTML, в результате чего браузер может отобразить его корректно. Это также необходимо для различных утилит, проверяющих синтаксис исходного кода документа.
Первые две строки объявления должны быть оставлены без изменений. А вот объявление языка документа в теге <HTML> вполне может быть изменено. Измените "en" на "ru" для назначения странице русского языка.
Здесь можно узнать о кодах для других языков

Раздел <HEAD>

 <head>
 <title>{sitename} - {title}</title>
 {cms_stylesheet}
 {metadata}
 </head>
В разделе <head></head> содержится всевозможная служебная информация, котрая не отображается на самой странице. Обратите внимание, что весь этот раздел заполнен только тегами CMS Made Simple! И это вполне логично - для того и нужна CMS, чтобы "спихнуть" на неё все служебные функции. впрочем никто не запрещает Вам добавить в этот раздел любые свои теги, если Вы знаете что делаете.
Тег <title></title> отвечает за текст, появляющийся в заголовке браузера. Мы будем использовать {sitename} - имя файла, определенное в "Общих настройках" и {title} - метку, которая будет замещена именем текущей страницы, заданным при редактировании конкретной страницы. Расположим их через дефис.
Тег {cms_stylesheet} прилинковывает все таблицы стилей, привязанные Вами к данному шаблону. Обратите внимание, что тег {stylesheet} используется только один раз и включает в себя все привязанные таблицы стилей, даже если их привязано несколько. В CMS Made Simple до появления версии 1.8.1, вместо него использовался тег {stylesheet}.
Тег {metadata} выводит все метаданные (ключевые слова и т.п.), как заданные в "Общих настройках" для всего сайта, так и назначенные отдельной странице при её редактировании.

Начало страницы

 <body>
 <div id="pagewrapper">
Это теги начала тела страницы и блока "контейнера" страницы, в который будет включено всё остальное содержимое. В таблице стилей Вы можете задать параметры этого блока - ширину страницы, выравнивание и т.п. Для этого в одной из привязанных таблиц стилей найдите строку, начинающуюся с div#pagewrapper.

Заголовок

 <div id="header">
   <h1>{cms_selflink dir="start" text="$sitename"}</h1>
   <hr class="accessibility" />
Заголовок - это то место на странице, где размещается логотип CMS Made Simple.Как Вы можете заметить, сам шаблон не содержит никаrой информации о наполнении заголовка, всё оформление содержится в CSS. Так сделано для того, чтобы получить совершенно чистый код, соответствующий логической разметке. Однако, при желании, Вы можете включить текст, ссылки на изображения или любой другой контент, который должен отобразиться в блоке заголовка, непосредственно в шаблоне.

Путь к странице ("хлебные крошки")

 <!-- Start Breadcrumbs -->
 <div class="breadcrumbs">
   {breadcrumbs starttext='You are here' root='Home' delimiter='»'}
 <hr class="accessibility" />
 </div>
 <!-- End Breadcrumbs -->
"Хлебные крошки" - это ссылки, которые показывают посетителю на какой странице он находится, и где её место в общей иерархической структуре сайта.

Это будет выглядеть как-то так:

Главная >> Раздел >> Текущая страница
В CMS Made Simple есть тег, который добавляет путь к каждой странице: {breadcrumbs}.
Логика вывода пути определяется с помощью параметров:
  • delimiter='»' определяет символ, который будет использован в качестве разделителя.
  • starttext='You are here' определяет текст, который будет выведен для текущей страницы
  • root='Home' определяет страницу, от которой начинается отсчет
  • initial='1' будет начинать вывод пути с разделителя. Т.е.разделитель появится перед самым первым элементом. Если параметру присвоить значение '0' или опустить, то разделитель появится только между элементами.


This page in: English - Deutsch - Español - Français - Italiano - Lietuvių - Nederlands - Norsk - Polski - Česky - Русский - Svenska - Tiếng Việt - عربي - 日本語 简体中文

User Handbook/Getting Started/Designer/Customizing Templates/ru

From CMSMS

A2 Hosting