Видеоурок

Разработка эффективного, то есть заметного, красивого, понятного и логичного меню - важнейшая задача контент-менеджера.

"1С-Битрикс: Управление сайтом" позволяет быстро создавать и редактировать различные варианты меню. В видеоролике демонстрируются общие принципы работы с меню.

  Виды меню

Как вы уже знаете, в "1С-Битрикс: Управление сайтом" информация делится на два вида - статическую Статическая информация - это информация, которая редко меняется с течением времени. Например, рекламные тексты, история компании, контактная информация. Статическая информация создается и редактируется вручную. Подробнее... и динамическую Динамическая информация - информация, хранимая в Базе Данных сайта и выводимая специальными компонентами системы. Как правило, это - часто изменяемая информация со множеством свойств. Подробнее... . Статическая вводится непосредственно на странице сайта, меняется редко и вручную. Динамическая размещается с помощью программного кода, меняется автоматически в зависимости от изменений в источнике данных - инфоблоке. Кроме того, эти два типа информации отличаются Изучите общее и отличия для двух типов информации. Понимание разницы между ними позволяет быстрее и оптимальнее решать задачи по наполнению сайта. Общее у обоих типов то, что редактирование в обоих случаях происходит одинаково: в Визуальном редакторе. А вот различий намного больше...

Подробнее ... способами хранения, вывода и обработки.

Таким же образом и меню может быть статическим, динамическим или смешанным, т.е. содержать как динамические, так и статические пункты.

Какое меню вы будете создавать, зависит от ваших целей, того, что вы хотите в нём видеть.

Если вы хотите получить меню, из которого можно переходить в разделы или на страницы сайта - делайте статическое. Добавьте в меню названия разделов и страниц, пропишите ссылки на соответствующие файлы и папки из физической структуры Физическая структура - это порядок размещения
физических файлов в папках сайта на сервере.
В том числе файлов с программным кодом.
Мы рекомендуем работать с физической структурой с большой осторожностью.
Вы можете повредить системные файлы и всё сломается:).
сайта - и всё. Это очень просто и является несомненным плюсом статического меню.

Например, вы решили, что для главного меню хватит пунктов Новости, Как купить, Доставка, О магазине, Гарантия, Контакты:

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

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

Если же вам нужно меню, которое будет автоматически меняться при изменении и добавлении информации в каталог товаров, услуг, статей, мероприятий - используйте динамическое. Клик по пункту меню будет переводить пользователя на раздел или элемент каталога. При этом, если раздел содержит несколько элементов, то вам не нужно создавать для каждого из них физическую страницу и хранить их в виде файлов. Страница будет сформирована программным кодом в момент обращения к ней. И значит, будет содержать актуальную информацию, а вам не придется следить за этим или вообще что-то менять в публичной части.

Например, на рисунке ниже не нужно будет создавать отдельный пункт в меню и страницу для каждого товара, когда в ассортименте магазина появится домашняя одежда:

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

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

  Типы меню

В разных шаблонах сайтов Шаблон дизайна — это внешний вид сайта, в котором определяется расположение различных элементов на сайте, художественный стиль и способ отображения страниц.

Подробнее... могут быть разные предустановленные типы меню.

Например, в текущем шаблоне интернет-магазина по умолчанию существует три типа меню: левое (основное) – тип left, верхнее – тип top и нижнее – тип bottom.

А для поклонников оригинальности и креативности в системе не ограничивается число типов меню. Вы можете создать свой собственный тип меню в административном разделе на странице настроек модуля Управление структурой (Настройки > Настройки продукта > Настройки модулей > Управление структурой).

Вы можете задать типы меню отдельно для каждого сайта с помощью опции Использовать индивидуальные настройки для каждого сайта.

Тип меню, заданный в настройках модуля Управления структурой, будет использован в названии файла с шаблоном меню Шаблон компонента - программный код, преобразующий данные, подготовленные компонентом, непосредственно в HTML-код. Подробнее... (например, top.menu_template.php), а также для определения файлов с пунктами меню (например, .top.menu.php). Кроме того, имя типа меню используется для подключения меню в шаблоне сайта.

  Компоненты и файлы меню

Для вывода меню используется компонент Меню Компонент выводит меню указанного типа. Компонент является стандартным и входит в дистрибутив модуля.

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

Для динамического чаще всего используется Пункты меню Компонент осуществляет дополнение созданного меню названиями разделов инфоблоков. Компонент является стандартным и входит в дистрибутив модуля.

Описание компонента «Пункты меню» в пользовательской документации. . Но, вообще говоря, для динамического меню можно использовать и некоторые другие компоненты, работающие с инфоблоками, например, Каталог Комплексный компонент осуществляет вывод полного каталога товаров из определенного инфоблока.

Описание компонента «Каталог (комплексный компонент)» в пользовательской документации. , Новости Комплексный компонент позволяет создать новостной раздел на сайте. Доступен просмотр детальной информации, списка элементов, настройка экспорта в rss, организация голосования за новости (или другие элементы инфоблоков), настройка отзывов, вывода материалов по темам, настройки ЧПУ и многое другое.

Описание компонента «Новости (комплексный компонент)» в пользовательской документации. и др.

В административном разделе каждому меню соответствует свой файл. Он должен быть размещен в папке раздела. Для статического меню он имеет название .тип_меню.menu.php. (однако в Менеджере файлов имя файла данных автоматически представляется в виде ссылки Меню типа "тип_меню"), а для динамического - .тип_меню.menu_ext.php.

Посмотрите видеоролик, где подробно показана разница между статическим и динамическим меню на нашем демо-сайте:

  Наследование меню

Важно понять и запомнить: меню в системе является наследуемым.

Что это означает на практике?

Принцип такой - основное меню с главной страницы транслируется на все разделы, подразделы и страницы сайта с этим шаблоном дизайна. Меню раздела, в свою очередь, транслируется на подразделы и страницы.

Если в разделе, в котором не создано собственное меню, вы воспользуетесь командой "Редактировать пункты меню", то фактически перейдете к редактированию вышестоящего меню.

1. /ru/company/vakansii/
2. /ru/company/
3. /ru/
4. /

Если в одном из каталогов будет найден файл меню, то поиск останавливается и в последующих каталогах уже не ищется.

Если в каком-либо разделе создано своё меню, то оно заменяет основное. Это работает, даже если файл меню пустой. В таком случае в разделе не будет отображаться никакое меню.

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

Задача: создать страницу в разделе сайта Доставка /about/delivery/ и добавить её в нижнее меню О магазине. Нижнее меню на сайте нашего магазина, к которому требуется добавить новый пункт, наследуется всеми страницами сайта (файл меню находится в корне сайта) и выглядит так: Переходим в раздел Доставка и создаём страницу Самовывоз. Если мы оставим включенной опцию Добавить пункт меню , то на втором шаге мастера создания страницы в разделе Доставка создастся своё собственное меню (если его не было ранее). И в файловой структуре мы увидим, что появился файл Меню типа «bottom» . В результате находясь на сайте в разделе Доставка мы увидим нижнее меню всего с одним пунктом - Самовывоз: Примечание: обратите внимание, что новое пустое меню будет видно только в разделе Доставка. В других разделах отобразится основное меню по правилам наследования. Если это не так, рекомендуем отключить кеш в настройках компонента меню Материал о работе с компонентами Вы ещё не изучали. Если такая настройка покажется Вам сложной, можете вернуться к ней позже. Подробнее в уроке Как настроить компонент . Чтобы избежать такой ситуации, при создании страницы отключайте опцию Добавить пункт меню, если Вам не требуется создание собственного меню в разделе. Если же уже случилась описанная выше ситуация, то вновь созданное меню легко удалить. Для этого воспользуйтесь соответствующей кнопкой на панели находясь в разделе (например, Доставка): Меню будет удалено и в разделе вновь отобразится основное меню по правилам наследования. В него и добавим нашу страницу перейдя в режим правки и нажав "Редактировать пункты меню":

Статическое меню заменяет статическое, а динамическое (основанное на инфоблоке) может быть заменено только динамическим.

Есть еще вариант применять для каждого раздела свой шаблон дизайна или прописать эту смену в шаблоне сайта, но для контент-менеджера это нетривиальная задача, поэтому лучше оставить её php-программистам. Для разработчиков наиболее подробная информация о меню дается в курсе Разработчик Bitrix Framework.

Мы же будем справляться с большинством задач методами, которые доступны контент-менеджеру.

В следующих уроках мы изменим основное меню и создадим собственные меню разделов - статическое и динамическое.

  Заключение

• Меню может быть различного вида - статическое, динамическое или смешанное.
• Статическое меню подключает файлы и папки физической структуры сайта, динамическое меню подключает разделы и элементы инфоблока.
• Можно использовать разные типы меню и создавать собственные.
• Меню может выводиться в публичной части разными компонентами.
• Любое меню является иерархически наследуемым.

• Редактирование меню