Panels как философия

Александр Даниленко

Blink Reaction International LLC

Глоссарий

● Сайтбилдер — Drupal разработчик, собирающий проект из готовых

модулей и не желающий или не умеющий писать свои модули.

● Entity (cущность) — всё, что можно расширить полями и показывать

как контент.

● Panel layout (лейаут) — шаблон, при помощи которого выводится

определенный контент.

● Layout region (регион) — место для контента, который выводится

внутри шаблона.

● Ctools Content type (CCT) — Контент, который передаётся в регион

лейаута панелей. Это может быть: поле, блок, вьюшка, кастомный

CCT и т.д.

● Panelizer default panel — расположение определенных CCT в

регионах.

● View mode (тип представления) — способ показа сущности.

Например: Анонс, Полный контент, и т.д.

Философия? Яжпрограммист!

«С самого начала философия имела две

разные цели, которые считались тесно

связанными между собой. С одной стороны,

философия стремилась к теоретическому

осмыслению структуры мира; с другой —

она пыталась найти и поведать лучший из

возможных образов жизни.»

Немного теории.

Как Drupal видит страницу?

● Блоки не зависят от контента

(нет понятия контекста)

● Блок можно отобразить

только в одном регионе

● Чтобы реализовать логику

показа/скрытия блоков —

нужно писать PHP код в

админке.

● PHP код в админке — это

всегда пичалька. Не делайте

так никогда. Вообще.

HEADER

FOOTER

SIDEBAR

LEFT

SIDEBAR

RIGHTCONTENT

CONTENT

Немного теории.

Как дизайнеры видят страницу?

● Вся страница является

цельным отображением

контента, где любой элемент

может зависеть от

показываемой страницы (от

котнекста показа).

● Контекстом для показа может

быть текущий пользователь,

текущий язык, значение полей

текущей сущности, значение

поля связанного с текущей

сущностью и т.д.

● Даже вьюшки.

Немного теории.

Как Я вижу страницу?

● Вверху - основные

элементы шапки,

одинаковые для всех

страниц. Например:

логотип, название

сайта, слоган.

● Контент - панель с

некоторым количеством

регионов.

● Футер - копирайты.

BRANDING

COPYRIGHT

CONTENT

Вывод

Panelizer? WTF?

Возможность

использования

панелей для вывода

любых сущностей и

любого их типа

представления (view

mode)

Теперь вы можете темизировать панели в то время,

когда вы темизируете панели. Наркомания Drupal-way.

Зачем? Мне и так неплохо

Больше возможностей при

редактировании контента● Вся мощь панелей:

o Вставка всего чего угодно и куда угодно (блоки,

кастомный текст, вьюшки, элементы страницы

(сайтнейм, бредкрамбы, лого, слоган и т.д.).

Проще говоря — всё то, что можно вставить в

любую панель + поля из вашей сущности.

o Можно создать уникальный лейаут,

практически не прибегая к коду (Flexible).

o Добавление классов к полям через админку

(удобно когда используем сетку или CSS

фреймворк)

o In-pace editng

● Переопределение настроек только для одной

сущности.

Пример сложной

задачи

Контент содержит элементы,

которые необходимо растянуть на

100% по ширине текущего экрана.

В обычной ситуации - регион с

контентом фиксируется по ширине

и без костылей в подобном случае

не обойтись.

Можно наделать новых регионов в

теме, но использовать их только

один раз на одной странице. Что

не совсем является оптимизацией

возможностей и Drupal-way

подхода.

Пример сложной

задачи

Контент содержит элементы,

которые необходимо растянуть на

100% по ширине текущего экрана.

В обычной ситуации - регион с

контентом фиксируется по ширине

и без костылей в подобном случае

не обойтись.

Можно наделать новых регионов в

теме, но использовать их только

один раз на одной странице. Что

не совсем является оптимизацией

возможностей и Drupal-way

подхода.

Когда использование Panelizer

оправдано?

● Когда мы — сайтбилдер.

● Когда мы не хотим создавать кучу шаблонов для разных

представлений контента.

● Когда у нас проект типа:

○ Набор Landing страниц

○ Проект с минимумом логики и максимумом разнообразного

контента

● Когда мы разрабатываем тему с нуля (кастомная тема).

● Когда тип материала с одним набором полей необходимо

представлять в нескольких вариациях (цеплять разные лейауты для

определенных нод одного и того же типа) с возможностью выбора на

каждой ноде собственного лейаута.

● Когда используем CSS фреймворк

○ Можно и без сетки, но придётся писать много стилей, вместо

обычного добавления классов элементам.

Когда ещё?

● У Panelizer отличная интеграция с модулем Features - экспортирует

лейауты и настройки вывода для определенных типов сущностей.

● Если мы разрабатываем проекты по методологии повторного

использования кода.

● Если делаем собственный дистрибутив, установочный профиль или

фичу, которую будем использовать на нескольких проектах.

● Если делаем тему на продажу. На выходе получаем кучу

кастомизабельности сайта при минимуме движений по изменению

представления контента.

Когда использование Panelizer не

оправдано?

● Когда мы делаем проект с маленьким бюджетом и морока с панелями

не оплачивается.

● Когда расширяемость проекта совершенно не важна.

● Когда контент вне региона с контентом никак не связан с основным

контентом.

● Когда разработчик не хочет потратить время на изучение новых

подходов и технологий.

— Как мотивировать себя что-то делать?

— Да никак, оставайтесь в жoпе.

Артемий Лебедев

Как всё таки всё это сделать?

Прототипизирование

● Нудный процесс рисования прототипов (мокапов,

скетчей, и т.д.)

● Для чего:

o Чтобы охватить как

можно

более оптимальное

количество элементов,

которые должны быть

внутри главной панели с

контентом.

Правки в теме

● Убираем ширину у страницы и региона с контентом

○ Легче всего использовать сетку

● Убираем в теме регионы с сайдбарами

● Используем Panels Everywhere

Создание полей со ссылками

● Добавляем несколько reference полей

CONTENT (THEME’S REGION)

field_before_content

field_body field_sidebar_2

field_after_content

field_sidebar_1

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Настройка Panelizer

Результат

Создание своего лейаута

● Изменяем *.info файл

o plugins[panels][layouts] = panels/layouts

● Создаём файлы:o THEME / panels / layouts / layout_1/ layout_1.inc

o THEME / panels / layouts / layout_1/ layout_1.css

o THEME / panels / layouts / layout_1 / layout_1.png

o THEME / panels / layouts / layout_1 / layout_1.tpl.php

● Чистим кеши

Создание своего лейаута

layout_1.inc

Создание своего лейаута

layout_1.tpl.php

Результат

CCT - CTools Content Type

CCT - CTools Content Type

CCT - CTools Content Type

CCT - CTools Content Type

CCT - CTools Content Type

CCT - CTools Content Type

hook_ctools_plugin_directory()

/plugins/content_types/no_context_content_type.inc

/plugins/content_types/no_context_content_type.inc

/plugins/content_types/no_context_content_type.inc

/plugins/content_types/no_context_content_type.inc

Ссылки

● Курс по Panels + Panelizer от Drupalize.me

● Дистрибутив Drupal, придерживающийся идеи

“панели везде”: https://drupal.org/project/panopoly

● Куча готовых лейаутов:

https://drupal.org/sandbox/apmsooner/1805170

● Ещё больше лейаутов:

https://drupal.org/project/panels_extra_layouts

● Подробно о CCT

http://internetdevels.ru/blog/ctools-content-type

So long, and thanks for all the fish

RTFM

Александр Даниленко