Алфавитный список категорий (Glossary) в Drupal 7

При разработке одного из проектов стал вопрос о создании удобной навигации по категориям, которых оказалось ну очень много. Было принято решение остановится на так называемой словарной навигации (Glossary), чтобы было понятно о чем идет речь скрин ниже:

На CMS Drupal такое решение делается даже на дефолтном функционале с помощью Views.

Инструкция как сделать алфавитный указатель категорий

Создаем новое представление и называем его например "Glossary", в моем случае это страница, но можно и как блок.
Выбираем нужный тип материала для показа (в моем случае это были термины таксономии)
В формате отображения выбираем "не форматируемый список" "из поля"
Добавьте поле заголовка ( в моем случае имя термина таксономии) и поставьте галочку "Сделать это поле ссылкой"
Добавьте еще одно точно такое поле, только теперь поставьте галочку "Исключить из вывода ", а также в Rewrite result галочку "Установить для этого поля максимальную длину" и впункте "Еще" назовите это поле как-то по другому чтобы их не путать.
Далее идем в настройки "Не форматированного списка" и выбираем наше исключенное из вывода поле в "Grouping field Nr.1" и ставим галочку " Use rendered output to group rows"

Сохраням нашу Views и добавляем в стили шаблона следующий CSS (не забудьте переименовать класс если назвали Views не glossary

.view-glossary .view-content {

  /* Multi-column */

  -webkit-column-count:auto; /* Chrome, Safari, Opera */
  -moz-column-count:auto; /* Firefox */
  column-count:auto;

  -moz-column-width:220px; /* Firefox */
  -webkit-column-width:220px; /* Safari and Chrome */
  column-width:220px;

  -webkit-column-gap:40px; /* Chrome, Safari, Opera */
  -moz-column-gap:40px; /* Firefox */
  column-gap:40px;

  -webkit-column-rule:2px outset #e1e2e4; /* Chrome, Safari, Opera */
  -moz-column-rule:2px outset #e1e2e4; /* Firefox */
  column-rule:2px outset #e1e2e4;
}