Создание шаблонов Joomla

Сохраните файл template.css в [ПутьКJoomla!]/templates/joomla150_book/css/.

Основная структура вашего шаблона готова. Теперь необходимо определить ее с помощью XHTML файла, который Joomla! сможет отображать в административной секции.

Теперь необходимо позаботится о кое-каких условиях. Как уже говорилось, шаблон должен иметь определенную структуру директорий:

[ПутьКJoomla!]/templates/[НазваниеШаблона]/

[ПутьКJoomla!]/templates/[ НазваниеШаблона]/css/

[ПутьКJoomla!]/templates/[ НазваниеШаблона]/images/

Название шаблона не должно содержать пробелов или каких-либо специальных символов.

При инсталляции шаблона в виде заархивированного файла, Установщик Шаблонов (Template Installer) использует это название для создания структуры директорий шаблона. Также, при использовании некоторых операционных систем проблемы может вызвать слишком «экзотичное» (с использованием букв нелатинского алфавита) название шаблона. И в завершение, отметим также, что название шаблона должно иметь смысл, например, название нашего тестового шаблона joomla150_book>.

В директориях шаблонов должны присутствовать следующие файлы:

Файл структуры:это базовая версия HTML файла, который мы создали ранее: /templates/joomla150_book/index.php. Данный файл должен иметь расширение .php , так как динамические модули Joomla!, которые мы будем использовать позднее интерпретируются именно языком PHP.

Картинка предварительного просмотра:файл /templates/joomla150_book/template thumbnail.png содержит картинку предварительного просмотра шаблона, отображаемую в Менеджере шаблонов (Extensions | Template Manager) административной секции Joomla! Размер картинки обычно не превышает 227 на 162 пикселя. Данный файл можно создать и позднее, когда работа над шаблоном будет закончена.

Метаданные шаблона:файл /templates/joomla15_0book/templatedetails.xml представляет собой инструкцию по автоматической сборке (распаковке) шаблона, используемую Установщиком шаблонов (Template Installer). Здесь можно указать путь для копирования файлов, имя автора и дополнительные метаданные. Во время установки шаблона, Joomla! считывает информацию из этого файла и копирует файлы и данные в соответствующие директории. Для тестового шаблона можно использовать файл из листинга 3, разместив в нем свою информацию. Для любого файла, используемого в шаблоне, необходимо создать соответствующий XML элемент в templateDetails.xml:

… укажите название файла в корневой директории шаблона …

… и так для каждого файла шаблона

Другие элементы XML файла служат для описания шаблона. Вот полный листинг функций такого файла:

Листинг 3: templateDetails.xml

templateDetails.xml

joomla150_book

0.1

28.07.2006

Hagen Graf

GNU/GPL

hagen@cocoate.com

http://www.cocoate.com

0.1

… Описание

index.php

templateDetails.xml

template_thumbnail.png

css/template.css

CSS файл:В одном шаблоне можно использовать несколько CSS файлов. Название CSS файла и метод его создания не имеют особого значения. Хотя существуют стандартные описания различных элементов CSS. Для нашего тестового шаблона мы используем файл /templates/joomla150_book/css/template.css (Листинг 2).

Графика, Картинки:здесь можно разместить графические файлы, необходимые для шаблона. Во время инсталляции, Установщик шаблонов копирует их в директорию /images. Имя и путь к файлу при этом выглядят так: /templates/joomla150_book/images/[user-defined image files].

После того, как мы создали структуру директории [ПутьКJoomla!]/templates/, наш шаблон появится в соответствующей секции административной части Joomla! (Extensions | Template). Теперь его можно использовать как шаблон по умолчанию.

Рис. 2: Структура директории и файлы шаблона Joomla150_book

Рис. 3: Новый шаблон в менеджере шаблонов

Если вы загрузите свой сайт в веб обозревателе, вы увидите новый шаблон. К сожалению, он пока пуст. Теперь нам предстоит интегрировать контент в шаблон элемент за элементом.

Рис. 4: Вид в веб обозревателе

Внедрение модуля Joomla! проводится с помощью команд, встроенных в HTML код. Это могут быть и старые команды Joomla! 1.0.x или Mambo 4.5.x, или новые команды patTemplate. Класс patTemplate служит для дифференцирования PHP и HTML кода. Для интеграции в шаблон различных элементов, Joomla! использует объект типа jdoc. Если, вместо тега

Рис. 5: Иконка сайта и заголовок страницы

Если вы откроете исходный код этой страницы, то заметите, что Joomla! копировала все метаданные, введенные через панель администратора в HTML код. В дополнение к этому источники RSS также были интегрированы в страницу в виде тегов ссылок, отображаемых как символы источников новостей (Newsfeeds) в веб обозревателях, поддерживающих данную технологию (Firefox, Opera и т.д.).