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

Создание сворачивающегося блока в Drupal средствами jQuery

Слишком много текста на странице? Или нужно скрыть некоторые элементы интерфейса до тех пор пока они не понадобится пользователю?
Не нужно подключать дополнительный JavaScript, в Drupal сворачивающиеся блоки доступны из "коробки".

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

  1. Подключить collapse.js файл на страницу где планируется разместить сворачивающийся (collapsed) блок. Самый простой способ сделать это - использовать функцию drupal_add_js()
    Подключить этот файл можно в любом месте (кроме page.tpl.php), например в template.php в функции yourthemename_preprocess_page(&$variables) если нужно чтобы collapse.js добавлялся на каждую страницу или отдельно в нужном блоке, тогда этот файл будет добавлять только на страницы где присутствует данный блок.
    В template.phpвызов может быть примерно следующим:
    function yourthemename_preprocess_page(&$variables){ drupal_add_js('misc/collapse.js'); }
  2. Добавить, собственно, HTML код в котором будет размещаться наш блок. Drupal для этих целей использует тег
    и с обязательным указанием класса .collapsible для
    .
    Свернуть

    Содержимое сворачивающегося блока.

    Пример:
    Свернуть

    Содержимое сворачивающегося блока.


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

    еще один класс .collapsed и теперь блок будет появляться свернутым.

    Пример:

Таким образом можно сворачивать часть контента, форму авторизации в блоке (как у меня на сайте в левой колонке), форму поиска или что либо еще.

Комментарии

А чем хуже модуль (фильтр): collapse_text ?

Фильтр подразумевает что будет работать только в выводе контента ноды.Описанный выше механизм можно использовать для любой части сайта, например для сворачивания блоков в сайдбаре сайта, + тут в ctools collabsible есть поддержка cookies, то есть состояние блока может запоминаться.