![Page 2: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/2.jpg)
Спонсоры
Генеральный спонсор
Серебряный спонсор Серебряный спонсор
Бронзовый спонсор Бронзовый спонсор
Организатор
![Page 3: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/3.jpg)
Главные вопросы
• Что такое «Панели»?
• Зачем они нужны?
• Когда следует их использовать?
![Page 4: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/4.jpg)
Что такое «Панели»?
• Мощный инструмент для создания персонализированного гибкого отображения страниц и типов материалов.
• Каждая панель обладает изменяемым набором регионов, внутри которых может быть все что угодно!
• Когда блоков становится много «приходят» панели.
![Page 5: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/5.jpg)
Зачем нужны панели?
• Облегчить и ускорить разработку
• Персонализировать вывод разделов
• Быстрое конструирование страницы
• Больше простора творчеству!
![Page 6: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/6.jpg)
Когда следует использовать?
• На сайте много разделов с разными шаблонами
• Нужна возможность быстрой смены шаблона отдельной страницы
• Растущие сайты и сайты-прототипы
• Стандартизация
![Page 8: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/8.jpg)
Управление панелью
![Page 9: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/9.jpg)
Что можно добавить в регион?
Показан особый вид отображения Views: «Pane content», который используется только для выводе внутри панелей.
![Page 10: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/10.jpg)
Views и Panels
• Не нужно создавать блочные представления Views
• Views создает Content pane(модуль Views content panes)
• Content pane доступен только внутри панели.Избавляемся от избыточного количества блоков.
![Page 11: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/11.jpg)
Вывод ноды панелью
Можно переопределить вывод ноды панелью.
1.Включить в Manage pagesNode template
2.Добавляем Вариант (Add Variant)
3.В Selection rules выбираем Node:Type и указываем тип контента для переопределения.
![Page 12: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/12.jpg)
1. Создание шаблона своей панели
Берем из установленного модуля Panels /sites/all/modules/panels/plugins/layouts любой шаблони копируем в папку со своей темой
![Page 13: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/13.jpg)
2. Создание шаблона своей панели
Редактируем файл .inc ПОСЛЕ РЕДАКТИРОВАНИЯ ОЧИСТИ КЕШ
В .info файле темы добавляемplugins[panels][layouts] = panels/layouts
![Page 14: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/14.jpg)
3. Создание шаблона своей панели
Редактируем файл .tpl.php, правим разметку, добавляем регионы
![Page 15: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/15.jpg)
Набор шаблонов
http://drupal.org/project/panels_extra_layouts
![Page 16: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/16.jpg)
Верстка панелей
• Внутри каждого шаблона можно использовать свой css-файл.
• Более прогрессивный способ использовать css-фреймворк, например, 960.gs
![Page 17: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/17.jpg)
Колоночная сетка (Grid System) 960
• В отдельном CSS файле содержаться значения классов.
• Добавляя к элементу css-классы он получает предопределенные свойства: ширину, наличие внутреннего/внешнего и левого/правого отступа
![Page 18: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/18.jpg)
![Page 19: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/19.jpg)
Классы 960.gs на примере 12-ти колонок
• .grid_3 — занимает 3 колонки, ширина 220px, отступ слева и справа по 10px.
• .alpha — отступ слева 0px
• .omega — отступ cправа 0px
• .prefix_1 — слева внешний отступ 1 колонку (padding)
• .suffix_10 — справа внешний отступ 10 колонок
• .push_6 — сдвиг слева на 6 колонок (left: 480px;)
• .pull_6 — отрицательный сдвиг слева на 6 колонок (left: -480px;)
![Page 20: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/20.jpg)
Генерация и внедрение
• Использовать сетку при дизайне макета!
• CSS файл можно сгенерировать на сайте http://960.gs, настроив кол-во колонок, отступы и общую ширину
• Обычно шаблон фиксирован, но есть и «резиновая» с использованием %
• GridFox — плагин для Firefox, накладывает сетку на веб-страницу
• Firebug
![Page 22: Практическое использование модуля Panels. Богуцкий Виктор](https://reader031.vdocuments.site/reader031/viewer/2022020105/549894ccb47959ac028b4862/html5/thumbnails/22.jpg)
Спонсоры
Генеральный спонсор
Серебряный спонсор Серебряный спонсор
Бронзовый спонсор Бронзовый спонсор
Организатор