MaxSite.org 11 лет
Блог вебмастера о сайтостроении
Внимание! Данная запись отмечена как устаревшая и может содержать неточную или неактуальную информацию!

Шаблоны для новичков. Урок 19. Основы работы с D2

MaxSite CMS / Создание шаблонов (версии 0.8x)Просмотров: 7322 (125)

В наших уроках возникла некоторая пауза, за время которой вышла новая версия MaxSite CMS — 0.81, где появились новые совершенно замечательные возможности для вебмастеров. Речь, конечно же идёт о новом шаблоне D2, который строится на основе shared-каталога. Об отличиях я уже рассказывал в «Кратком обзоре новых возможностей MaxSite CMS 0.80». Для нас принципиальным будет тот момент, что теперь уроки будут рассчитаны на построение шаблона на shared-каталоге. Если раньше всё замыкалось на default-шаблон, то теперь шаблон строится независимым от любого другого шаблона.

Если мы посмотрим на D2 (который построен на базе shared-каталога), то в целом увидим привычные каталоги и файлы, только в меньшем количестве и немного в другой структуре. В этом также есть отличие от default-каталога — файлы, которые приходилось дублировать от шаблона к шаблону, теперь вынесены из шаблона в shared. Файлов меньше, код — чище.

В этом уроке мы разберём устройство D2.

Пустые каталоги

Пустые — условно. Отсутствие в каталоге файлов (кроме readme.txt) указывает на то, что шаблон будет использовать «нужный» файл из shared-каталога или он вовсе не нужен и будет использоваться типовой вариант вывода MaxSite CMS.

Type-файлы теперь находятся в shared/type и теперь организованы по своим подкаталогам.

Остальные каталоги уже привычны по default-шаблону.

«Главные» файлы

Нетрудно заметить, что в D2 стало меньше файлов. Остались лишь те, без которых работа шаблона будет неполной.

Файл info.php, как и прежде содержит информацию о шаблоне. Файл screenshot.jpg — миниатюра. Эти файлы не являются обязательными, но используются в админ-панели при переключении шаблона сайта.

Файл functions.php — специальный файл, который автоматом подключается при инициализации системы. Здесь задан один сайдбар, а также выполняются подключение php-файлов с разными библиотеками и функциями. Для своих целей, как и прежде лучше всего использовать custom/my_functions.php.

Файл index.php претерпел большие перемены и стал заметно меньше. Теперь всю диспетчеризацию выполняет ядро MaxSite CMS.

Файл main.php — модульная сетка сайта. В отличие от варианта из default-шаблона, этот файл также изменился. В первую очередь поменялись/добавились некоторые custom-файлы и ушки. Из-за этих изменений, не следует использовать старые custom-файлы из default-шаблона. Откройте main.php и убедитесь что подключается правильный файл.

Main-шаблон

Файл main.php может быть не один и это означает, что сайт теперь может иметь несколько модульных сеток одновременно. Например на сайте нужно выводить некоторые страницы без сайдбара. Раньше подобная задача решалась через custom-файлы, где нужно было вручную прописывать условия вывода сайдбара.

В D2 достаточно разместить отдельный main-файл в каталоге main и выбрать файл при редактировании записи или в настройках шаблона.

Откройте файл main/no-sibedar/main.php. Обратите внимание на то, что у BODY указан css-класс no-sidebar и удалён код подключения сайдбара из div.main.

Опции

Все опции шаблона теперь собраны в отдельном каталоге options. Сами опции теперь можно разбивать по ini-файлам. Удобно так: одна секция — один файл. Файл options.php выполняет все необходимые действия (точнее переносит их на shared-каталог).

По-умолчанию к шаблону подключаются дефолтные опции из shared/options/default. Однако, если в options.php указать

mso_set_val('get_options_default', false);

— то будут подключены только опции шаблона.

Type_foreach-файлы

Некоторые из них немного изменили своё назначение и несовместимы с default-шаблоном. Это объясняется тем, что код type-файлов изменился, соответственно что-то поменялось и здесь. Но в целом — это те же type_foreach-файлы.

Каталог type_foreach/info-top — особый. Он содержит type_foreach-файлы, которые подключаются как info-top.php. То есть можно создать несколько вариантов вывода info-top (заголовок и информация записи) и выбирать их при редактировании. Например файл header-only.php содержит вывод только заголовка записи, а category-and-header.php — рубрику и заголовок. То есть теперь можно у записей указывать разный формат вывода заголовка. Такая особенность присуща только info-top.

Обратите внимание, что во многих файлах используется шаблонизатор Page_out. В шаблоне D2 он подключается автоматически.

Компоненты шапки и подвала

Новые компоненты теперь имеют строгие правила. Прежде всего, каждый компонент расположен в отдельном каталоге. Имя компонента совпадает с его каталогом. Это обязательное условие, которое сделано по аналогии с type-файлами (там такие же правила именования).

Опции компонента располагаются файле options.ini и, если требуется, options.php. Эти файлы автоматически подключаются к админ-панели в настройках шаблона. В options.ini нужно использовать section, чтобы сформировать отдельную закладку компонента.

Если компонент использует css-стили, то их следует расположить в файле style.css — он автоматически подключится в HEAD сайта.

Компоненты могут быть двух видов: обычные и подкомпоненты. Разница между ними в том, что подкомпонент сам по себе не используется и как правило начинается с символа подчеркивания «_». Пример — _social: вывод соц.иконок. Этот компонент есть смысл использовать в другом, например в menu-icons, который состоит из подкомпонентов menu и _social. То есть подкомпонент может использоваться внутри другого, что делает его универсальным «кирпичиком».

Сейчас в D2 20 компонентов. Во многих компонентах также используется шаблонизатор Page_out. Здесь есть небольшой нюанс: в подкомпоненте лучше его не использовать, поскольку переменная $pt может перекрыться в подкомпоненте, что может нарушить вывод в браузер.

Компоненты, как и прежде выбираются через админ-панель. Если стоит задача зафиксировать подключаемые компоненты, то используем custom/header_components.php и custom/footer_components.php. Чтобы скрыть опции из админ-панели создаём файл options/07_blocks.ini с пустыми секциями блоков:

[Первый блок шапки]
[Второй блок шапки]
[Третий блок шапки]
[Четвёртый блок шапки]
[Пятый блок шапки]
[Первый блок подвала]
[Второй блок подвала]
[Третий блок подвала]
[Четвёртый блок подвала]
[Пятый блок подвала]

Данный подход я использовал в шаблоне MAX Bet.

CSS-стили

Подключение CSS-стилей практически не изменилось и полный алгоритм можно посмотреть в wiki.

Традиционно для вёрстки шаблона мы используем var_style.css, который автоматически формируется в var_style.php с помощью less-компилятора. На рабочем сайте компилятор лучше не использовать, поскольку он достаточно прожорлив (ну или как минимум использовать его кеширование).

То есть все css-стили формируются в виде less-файлов.

LESS-файлы

Все less-файлы теперь вынесены в отдельный каталог css-less. Структура его подкаталогов в общем-то может быть произвольной, но мы будем придерживаться текущего варианта.

Основной файл — var_style.less. Это диспетчер всех подключаемых стилей шаблона. Раньше я уже затрагивал вопросы организации less-файлов, здесь — готовый результат.

Полностью верстку будем разбирать в следующих уроках, здесь лишь некоторые интересные моменты.

Строчка

@import url('../../../shared/css-less/mixins/helpers.less');

— подключает стандартные less-хелперы из shared-каталога. Обратите внимание на относительный путь к файлу. Элемент «../» указывает на один уровень выше текущего.

Если вы будете использовать подключение less-файлов из подкаталогов к другому less-файлу, то путь указывается относительно var_style.less. Например в css-less/stock/calendar.less нужно подключить микс из css-less/mixins/calendar.less. В первом файле пишем:

@import url('mixins/calendar.less');

Это особенность сборки less-файлов, когда они вначале все собираются в один «виртуальный» файл, а после он компилируется как одно целое.

Обращу внимание на следующие строчки:

@MSO_IMPORT_ALL_BLOCKS;
@MSO_IMPORT_ALL_COMPONENTS;
@MSO_IMPORT_ALL_PLUGINS;
@MSO_IMPORT_ALL_TYPE;
@MSO_IMPORT_ALL_ELEMENTS;

Это специальные конструкции, которые работают только в MaxSite CMS и позволяют автоматически выполнять @import для всех файлов в каталогах:

  • blocks
  • components
  • plugins
  • type
  • elements

То есть не нужно их вручную прописывать в var_style.less. Система сделает это самостоятельно. Впрочем, если какой-то less-файл из этих каталогов подключать всё-таки не следует, то можно их переименовать так, чтобы имя начиналось с подчеркивания «_» или дефиса «-». Такие файлы автоматически не подключаются, только вручную.

Деление на подкаталоги, возможно вызовет у вас некоторые вопросы. Группировать less-файлы (читай css-стили) достаточно спорное занятие и наверное зависит от предпочтений вебмастера. Я исхожу из того, чтобы в файлах содержались стили логических html-блоков. Например вывод главной будет в type/home.less. Хотя, при этом часть стилей будет заимствована из mixins/columns.less. То есть следует просто ознакомиться с текущим вариантом, а использовать его или нет уже не имеет принципиального значения.

««« Урок 20 | Урок 18 »»»

Комментариев: 10 RSS

1Александр Шиллинг31-01-2013 00:06

Спасибо за урок! Теперь многое стало понятно. Я уже реализовал свой шаблон на базе D2 и продолжаю его дальше изучать.

2Пономаренко Вячеслав31-01-2013 10:36

Присоединюсь к благодарностям, действительно спасибо Максим что Вы вернулись к написанию уроков. Особенно в контексте выхода нового подхода в D2. Хотя если внимательно разобрать первые 18 уроков, то становится понятна и логика нового типа шаблонов.

А есть ли какой-то план по написанию следующих уроков? Можно ли на него посмотреть? Особенно интересует урок с живым работающим примером по использованию метаполей для различных типов страниц, с выводом их на сайте. Это при условии конечно, что нет урока о том как можно на MaxSite создавать произвольные базы данных со связанными таблицами. Пока мои поиски по форуму и всем доступным ресурсам не привели к желаемому результату :(

С уважением, Вячеслав.

3MAX31-01-2013 11:51

Плана нет. Просто в голове какие-то задумки, которые и выходят в виде уроков. На следующие планирую разобрать less-стили D2.

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

Метаполя — для какой-то задачи. Так их в my_meta.ini задал и выводи где хочешь. Слишком примитивно.

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

Не уверен, что это задача для новичка. Сделать конечно можно, но опять же, должна быть какая-то практическая задача. Пока можно посмотреть плагин guestbook.

4Пономаренко Вячеслав31-01-2013 12:56

Про стили тоже будет очень полезный урок. Особенно тем, кто наконец решил перейти на LESS.

Про свою задачу я уже писал Вам в письмах. Читая Ваши уроки и все что есть на форму я пытаюсь найти решение для нее. Пока решения нет (одной из подающих свет в мой тупиковый тунель была идея с метаполями, но и она похоже умерла не родившись).

Плагин guestbook я посмотрел. Не скажу что все понял, но идею главную ухватил.

Быть может Максим все-таки найдете для меня время для встречи? Как видите я не теряю надежду ;)

И может быть я опишу Вам свою практическую задачу, а Вы подготовите урок как такое можно/нужно реализовывать на MaxSite CMS ? Я лично думаю что он будет мега интересным для многих (а если в итоге это еще реализовать как встроенные возможности Вашей системы, то поле применения ее станут просто безграничны).

С уважением, Вячеслав.

5Evgeny Karsky01-02-2013 20:54

Да, скрипт корзины и работа с базой данных через интерфейс (как вьюха у Друпал) и эта сиэмэс превратилась бы в монстра и составила бы реальную конкуренцию другим продуктам. ИМХО

6agb17-02-2013 01:16

У меня вопрос по каталогу /application/maxsite/shared/blanks/type_foreach

в readme написано, что файлы в нем не совместимы с d2 и shared. А где взять совместимые? И как узнать, совместим конкретный файл или нет? Можно его копировать в шаблон в соответствующий каталог или нет?

7MAX17-02-2013 10:45

Пока нигде. Смотрите type-файл — там вставки type_foreach-файлов.

8Илья Земсков21-04-2013 07:38

Каталог type_foreach/info-top — особый. Он содержит type_foreach-файлы, которые подключаются как info-top.php. То есть можно создать несколько вариантов вывода info-top (заголовок и информация записи) и выбирать их при редактировании. Например файл header-only.php содержит вывод только заголовка записи, а category-and-header.php — рубрику и заголовок. То есть теперь можно у записей указывать разный формат вывода заголовка. Такая особенность присуща только info-top.

Попытался найти подключение header-only.php - что-то не нашлось. Логику использования так и не понял пока. Если разберусь, то эту фразу «выбирать их при редактировании» тогда тоже пойму :)

9Илья Земсков21-04-2013 07:45

Да, скрипт корзины и работа с базой данных через интерфейс (как вьюха у Друпал) и эта сиэмэс превратилась бы в монстра

Корзину надо бы делать плагином, т.к. это скорее прикладная задача, а не прямая задача разработчика cms. Пишите подробно «хотелки» на форуме - тогда задача создания плагина решится быстрее, ибо всегда легче действовать от реальной потребности, а не самому что-то там фантазировать.

Работа с базой данных через интерфейс cms - думаю это слишком. В чём проблема освоить бесплатный специализированный софт для работы с БД? Лично мне возможностей Heidisql, который включен в пакет OpenServer хватает выше крыши для задач работы с БД.

10Илья Земсков22-04-2013 08:53

Попытался найти подключение header-only.php - что-то не нашлось. Логику использования так и не понял пока.

Разобрался. Надо было просто искать type_foreach/info-top - сразу бы нашёл пример использования в \shared\type\page\page.php.

Оставьте комментарий!

Комментарий будет опубликован после проверки. Вы соглашаетесь с правилами сайта.

(обязательно)

О сайте

Здесь вы получите самую полную информацию о создании сайтов на MaxSite CMS.