CMS Bitrix Site Manager - интеграция (шаблон, структура, навигация) 6

CMS » Други CMS

bitrix   трудност:    видян: 10020

 Построяване и показване на меню

В общия случай задачата за формиране на менюто включва:

• въвеждане на HTML елементи за построяване на меню;
• създаване на шаблон за менюто (създаване на шаблон за компонента Меню);
• включване на функции за показване на меню (извикване на компонента Меню) в общия шаблон на ("пролога" и "епилога");
• запълване на менюто в съответствие със структурата на сайта.

Структура на менюто

Всяко меню на сайта се построява въз основа на две съставляващи:

• масив от данни, определящ състава на менюто, дава имена и линкове за всички позиции на менюто. Управлението на масива данни става чрез административния интерфейс;
• шаблон на външното представяне на менюто. Шаблона за менюто – е PHP код, определящ външния вид на менюто (шаблона на компонента Меню). Шаблона на менюто обработва масива от данни, и извежда в резултат HTML-код.

Масив от данни за менюто

Данните за всеки тип меню се съхраняват в отделен файл, чието име има следния формат: .<тип меню>.menu.php. Например, за съхраняване на данни за меню от типа left ще се ползва файл .left.menu.php, а за съхраняване на данни за меню от типа top - файл .top.menu.php.

Файловете за менюто се поставят в папките на тези раздели на сайта, където е нужно показването на съответните типове меню. Ако за даден раздел не е създаден съответния файл за меню, системата прави търсене на файла в каталога с по-горно ниво.

Например, тъй като основното меню (в демо-версията на продукта, това меню е от типа top) трябва да се показва във всички раздели, то файла с това меню се поставя само в корневия каталог на сайта:

Съответно менюто от второ ниво (в демо-версията на продукта, това е меню left) се показва отделно за всеки раздел на сайта. Затова в папката на всеки раздела се създава свой файл за дадения тип меню:

Системата «Bitrix Site Manager» позволява да се създават и менюта от динамичен тип. Т.е. масива от данни за такива менюта се генерира автоматично въз основа на някои данни, получавани с помощта на програмен код. Този код трябва да се съхрани в папката на съответния раздел на сайта във файл с име .<тип меню>.menu_ext.php.

Пример за такова меню може да служи лявото меню на раздела Каталог книги, представено в демо-версията на продукта. Тук първите две позиции от менюто Автори и Рецензии са създадени по обичайния начин, а останалите (Бизнес-литература, Детска литература и т.н.) се формират динамично.

В този случай в качеството на позиции на менюто се ползват названията на групи от каталога Книги, създадено въз основа на информационни блокове. Програмния код, на основата на който се генерира менюто се съхранява във файла .left.menu_ext.php в папка /e-store/books/.

Шаблон за външно представяне на меню

Отделяна на HTML елементи за построяване на меню

Създаването на шаблон за менюто започва с отделянето на необходимите HTML области в шаблона на сайта:

• неизменна горна и долна част на шаблона;
• повтарящи се елементи. Например, за хоризонтално меню – това са клетки от таблици, а за вертикалното – редове.

Създаване на шаблон за меню

Всички шаблони в менюто имат еднаква структура:

• област на пролога на шаблона за меню;
• област с описание на замяна за различни условия за обработка на шаблона;
• област на тяло на шаблона за меню;
• област на епилога на шаблона за меню.

Да разгледаме построяване на шаблон за меню чрез пример за Лявото меню, представено в демо-версията на продукта (шаблон .default на компонента Меню bitrix:menu):

<?if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();?>
   <?if (!empty($arResult)):?>
      <ul class="left-menu"> 
      <?foreach($arResult as $arItem):?>
          <?if($arItem["SELECTED"]):?>
               <li><a href="<?=$arItem["LINK"]?>" class="selected">
               <?=$arItem["TEXT"]?></a></li>
          <?else:?>
               <li><a href="<?=$arItem["LINK"]?>">
               <?=$arItem["TEXT"]?></a></li>
          <?endif?>
      <?endforeach?>
      </ul>
   <?endif?>
 

Повтарящата се част на менюто, отделена на предишната стъпка, се включва в тялото на шаблона на менюто.

При създаване на шаблона за менюто ще е нужно и да се създадат допълнителни стилове в каскадните стилове (CSS). Например, за текстово меню: цвят на позицията на менюто и цвят на текущата (активната) позиция в менюто.

Отделно представяне в шаблона могат да изискват заглавия на раздели (например, названието на текущия раздел при преглед на подразделите). Също така може да се предвиди използване на графични или текстови обозначения, например, за това, че дадената позиция се позовава на подраздели или на документ от текущия раздел и т.н.

Бърз достъп до редактиране на шаблона за всеки тип меню може да се направи в режим Разработка с помощта на позиция Редактирай шаблона на компонента меню на команди бутон за управление на компонента.

Организация на показване на менюто

Показването на менюто на страниците на сайта става с помощта на компонента  Меню (bitrix:menu). Например, извикването на горното меню на демо-сайта има следния вид:

<?$APPLICATION->IncludeComponent(
    "bitrix:menu",
    "horizontal_multilevel",
    Array(
         "ROOT_MENU_TYPE" => "top", 
         "MAX_LEVEL" => "3", 
         "CHILD_MENU_TYPE" => "left", 
         "USE_EXT" => "Y" 
     )
);?> 

Този код се поставя в предвидената за показване на менюто област в шаблона на сайта.

Построяване на меню на сайта

Построяването на меню за показване става по следния начин:

• в общия шаблон за показване се включва извикване на показване на менюто на екран;
• при зареждане компонента проверява за наличие в текущия раздел на сайта за файл, съдържащ масив от значения за меню;
• след това компонента извиква шаблона за построяване за дадения тип меню и зарежда HTML за менюто на екрана.