(phptemplate) Создание новой темы

Главные вкладки

Аватар пользователя marazmus marazmus 20 января 2007 в 10:14

Планируется серия записок по phptemplate. Пока это именно формат записок, наполовину свои измышления, наполовину компиляция справочных статей с drupal.org.

Пока уровень статей невысок - как раз для средней руки xhtml+CSS верстальщика. Этих знаний должно хватить для "ввода в тему", дальше (глубже) читатель должен сам разобраться.

Имя и каталог для новой темы

Определите имя вашей новой темы. В имени не должно быть дефисов, пробелов и спецсимволов. Также имя темы не должно начинаться с цифры (но может содержать цифры). Вместо дефисов и пробелов нужно использовать символ_подчеркивания.

К примеру, это будет тема под названием bluebox.

Создайте в каталоге /themes подкаталог с именем вашей новой темы.

В нашем случае это будет каталог /themes/bluebox/.

В самом простом случае для того, чтобы новая тема уже работала и была доступна для выбора в панели управления Друпала, нужно создать в каталоге нашей новой темы файл с названием page.tpl.php. И конечно же, он должен содержать минимально необходимые инструкции на html и php - для того, чтобы система шаблонов Друпала смогла использовать нашу тему для отображения содержимого сайта.

Если навыков по заполнению файла page.tpl.php у вас еще нет, можно просто скопировать этот файл из “соседних” тем (в каталоге /themes). Также можно скопировать какую-нибудь тему целиком - весь ее каталог, и затем переименовать копию темы, используя имя новой темы. В этом случае, сразу после операций копирования и переименования, наша новая тема будет доступна для выбора в панели управления Друпала. И до внесения в нее каких-либо изменений или дополнений, наша новая тема пока будет работать и выглядеть в точности, как та тема, с которой мы “сняли копию”.

К примеру, войдем в каталог /themes и скопируем каталог /garland в каталог /bluebox. У нас должен получиться каталог /themes/bluebox, в котором будут все файлы, принадлежащие теме garland. Теперь у нас есть новая тема - bluebox, и мы можем вносить в ее код свои исправления, не затрагивая основную тему garland.

Примечания: этот пример использует имя темы из Drupal версий 5.х - тема garland установлена по умолчанию в версиях Друпала не ниже 5.0. Для “пятерки” также рекомендуются для изучения и работы темы Zen и Bluebreeze.

Файлы шаблонов

Для новой темы обязателен (необходим и достаточен) только один файл - page.tpl.php. Все остальные файлы лишь дополняют тему, каждый на своем уровне. В файле page.tpl.php задается вся html-структура страницы сайта, начиная от заголовков и импорта css-файлов, и заканчивая подробностями типа хлебных крошек и логики отображения регионов. По сути, это обычная html-страница, “скелет”, которая содержит все нужные теги head, body, meta и прочие. Но в ней есть “вкрапления” php, которые управляют добавлением информации, “пришедшей” из Друпала и обработанной с помощью системы шаблонов PHPTemplate. Причем некоторые “куски” информации уже обработаны системой шаблонов, и являются “готовыми” html-блоками. А в page.tpl.php их остается только вывести с помощью оператора print $имя_переменной.

PHPTemplate дает возможность создать новые шаблоны не только для основной структуры страницы, но и для блоков информации меньшего уровня - документов, комментариев, блоков и т.п. Основные виды шаблонов можно задавать в файлах, приведенных в этом списке:

* page.tpl.php - основной шаблон темы
* block.tpl.php - шаблон для блока
* box.tpl.php - шаблон контейнера для определенного содержимого
* comment.tpl.php - шаблон для комментариев
* node.tpl.php - шаблон для документа

Остальные блоки информации, более мелкого уровня, чем эти (к примеру, “хлебные крошки”, список ссылок таксономии для текущей статьи и т.п.) нужно определять в файле template.php. Нужно просто определить, какую функцию шаблона мы будем “перекрывать” своей. К примеру, для перекрытия функции theme_breacrumb() нужно просто добавить в наш файл template.php функцию bluebox_breadcrumb(), и в ней задать, как именно будет выглядеть наш вариант html для “хлебных крошек”. В данном примере нужно учесть, что наша тема называется bluebox - theme_функции нужно перекрывать именем нашей темы.

Примечание: система шаблонов кеширует файлы шаблонов для ускорения работы Друпала. Поэтому, после добавления новых файлов .tpl.php посетите панель управления - раздел Темы (administer → themes). Это сбросит кэш и позволит системе шаблонов найти и использовать новые файлы шаблонов.

Примечание: неплохо было бы заделать где-то переведенный (и немного более подробно описанный) список "темизируемых" функций.

"Подтемы" с помощью CSS

CSS дает мощные возможности по изменению внешнего вида сайта (обычно) без вмешательства в логику его работы. Пример сайта CSS Zen Garden показывает, что на основе одного и того же html-кода можно создать неограниченное количество вариаций внешнего вида всего сайта. Причем посетитель, неискушенный в веб-программировании, даже может не догадаться сразу , что перед нами один и тот же сайт - настолько по-разному эти сайты выглядят.

Друпал также дает такую возможность - организовать новую тему на базе “старой”, используя только новое CSS-оформление. Для этого нужно в каталоге темы создать новый подкаталог - его имя будет именем новой темы. Затем достаточно расположить в этом подкаталоге новый (по содержанию) файл style.css - именно он будет определять новый внешний облик сайта.

Тем не менее, вся логика работы шаблона и набор html-элементов будут взяты из темы-”родителя”.

Это хорошая воможность, к примеру, разделить труд php-программиста, который программирует шаблон, и html-CSS-верстальщика, который будет работать над внешним видом сайта.

Имейте в виду, что в каталоге темы можно создавать неограниченное количество подкаталогов как для новых тем, так и просто для своих нужд - к примеру, для хранения графики и базовых css-файлов. Для Друпала “сигналом” наличия в подкаталоге новой “подтемы” является присутствие там файла style.css. Если этого файла там нет, то Друпал не будет рассматривать данный подкаталог как новую “подтему”.

Комментарии

Аватар пользователя vadbars@drupal.org vadbars@drupal.org 20 января 2007 в 15:58

Полезный материал (этот и другие на тему phptemplate). Ждем продолжения.

Соображение по переводу терминов: имхо, перевод термина "region" буквальным "регион" несет оттенок некоторой "географичности" (ср. "региональные настройки").
Может быть, правильнее будет перевести "область вывода" или кратко "область" (например, экрана или дисплея).

Аватар пользователя Максимыч Максимыч 23 января 2007 в 11:29

Вот например я обычно поступаю так. Беру понравившуюся по дизайну тему, открываю style.css и начинаю на свой вкус менять цвета фона, ссылок, шапку сайта, размеры блоков и т.д. и т.п.
А файл page.tpl.php редактирую только в том случае когда хочу добавить (или изменить) шапку сайта, т.е. добавляю кнопки-картинки "добавить в избранное", "сделать стартовой" , контакты e-maila, или же просто меняю расположнеи строки поиска и т.д. Струтура этого файла - HTML
Только будьте внимательны, что кодировка page.tpl.php UTF-8, поэтому если Вы напечатаете в кодировке win -1251 (а у меня была именно такая ошибка - в теге alt я прописал в вин-1251) , то у Вас не будет отображаться правильно кодировка, и в просмотре HTML будет абра-катабра, и это может послужить отказом поисковых систем в индексации этих страниц.

Аватар пользователя terrorblade terrorblade 24 января 2007 в 23:47

Заглянув в page.tpl.php я обнаружил там лишь html с вкраплениями пхп, что кажется не так сложно, попробую на досуге создать тему, изменяя указанный файл, свои заметки постараюсь выкладывать здесь.