Вертикальное меню в 1С-Битрикс

 

На прошлом этапе, мы определились какие компоненты у нас будут отвечать за ту или иную область шаблона. В данном посте мы рассмотрим как реализовать «вертикальное меню «категории«.

 

 

Вертикальное меню «категории»

 

Как я указал на этапе «подбор компонентов для шаблона«, за меню у нас будет отвечать компонент «bitrix:menu».

 

Производим аналогичные действия как и для горизонтального меню

  1. Копируем подходящий нам шаблон компонента в папку с нашими шаблонами (www\bitrix\templates\имя_шаблона\components\bitrix\menu). Я выбрал в качестве шаблона донора — vertical_multilevel. Переименуем его в «my_vertical_multilevel».
  2. Находим html кусок кода, отвечающий за вывод горизонтального меню:

     
  3. Заменяем его на вызов компонента «bitrix:menu» с нашим шаблоном «my_vertical_multilevel»

     
  4. Отделяем картинки и стили меню от шаблона сайта (как это сделать, я рассказал для горизонтального меню  — ссылка, пункт 1 и 2)
  5. Правим шаблон компонента  (www\bitrix\templates\имя_шаблона\components\bitrix\menu\my_vertical_multilevel\template.php).Урезав все лишнее и добавив HTML код меню шаблона прототипа у меня получился следующий пользовательский шаблон:

     

Посмотрим результат в браузере:

 

templeate_menu_left_small

 

Вертикальное меню (в красном квадрате) выглядит как в шаблоне прототипе, значит шаблон компонента мы отредактировали правильно. Сейчас важно разобраться с содержимым меню, на данный момент оно выводит тоже что и горизонтальное меню («Главная», «Профиль», «Контент», «Магазин», «Общение», «Типовые примеры».

Компонент «bitrix:menu» формирует содержимое меню довольно просто, он считывает специальный php файл содержащий  массив, в котором располагается URL ссылка и название для каждого пункта меню. Файл располагается в корневой директории Битрикс (www), но он также может быть разделах сайта, т.е. в поддиректориях www.

Компонент «bitrix:menu» ищет данный файл сперва в разделе, на котором вы находитесь, если файл отсутствует, то поиск продолжается в разделе выше и т.д.,  вплоть до корневой директории (www). Для каждого «меню» (их может быть несколько, например горизонтальное и вертикальное) мы можем указать какой файл считывать, определяется это в параметрах метода вызова компонента.

 

Рассмотрим используемый нами — код вызова компонента «bitrix:menu»:

 

Параметр ROOT_MENU_TYPE указывает к какому типу отнести данное меню, от типа зависит какой файл будет считываться для формирования пунктов меню.

Если указанно top, то данный компонент считывает файл .top.menu.php,

если left, то .left.menu.php ,

вообщем, если тип, то .тип.menu.php.

 

Сейчас хочу сделать важное замечание, что помимо файла «.тип.menu.php» в формирование меню может участвовать (если «USE_EXT» => «Y» ) еще один файл — «.тип.menu_ext.php». Разница заключается в том,  что «.тип.menu.php» содержит массив с названиями и ссылками адресованным к разделам сайта (поддиректориям www), а в «тип.menu_ext.php» находится вызов компонента «bitrix:eshop.menu.sections» или «bitrix:menu.sections»  с нужными нам параметрами. Данные компоненты возвращает массив с URL ссылками и именами разделов/подразделов инфоблока. Получается что «.тип.menu.php» отвечает за формирование пунктов меню относящиеся к разделам сайта, а «тип.menu_ext.php» относящиеся к разделам инфоблоков.

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

Типы меню заданы и находиться в настройках модуля «Управление структурой», посмотреть их, вы можете в панели администратора, жмем  «Настройки» и далее раскрываем «Настройки продукта» -> «Настройки модулей» -> «Управление структурой».

 

panel_admin_type_menu_small

 

Т.к. в коде вызова компонента, тип меню указан — «top» как для горизонтального так и для вертикального меню, то и выводит он (вертикальное меню) абсолютно тоже самое, ведь задействован один тип файлов .top.menu.php.

 

Укажем значение параметра ROOT_MENU_TYPE  как left. Верстка шаблона требует от нас, что-бы меню «Categories» присутствовало на любой страницы сайта:

 

templeate_left_menu

 

 

Причем в меню должен выводиться список категорий продуктов, а как мы уже решили выше, каждая категория это раздел сайта и это значит, что в любом месте сайта, данный компонент должен использовать «.left.menu.php» директории «www\e-store».

Ведь подпапки «www\e-store» мы и будем считать категориями продуктов.

Реализуется это просто, удаляем во всех разделах кроме «www\e-store» файл «.left.menu.php». Открываем «.left.menu.php» в корневой директории www, удаляем его содержимое и пишем следующий код:

 

 

Таким образом, мы подключаем файл e-store/.left.menu.php в «заглавном» .left.menu.php. Теперь на любой страницы сайта отображается  меню с подразделами e-store или категориями товаров.




Буду признателен если вы поделитесь данным постом


Ваш комментарий


Ответ в цифрах

 
© s-engineer.ru, 2012-2017 | Все права защищены