Шаблоны

Шаблон — один из наиболее важных элементов Joomla!: он определяет внешний вид сайта. Прим. перев.: без шаблона страницы сайта вообще были бы пусты. Благодаря ему посетители задерживаются на вашем веб-ресурсе и начинают его изучать. Как рядовые посетители, так и пользователи оценят красивый и удобный дизайн. Задумайтесь, например, об автомобиле. Очень часто качественный дизайн для покупателя имеет не меньшее значение, чем качественные двигатель и ходовая. В большинстве случаев дизайн, даже если он не является ключевой причиной приобретения товара, стимулирует покупателя к рассмотрению варианта. Если дизайн продукта хорошо разработан, покупатель будет ожидать, что и все остальные аспекты — на том же уровне.

Рис. 1. Машина с наклейками. (Richardmasoner)

Рис. 2. Красная машина. (FotoSleuth)

У машин, иллюстрации которых приведены выше, будут разные покупатели. Они являются примерами разных подходов к дизайну. Веб-дизайн в некоторой мере — ручная работа. У веб-дизайнера — множество обязательных навыков, среди которых — написание кода на HTML, CSS, JavaScript, PHP, а также обработка изображений. Joomla — всего лишь еще один инструмент в инструментальном ящике.

Качество шаблона — это не только грамотный подбор цветов и качественная обработка графики. Формы и расположение контента на странице не менее важны. Сайт должен быть надежным и дружественным пользователю. Задача, состоящая в создании такого сайта, возвращает мои мысли к двум упомянутым выше машинам.

Веб-дизайнер — молодая профессия. Среди проблем, с которыми сталкиваются веб-дизайнеры — низкая скорость интернет-соединения, несовместимость браузеров, недостаток опыта у контент-менеджеров и прочих людей, занятых в создании «хорошего» веб-сайта. Часто разработка сайта на Joomla — это процесс, по ходу которого все участники приобретают много знаний и умений. Высококлассный веб-дизайн — тяжелый труд. :-)

Шаблоны Joomla

Joomla известна своими качеством и простотой. Страницы сайта, создаваемая ею, состоят из HTML-вывода компонентов, некоторого количества модулей и шаблона. Каждая страница находится по уникальному адресу [URL]. Возьмем в качестве примера главную страницу. Статейный компонент генерирует центральную ее часть (рис. 3). Фрагменты страницы рядом с выводом компонента — модули. Страница может состоять из вывода одного компонента и любого количества модулей. Модули, используемые на одной странице, могут быть использованы на другой.

Рис. 3. Макет главной страницы сайта на основе Joomla.

Позиции модулей

Положение модулей на странице определяется шаблоном. Каждый шаблон предоставляет набор посадочных мест, иначе говоря, позиций. Конечно же, администратор должен иметь представление о том, где эти посадочные места расположены. Для этого в Joomla предусмотрены схемы модульных позиций с выделением областей и выводом названий (рис. 4). Схему текущего шаблона можно просмотреть на стороне посетителей, для чего к адресу главной страницы сайта необходимо добавить ?tp=1, например, http://ваш_сайт/?tp=1. Схемы макетов всех имеющихся шаблонов можно просмотреть в административном разделе: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер шаблонов» → вкладка «Стили» → пиктограммы слева от названий в перечне (рис. 5). В обоих случаях вывод схемы необходимо предварительно разрешить: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер шаблонов» → пиктограмма «Настройки» на панели инструментов → вкладка «Шаблоны» → селективная кнопка «Просмотр позиций модулей» → значение «да».

Задать позицию тому или иному модулю можно при помощи менеджера модулей: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер модулей» → страница настройки нужного вам модуля → поле «Позиция». Если вы хотите, чтобы один и тот же модуль выводился на странице в двух экземплярах, в разных позициях, то можете его скопировать.

Рис. 4. Позиции модулей.

Рис. 5. Пиктограммы вывода схем.

Шаблоны в исходной комплектации

Исходная комплектация CMS Joomla 2.5 включает в себя три шаблона для стороны посетителей и два — для административного раздела. Для предварительного просмотра перейдите на страницу менеджера шаблонов: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер шаблонов» → вкладка «Шаблоны» (рис. 5).

Рис. 5. Шаблоны для стороны посетителей.

«Atomic» — пример того, как выглядит элементарный шаблон. В главе «Создание нового шаблона на основе Atomic» он будет использован в качестве основы для создания собственного шаблона. «Beez5» — это версия «Beez2», созданная с применением HTML5. Для административного раздела также есть «запасной» шаблон (рис. 6).

Рис. 6. Шаблоны для административного раздела.

Стили

Стили — это новая функция системы, появившаяся в Joomla 1.6. Она позволяет видоизменять имеющиеся шаблоны. Каждый шаблон имеет, как минимум, один стиль. Гибкость настройки стиля зависит от каждого конкретного шаблона. Примеры настройки — выбор цветовой схемы страниц, выбор логотипа. Задать стиль по умолчанию можно при помощи менеджера шаблонов: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер шаблонов» → вкладка «Стили». Отделить стили для административного раздела от стилей для стороны посетителей можно при помощи фильтра «Выбор области системы». Шаблон по умолчанию «Beez2» имеет два предварительно заданных стиля: «Стандартный» и «Сайт Парков».

Новые стили создаются копированием имеющихся. Стили можно применять к тем или иным пунктам меню и, следовательно, к тем или иным страницам или разделам. Если вы хотите, чтобы посетители, кликнув по пункту меню «A», видели страницы с зеленым фоном, а, кликнув по пункту меню «B», видели страницы с синим фоном, то можете назначить пунктам «A» и «B» соответствующие стили (рис. 7).

Рис. 7. Назначение стиля пунктам меню.

Подробнее о шаблонах будет говориться в главе «Работа с шаблонами».