Panels. Введение

В предыдущем уроке я рассказал как с помощью Page Manager настроить сложные правила доступа к контенту. Сегодня, как вы уже поняли, речь пойдет о базовых возможностях модуля Panels.

Некоторые возможности модуля Panels:

  • Панели поддерживают стили, которые могут управлять как отдельными панелями с содержимым так и регионами в целом. В составе модуля имеется 4 стиля, но при необходимости можно добавлять свои стили в виде плагинов;
  • Панели хороши для визуального проектирования содержимого страниц, для этого в составе модуля имеются различные макеты страниц. Так же как и в случае со стилями, макеты страниц могут быть легко добавлены в виде плагинов;
  • C помощью панелей можно управлять отображением панелей с содержим по различным условиям и при этом не придется писать ни строчки кода!

Шаг 1. Включаем страницу и создаем новый вариант страницы. Заполняем все поля формы (выбираем тип варианта "Панель") и жмем "Создать вариант":

Шаг 1. Создать вариант
Шаг 1. Создать вариант

Шаг 2. Откроется форма Правила выбора, в которой необходимо добавить условия, при выполнении которых будет выбран вариант. Добавляем условие "Материал: тип", выбираем нужный тип материала и жмем "Далее":

Шаг 2. Сохранение правил выбора
Шаг 2. Сохранение правил выбора

Шаг 3. Перед вами откроется форма Выбор макета страницы:

Шаг 3. Форма выбора макета страницы
Шаг 3. Форма выбора макета страницы

Шаг 4. Выбираем категорию "2 колонки", макет страницы "Две колонки" и жмем "Далее":

Шаг 4. Сохранение макета страницы
Шаг 4. Сохранение макета страницы

Шаг 5. Перед вами откроется форма Настройки панели, здесь:

  • Административный заголовок - название варианта;
  • Отключить блоки/регионы Drupal - если нажать эту галку, то на странице будут отключены регионы, выводимые темой оформления;
  • Удалить CSS классы body - введенные сюда css классы будут удалены у тэга body;
  • Добавить CSS классы body - введенные сюда сss классы будут добавлены к тэгу body;
  • Средство визуализации - тип визуализации панели. По умолчанию доступен только "Стандартный". Если включить модуль Panels In-Place Editor (входит в состав Panels) добавится тип "In-Place Editor";
  • CSS ID - введенный сюда сss id будет добавлен к тэгу body;
  • CSS-код - css стили для страницы.

Ставим галку "Отключить блоки/регионы Drupal" и жмем "Далее":

Шаг 5. Настройки панели
Шаг 5. Настройки панели

Шаг 6. Перед вами откроется форма Содержимое панели, здесь:

  • Тип заголовка - тип заголовка страницы;
  • Подставочные шаблоны - доступные токены (могут использоваться для формирования заголовка страницы или же для заголовков фрагментов панели и их содержимого).

Под подставочными шаблонами мы видим наши регионы (на скриншоте я обвел их в красную рамку), в которые мы будем добавлять фрагменты страницы:

Шаг 6. Содержимое панели
Шаг 6. Содержимое панели

Шаг 7. В верхнем левом углу региона есть шестеренка, нажимаем ее:

Шаг 8. Откроется маленький попап, в котором необходимо нажать "Добавить содержимое":

Шаг 8. Добавить содержимое
Шаг 8. Добавить содержимое

Шаг 9. Откроется попап. В левой части попапа расположены категории содержимого, после выбора категории в правой части попапа появится доступное содержимое. Нажимаем на категорию "Материал" и выбираем содержимое "Rendered Материал":

Шаг 9. Добавление содержимого
Шаг 9. Добавление содержимого

Шаг 10. Откроется форма с настройками содержимого. Здесь Переопределить заголовок - это заголовок добавляемого содержимого (аналог заголовка обычного блока). Остальные настройки могут меняться в зависимости от типа содержимого панели. Ставим галку "Переопределить заголовок", оставляем поле пустым (в этом случае заголовка не будет), "Режим просмотра" - "Содержимое полностью" и жмем "Готово":

Шаг 10. Сохранение содержимого "Rendered материал"
Шаг 10. Сохранение содержимого "Rendered материал"

Шаг 11. И так, в левую колонку мы добавили наш материал, а в правую колонку сейчас мы добавим Новые комментарии, проделаем почти тоже самое, что и в прошлых 4 шагах, только теперь выберем категорию "Деятельность" и содержимое "Новые комментарии". В открывшейся форме нажимаем галку "Переопределить заголовок", вводим заголовок "Последние комментарии" и жмем "Готово":

Шаг 11. Сохранение содержимого "Последние комментарии"
Шаг 11. Сохранение содержимого "Последние комментарии"

Шаг 12. Жмем "Создать вариант":

Шаг 12. Создать вариант
Шаг 12. Создать вариант

Шаг 13. Жмем "Обновить и сохранить":

Шаг 13. Обновить и сохранить страницу
Шаг 13. Обновить и сохранить страницу

Для того, чтобы поменять местами содержимое, достаточно навести на заголовок содержимого курсор (курсор сменит вид на перекрестие), зажать левую кнопку мышки и перетащить содержимое в нужный регион:

Изменение положения содержимого
Изменение положения содержимого

P.S. С помощью Panels можно настраивать макеты страниц, например для разных типов материалов выводить разное содержимое.

Комментарии (16)

Аватар пользователя dotter
dotter

Хотелось спросить, а разве вариантов с тремя к нету?

Аватар пользователя Benya
Benya

Не совсем понял, что Вы имеете ввиду? Если вы хотели спросить о макете с тремя колонками, то есть и такие. Но к слову сказать, можно создать свой макет любой сложности (с любым количеством регионов), о том как это реализовать я покажу в следующем уроке (как всегда в пятницу).

Аватар пользователя roman-yakimkin
roman-yakimkin

Добрый день.

Случайно наткнулся на Ваш ресурс, он мне понравился. Но вот по поводу panels и page manager возникает чисто программистский вопрос.

А именно, можете объяснить на пальцах, в чем заключается значительный практический выигрыш от их использования при разработке своих сайтов ? Ведь существует довольно богатое API и довольно продвинутая темизация в Drupal 7.

Нужно, к примеру, запретить что-то показывать определенному типу пользователей - хук в несколько строчек кода и всё. Или тот же трехколоночный стиль с отображением различной информации в колонках для ноды определенного типа без проблем реализуется путём написания шаблона node--ТИП_НОДЫ.tpl.php. И так для программиста даже проще и понятнее, чем разбираться с интерфейсом еще одного модуля и забивать себе голову дополнительными сущностями.

А обычный пользователь, на мой взгляд, и с интерфейсом panels вряд ли разберется.

Объясните, пожалуйста, для чего нужны panels, page manager и в каких случаях они являются практически незаменимыми ?

Аватар пользователя Benya
Benya

Здравствуйте. Для меня самый важный плюс - это простота администрирования и контроля сайта, а так же время разработки больших проектов гораздо быстрее. Просто представьте, что Вам одну и туже ноду нужно показать в 10 разных вариантах для разных ролей. В конечном итоге код вырастет до таких размеров, что администрировать все это будет с каждым разом все сложнее и сложнее. Помимо этого количество шаблонов в теме будет с каждым разом расти по мере расширения функционала.

С помощью шаблонов типа node--ТИП_НОДЫ.tpl.php Вы влияете на вывод только ноды, Panels же влияют на вывод страницы в целом. Что бы повлиять на страницу без Panels, Вам придется написать кучу кода с проверками, расплодить кучу шаблонов, а для блоков написать "деревянные" правила отображения (правила отображения блоков очень унылы, по сравнению с тем, что предлагает Page Manager).

Еще один плюс, о котором я слышал, но лично сам не проверял - сайты на панелях более производительны.

Аватар пользователя Denozavr
Denozavr

Доброго времени суток.
Отличный ресурс и статья.
Функционал панелей действительно огромен..и подкупает простота.

Но есть и минусы: макетов реально мало для нормального сайта.
Мне вот пришлось извращаться чтобы вывести все как надо.

Может есть какой способ задать свой макет..например только этажерка из 5-7 этажей и т.д.

Аватар пользователя Benya
Benya

Здравствуйте. Есть по крайней мере 2 способа для создания своего макета:

  1. В панелях есть инструмент, с помощью которого можно создавать макеты любой сложности. Плюс данного способа в том, что макеты может создавать человек, не владеющий кодом - ему только мышкой покликать в админке надо. Минус этого способа заключается в том, что много лишнего кода в разметке макета
  2. Написать свой макет, такой сложности, которая Вам необходима. Как это сделать написано здесь Как создать layout плагин для модуля Panels. Я выбираю этот способ, по сколько он позволяет контролировать макет и весь код в нем чистый и понятный
Аватар пользователя Denozavr
Denozavr

Ой, пасиб )
Первый я вспомнил...вот что значит нет постоянной практики..умения = Лузер+
Второй попробую.
Вопрос? Вам можно в "личку" написать по написанию модуля USER?

P.S. Поставьте "_blank" на ссылку "блог о друпале"

Аватар пользователя Benya
Benya

Да конечно, можете написать в личку, что Вам необходимо сделать. Я всегда готов сотрудничать

Аватар пользователя Denozavr
Denozavr

отправил вам все через форму контактов

Аватар пользователя Максим
Максим

Добрый день. Подскажите, возможно ли с помощью панелей настроить отключение региона при определенном разрешении экрана?

Аватар пользователя Benya
Benya

Да возможно, но я бы делал с помощью CSS media queries и не заморачивался с панелями

Аватар пользователя Максим
Максим

Интересует вариант, когда в блоке расположен Adsense. По этой причине display: none использовать нельзя. Как бы вы реализовывали? Mobile Detect, может быть?

Аватар пользователя Benya
Benya

Как вариант, но здесь стоит учитывать, что с помощью Mobile Detect нельзя получить разрешение экрана, как вы спросили изначально. Вы сможете определить мобильное ли устройство или конкретную ОС. Плюс этот вариант будет плохо совместим в случае включенного кеша страниц для анонимных пользователей. Возможно стоит посмотреть в сторону js/ajax, что бы подгружать/удалять этот блок динамически при изменении размеров экрана.

Аватар пользователя Максим
Максим

Спасибо за совет. Я правильно понял, что готового модуля с необходимым функционалом не существует, если говорить о физическом размере экрана безотносительно его ориентации?
Попробуйте модуль "honeypot" на своем сайте, возможно, вам понравится.

Аватар пользователя Игорь
Игорь

Приветствую! Скажите как можно вытащить в панель поля для редактирования товаров?

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