Связка из модулей Panels, Views и Bootstrap Framework. Кто же такой Сисадмин

Модуль Panels создает дополнительные регионы на страницах Drupal сайта. Каждый регион или область веб-страницы можно заполнить любым контентом и блоками. Этот модуль делает админку более гибкой и функциональной. Теперь вы сможете не просто перетаскивать блоки по разным регионам, но и увидеть результат визуально.

Скачать модуль Panels ]]> https://www.drupal.org/project/panels ]]>

Русификация модуля ]]> https://drupaler.ru/translate/languages/ru/export?project=panels ]]>

Также я подготовила подборку видео уроков, которые помогут быстрее освоить все возможности панелей.

Активируем на странице модулей все 4 пунктика:

Дополнительно в «Наборе инструментов Chaos» активировать модуль Chaos tools и Page manager.

Для создания пользовательских стилей для приложений, таких как панели поставить здесь же галочку и напротив модуля Stylizer.

На странице разрешений (permissions) ставим галочки напротив администратора.

Во вкладке "структура" у нас появились новые пункты: "Панели" и "Мини-панели".

Давайте посмотрим что появилось нового, пройдя по ссылке "Панели":

Мы можем сконструировать страницу панель, мини-панель, материал-панель и свой макет.

Как создавать панели и что можно сделать при помощи нового функционала мы рассмотрим на практическом примере построения раздела на сайте "Отзывы".

Про установку и создание мини панели вы можете посмотреть в видео ролике:

Что мы можем еще сделать в панелях друпал

Добавить блоки, как встроенные, так и созданные нами.
Добавлять разные элементы страниц ("хлебные крошки", вкладки и тому подобное).
Добавить материалы сайта.
Добавлять дополнительные элементы на веб-страницу, например, различные формы. В каталоге статей это форма для добавления материала. Для этого используется загрузка "Контекста" в панели.

Я нашла готовый наглядный обзор модуля панели про добавление "Контекста". Посмотрите в видео ролике:

Всем привет. Решил реализовать каталог на Drupal 7. Целью было создать его без модулей Ubercart и Commerce. Конечно, я понимаю что из них тоже можно сделать каталог, но зачем за собой тянуть столько левого функционала, я не понимаю.

Конечно я полез в гугл и нарыл инфу. Как оказалось, на англоязычных сайтах все решения которые были предложены, так или иначе использовали Ubercart и Commerce. Среди русскоязычных попался всего лишь один достойный: «Продвинутый каталог на Drupal 7 ». Я его попробовал, мне понравилось, но у него есть недостатки:

Самый главный - невозможность задания алиасов для адресов. Т.е. Разделы каталога имеют жесткий адрес catalog/%TID.
Необходимость включения фильтра PHP. Я стараюсь избегать включения данного модуля, ведь если сайтом будут управлять криворукие - то этот фильтр просто яма в безопасности.
Плодятся типы материалов (для фильтров). Не пробовал, точно о проблеме сказать не могу. Мне хватило первых двух чтобы отказаться от него.

Перепробовал уйму вариантов на одном лишь Views. Были даже рабочие, но их гибкость вызывала сомнения. В итоге решением всех проблем стала связка Views & Panels. Именно об этом я и расскажу.

P.s. То что замазано на скринах - настройки по умолчанию (не менялись).

Подготовка

Не удивительно, но для создания каталога понадобится Views , Panels и конечно же Ctools . Включаем:

Chaos tools
Page manager
Views content panes
Panels
Views & Views UI

Для начала создайте словарь таксономии с названием «Категории каталога» (или же как вам нравится). Добавьте необходимые категории.

Теперь создайте новый тип материала (например «товар») который будет добавляться в каталог, и добавьте ему поле «Term reference» которое ссылается на ваш словарь «Категории каталога». Также добавьте парочку товаров, чтобы видеть результаты.

Создание представлений (Views)

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

Тут проще простого.

Жмем «Add new view»
Указываем название «Каталог»
Show: Taxonomy terms of type «Категории каталога»
Ставим галочку «Create a page» и заполняем.
Page title: Каталог
Path: catalog
Жмем кнопку «Continue & edit»
Делаем необходимый Format. Например «Table».
В разделе Filter criteria жмем «add».
Выбираем «Taxonomy term: Parent term» и жмем «Apply», затем сного «Apply». Тем самым мы сделали чтобы выводились только родительские категории.
Сохраняем вьюху.

Этими действиями мы создали страницу по адресу site/catalog на которой будут отображаться только родительские термины.

Вывод дочерних категорий

Создаем новое представление:

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

Создаем очередное представление:

Данное представление будет выводить весь товар, у которого выбрана данная категория. Соответственно вы можете выводить какие угодно типы материалов.

Настройка Panels

Теперь настроим отображение всего и вся. Для начала переходим на страницу стандартных панелей: admin/structure/pages. Нам нужно включить term_view.

Затем жмем «Edit» и добавляем новый вариант: «Add a new variant»:

Title: Каталог.
Variant type: Panel.
Optional features: ставим галочку Selection rules.
Жмем Create variant.

Перед нами открывается следующий этап настройки. В нем указывается то, когда сработает данный вариант. Нам надо чтобы он срабатывал на термины из словаря «Категории каталога». Для этого:

Из списка выбираем Taxonomy: vocabulary и жмем Add.
В pop-up окне выбираем наш словарь и жмем Save.
Затем жмем кнопку Continue.

Шаг разметки пропускаем, поэтому жмем Continue. Следующий шаг пропускаем, ибо он нам не нужен. В итоге мы окажемся на этапе Panel content.

Здесь нам надо указать что и где будет отображаться. Для начала сделаем чтобы заголовок страницы был как и у категории, для этого в поле title пишем %term:name.

Теперь все просто, жмем на шестеренку слева от региона center и выбираем Add content. Слева выбираем категорию Views и добавляем «Дочерние категории». Тоже самое проделайте и с представлением «Товар». Все шаги и настройки после выбора представления просто игнорируйте, они нам не нужны.

После того как вы это сделали получится примерно следующее.

Завершающим действием будет нажатие кнопки Create variant.

На этом все. Теперь перейдя по адресу site/catalog вы увидите категории. Перейдя в категорию, вы увидите товар а также подкатегории.

Заключение

Гибкость благодаря Views & Panels.
Используются системные алиасы.
Нет фильтра php.
Cтраницы taxonomy/term/ID из словаря «Категории каталога» будут более информативными.

Самый главный - невозможность задания алиасов для адресов. Т.е. Разделы каталога имеют жесткий адрес catalog/%TID.
Необходимость включения фильтра PHP. Я стараюсь избегать включения данного модуля, ведь если сайтом будут управлять криворукие - то этот фильтр просто яма в безопасности.
Плодятся типы материалов (для фильтров). Не пробовал, точно о проблеме сказать не могу. Мне хватило первых двух чтобы отказаться от него.

P.s. То что замазано на скринах - настройки по умолчанию (не менялись).

Подготовка

Не удивительно, но для создания каталога понадобится Views , Panels и конечно же Ctools . Включаем:

Chaos tools
Page manager
Views content panes
Panels
Views & Views UI

Создание представлений (Views)

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

Тут проще простого.

Жмем «Add new view»
Указываем название «Каталог»
Show: Taxonomy terms of type «Категории каталога»
Ставим галочку «Create a page» и заполняем.
Page title: Каталог
Path: catalog
Жмем кнопку «Continue & edit»
Делаем необходимый Format. Например «Table».
В разделе Filter criteria жмем «add».
Выбираем «Taxonomy term: Parent term» и жмем «Apply», затем сного «Apply». Тем самым мы сделали чтобы выводились только родительские категории.
Сохраняем вьюху.

04.07.2012

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

Выглядят они довольно эффектно. В принципе для небольшого сайта необходимость в них отпадает, а вот если ваш ресурс разросся и вам просто не хватаем места на странице для размещения информации, то вам такие панели будут в самый раз. Строятся такие панели на JS и Jquery, плюс CSS (куда же без него). Сейчас я вам пошагово попытаюсь объяснить как такую панель разместить у себя на сайте под Drupal 7 и для удобства выведем этот блок в качестве региона, что бы мы не залазили каждый раз в код, а просто размещали в данной панели именно тот блок, который нам необходим. Итак приступим:

1.Для начала нам нужен сам скрипт этой панели (написать можно и самому), но я возьму уже готовый, что бы зря не тратить время да и к тому же он мне тоже нравится. Скачать мой вариант панели из статьи можно . (Это не мой скрипт, я лишь почистил его от мусора).

2.Распаковываем и смотрим, что внутри у нас находится папка с изображениями, стили, и индексный файл. Откроем файл «index.html» и видим, что к ней у нас подключаются следующие элементы:

Стили – файл style.css
Библиотека Jquery – с url откуда подкачать файл библиотеки
И перед закрывающим тегом head - вставлен выполняющий скрипт.

Пример подключения я проведу в drupe 7 на шаблоне «Crisp».

3.Первоначально создадим дополнительный регион в шаблоне «Crisp» (про установку данного шаблона я писал ). Для этого идём в файл

crisp. info

и пишем новый регион:

regions[ newRegionDrupalfly] = drupalfly

page. tpl. php

и пишем код вывода данного региона. Замечу, что блок я возьму из разметки индексного файла в скрипте нашей панели, а именно создам блок с классом «panel» в любом месте контента страницы (так как блок абсолютно позиционирован).

print render($page [ "newRegionDrupalfly" ] ) ;

5. Проверим появился ли у нас новый регион в админке сайта, а именно в структура->блоки

Если вы всё сделали правильно, то регион должен у вас появиться. (Замечу, что после изменений в шаблоне Drupal – шаблон нужно пересохранить, что бы подцепились новые элементы).

6. Далее нам необходимо применить стили, а именно подцепить стилевый таблицы нашего скрипта к нашей странице. Есть два варианта, либо дописать существующий файл шаблона style.css, либо подключить отдельный файл. Я выбираю второй вариант, поэтому – переименую файл скрипта из style.css в panel.css и скопирую его в папку со стилями в нашем шаблоне.

Теперь пропишем в файле

crisp. info

подключение к странице нашего нового стиля:

stylesheets[ all] = css/ panel. css

А так же скопирую все изображения из папки «images» нашего скрипта в папку «images» - нашего шаблона. Думаю с этим вы без труда справитесь. Не забудьте только переписать url с картинками в стилях.

7.Теперь нам необходимо подключить скрипты, это библиотека Jquery и выполняющий скрипт. Данный скрипт работает только с библиотекой 1.3.2 –поэтому я подключать буду её. (Хотя в Drupal JQuery библиотека идёт из коробки, но в любом случае в Drupal 7 присутствует новая версия библиотеки). Поэтому открываем файл «html.tpl» (структура этого шаблона не совсем обычная, контент страницы и head разнесены в разные файлы. Но в этом нет ничего страшного.) И вписываем туда подключение нашей старой библиотеки и выполняющего скрипта, а именно копируем это всё из файла index.html.

Замечу, что по правилам API Drupal все скрипты нужно выносить в отдельный файл и подключать через файл

Название_темы. info

подробнее об этом можно почитать вот Теперь пересохраняем весь наш шаблон. Идём в пункт Cтруктура->Блоки. Создадим новый блок, внутри блока может быть всё что угодно, в моём случае это просто текст и поместим его в регион «drupalfly»

Сохраняем и переходим на сайт и видими язычок нашего региона.

При клике по которому у нас открывается содержимое нашего нового блока.

На этом всё. Надеюсь это кому ни-будь пригодиться.

Что умеют Панели

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

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

После установки модуль появится в одноименном разделе админки. Панели – это составной модуль и состоит из нескольких (показаны на следующем изображении).

Части расширения взаимосвязаны, поэтому активируйте их все. После этого в разделе «Структура» у вас должны появиться новые элементы.

Создаем mini

Перейдем в административной панели Drupal 7 в пункт «Panels». Здесь выбираем тип блока «Mini-panel» и создаем ее. Заполняем поля: заголовок, описание, категорию.

Теперь добавляем контекст. Затем задаем нужный нам шаблон.

В отобразившемся шаблоне нужно заполнить каждый блок. Для примера я наполню только одну часть панели. Нажмите на значок настроек и в списке выберите «Добавить материал».