Как создать страницу в битриксе и привязать к меню
Перейти к содержимому

Как создать страницу в битриксе и привязать к меню

  • автор:

Меню в Битриксе: типы, создание и редактирование пунктов меню

Из чего состоит меню Битрикс, на какие типы делится и как формируется? На эти вопросы не так просто ответить не только новичку, но и опытному специалисту. При формировании и внедрении меню, а также редактировании его пунктов нужно быть особенно внимательным.

Директ Лайн
Крупнейшее региональное интернет-агентство России. ТОП-10 в рейтинге Рунета.
1200+ проектов
90 специалистов
15 лет на рынке

Что такое меню в 1С-Битрикс и почему его называют наследуемым?

Любое меню на сайте формируется на базе двух элементов:

  • Шаблон внешнего отображения меню. Шаблон представляет собой PHP-код, который ответственен за внешний вид. Шаблон обрабатывает массив данных, по итогу формируя HTML-код.
  • Массив данных $aMenuLinks. Определяет содержание меню, задает наименования и ссылки для всех пунктов. Управлять массивом данных можно с помощью административного интерфейса.

Массив $aMenuLinks содержит ряд отдельных файлов, в каждом из которых находятся данные для каждого типа меню. Имя каждого файла имеет формат .menu.php. К примеру, хранение данных типа left предполагает использование файла .left.menu.php, а хранение информации типа top – файл .top .menu.php.

Нет времени разбираться?
Техподдержка сайта на «1С-Битрикс» под ключ

Специализируемся на «1С-Битрикс» более 10 лет и знаем все подводные камни и специфику. Работаем с сайтами любой технической сложности и бизнес-логики. При необходимости подключаем UX-специалиста и дизайнера. В течение 2 часов реагируем на обращения в тикетной системе.

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

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

Еще один пример. Пользователь посетил раздел /ru/company/about/ . Чтобы показывалось меню типа left, система выполняет поиск файла меню в следующей последовательности:

1. /ru/company/about/.left.menu.php

2. /ru/company/.left.menu.php

3. /ru/.left.menu.php

4. /.left.menu.php

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

Типы меню

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

Типы меню

Типы меню

В общем случае на сайте есть одно «главное» меню, которое соответствует верхней ступени иерархии. Отображается оно во всех разделах сайта. Также в системе используется меню второго уровня. Оно включает ссылки на подразделы и документы настоящего раздела.

Отображение меню

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

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

Каждому разделу присваивается свое меню. Транслируется оно на все страницы раздела. При необходимости в подразделах вы можете создавать собственное меню и применять к нему свой тип.

Привлекли 35.000.000 людей на 185 сайтов
Мы точно знаем, как увеличить онлайн–продажи

Применяем лучшие практики digital–продвижения как из вашей тематики, так и из смежных областей бизнеса. Именно это сделает вас на голову выше конкурентов и принесёт лиды и продажи.

Виды используемых на веб-ресурсе меню задаются из административного раздела на странице настроек модуля Управление структурой. Допустим, в системе применяются два типа меню:

Настройка типов меню

Настройка типов меню

  • Левое меню – тип left;
  • Главное меню – тип top.

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

Статическое меню

В 1С-Bitrix все данные делятся на два типа: статические и динамические. Статическая информация редко меняется с течением времени. Создается и редактируется вручную. Статические данные вводятся непосредственно на странице сайта, а потому меняются редко и вручную.

Динамическая информация хранится в базе данных сайта и выводится специальными компонентами системы. Размещается она с помощью программного кода и редактируется автоматически в зависимости от изменений в источнике данных – информационном блоке. Помимо этого, представленные два типа информации отличаются вариантами хранения, обработки и вывода. Оба вида информации могут быть размещены на одной физической странице. Допускается создание смешанного меню, которое будет содержать как статические, так и динамические пункты.

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

Статическое меню

Статическое меню

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

Динамическое меню

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

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

Динамическое меню

Динамическое меню

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

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

Независимо от того, какой тип меню — статический или динамический, — вы выбрали, корректная его работа во многом зависит от скорости сайта. Чтобы не потерять посетителей и конверсии, убедитесь, что сайт работает достаточно быстро. О том, как это сделать, мы писали в статье «Оптимизация сайта на “Битрикс”».

Формирование меню и внедрение его в шаблон сайта

Отметим еще раз: статические данные в структуре сайта – это папки (они же разделы) и файлы (страницы). Динамическая же информация – это инфоблоки (инструменты, с помощью которых в Базу данных заносится информация).

Следовательно, статическое меню:

  • Имеет доступные для редактирования пункты;
  • Использует папки и файлы из структуры сайта.
  • базируется на инфоблоке;
  • пункты не отображаются при редактировании меню.

Что нужно для создания статического меню с последующим внедрением его в шаблон сайта? Алгоритм работы следующий:

  • Создадим новый раздел, допустим, «Саженцы».
  • В административном разделе в папке /sazhenci создаем пустой файл .left.menu_ext.php, чтобы базовое динамическое меню в создаваемом разделе не показывалось.
  • В разделе «Саженцы» создаем несколько страниц и наполняем их содержимым.
  • Статическое меню создается автоматически, если при формировании страниц будет указана опция «Добавить пункт меню».
  • Вырубаем использование кеша, чтобы компонент меню мог обновляться сразу по изменении данных.

По итогу мы получим статическое меню в разделе «Саженцы».

Создать меню динамического типа можно несколькими способами. Первый вариант самый легкий: нужно добавить к каталогу демо-версии сайта собственные разделы и подразделы. Они автоматически попадут в главное меню.

Второй вариант – настройка меню на свой инфоблок. Алгоритм следующий:

  • Добавление инфоблока с его разделами и подразделами;
  • Формирование нужного раздела в Публичной части;
  • Размещение в визуальном редакторе компонента «Каталог» для взаимодействия с инфоблоками;
  • Указание в параметрах компонента созданного инфоблока как источника данных;
  • В разделе сайта появится инфоблок в виде каталога со своим меню.

Наконец, третий способ. Он предполагает внесение изменений в код. Для этого:

  • В административной части, а именно в папке раздела создаем два файла меню — .left.menu.php и .left.menu_ext.php.
  • В файл динамического меню .left.menu_ext.php вставляем фрагмент кода:
// пример файла .left.menu_ext.php if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die(); global $APPLICATION; $aMenuLinksExt = $APPLICATION->IncludeComponent( "bitrix:menu.sections", "", Array( "ID" => $_REQUEST["ELEMENT_ID"], "IBLOCK_TYPE" => "books", "IBLOCK_ID" => "30", "SECTION_URL" => "/e-store/books/index.php?SECTION_ID=#ID#", "CACHE_TIME" => "3600" ) ); $aMenuLinks = array_merge($aMenuLinks, $aMenuLinksExt);
  • Меняем название типа инфоблока, его ID и адрес сайта на нужные. Для этого выгружаем их из свойств информационного блока.

После этого динамическое меню автоматически отобразится в разделе.

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

  1. В основной шаблон показа попадает вызов отображения меню на экран;
  2. При загрузке компонент исследует наличие файла в текущем разделе сайта, который включает массив значений для меню;
  3. Компонент ищет шаблон построения для выбранного типа меню и высвечивает HTML меню на экран.

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

Создание и редактирование пунктов меню происходит в публичной части сайта. Выглядит это следующим образом:

Создание и редактирование пунктов меню

Создание и редактирование пунктов меню

Изменения будут видны сразу после нажатия кнопки «сохранить». При этом отредактировать пункты можно как в публичной, так и в административной части веб-ресурса.

Редактирование в публичном разделе сайта

Переходим в редактор, что находится в разделе «правки». Наводим курсором на нужное меню и жмем кнопку «редактировать пункты меню».

Редактирование пунктов меню через публичный раздел сайта

Редактирование пунктов меню через публичный раздел сайта

Затем всплывет окно, где вы можете поменять существующие пункты, либо включить новые.

Всплывающее окно для редактирования меню

Всплывающее окно для редактирования меню

Здесь же вы можете открыть окно с редактированием меню в административном разделе.

Редактирование в административном разделе сайта

Обозначьте раздел в структуре сайта, меню которого вы собираетесь изменить. Выберете нужный тип меню. Вот пример главного меню, находящегося в корне сайта и имеющего тип main:

Управление меню в административном разделе Битрикс

Управление меню в административном разделе Битрикс

Нажмите кнопку «редактировать меню». У вас откроется соответствующая форма:

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

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

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

В расширенном режиме, через форму редактирования меню можно прописать дополнительные данные для пункта меню. Например, это условие его показа. Для этого перейдите в расширенный режим управления меню:

Расширенный режим редактирования меню

Расширенный режим редактирования меню

Вы можете выбрать любой удобной вариант редактирования.

Как создать страницу в битриксе и привязать к меню

Роберт Басыров
Сложность урока:
2 уровень — несложные понятия и действия, но не расслабляйтесь.
Недоступно в лицензиях:
Ограничений нет

Описанные ниже примеры можно повторить в Виртуальной лаборатории, выбрав при установке шаблон «Демо-сайт для разработчиков».

Предварительные операции

Для примера мы создадим в структуре сайта новый раздел test_menu, который также добавим в главное меню.

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

В параметрах компонента, для примера, в опции Тип меню для первого уровня укажем Главное меню.

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

Древовидное меню

Древовидное меню – самое распространенное. Оно достаточно простое и вместе с этим информативное. Создается на базе статических и динамических элементов: разделов, страниц и инфоблоков.

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

Одноуровневое древовидное меню

Задача: создать древовидное меню.

  • Создайте дополнительный тип меню: Подменю (podmenu).
  • В параметрах компонента установите следующие параметры:
    • Шаблон компонента — tree (Встроенный шаблон);
    • Тип меню для первого уровня — Главное меню;
    • Тип меню для остальных уровней — Подменю;
    • Уровень вложенности меню — 2.

    Результат. Результатом этой работы будет меню такого вида:

    Файл .podmenu.menu.php будет иметь следующую структуру:

    Многоуровневое древовидное меню

    Шаблоны компонента Меню поддерживают создание многоуровневого меню с глубиной вложения до 4-х уровней. Покажем это на примере. Выполнять работу на данном этапе удобнее в административной части.

    Задача: создать четырехуровневое меню.

    Решение. Решение осуществим на примере уже созданного выше меню с шаблоном tree.

    • Перейдите в административный раздел на страницу Управление структурой ( Структура сайта > Файлы и папки )
    • В созданном ранее разделе /test_menu с помощью команды Добавить папку кнопки Добавить контекстной панели создайте новый каталог со следующими параметрами:
      • Имя папки — test_1;
      • Название раздела — test_1;
      • Тип меню — Подменю;
      • Название пункта — test_1.

      Примечание: Для полноты картины можно создать в папках по дополнительной странице (кроме индексной). При создании их не забывайте добавить их в тип меню – Подменю.

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

      При необходимости добавления новых пунктов или редактирования существующих перейдите в нужный раздел (например, /test_menu ) и на контекстной панели используйте команду Добавить меню кнопки Добавить. В открывшейся форме выберите тип меню равный Подменю, после чего отредактируйте нужные пункты меню.

      Примечание: При удалении страниц и разделов из административной части потребуется последующее редактирование пунктов меню вручную.

      Результат: результатом работы будет созданное древовидное меню в четыре уровня:

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

      Если требуется уровень вложенности более, чем по умолчанию

      В крайне редких случаях требуется реализовать меню с уровнем вложенности более 4. Эта проблема решается до версии 10.5 корректировкой файла стилей соответствующего шаблона компонента, с версии 10.5 — кастомизацией компонента.

        Откройте для редактирования файл css используемого шаблона компонента.

      В конце описания стилей есть несколько групп, в названия которых включено *Items text . В этих стилях нужно добавить строки. Рассмотрим, как это сделать на примере группы стилей /*Items text color & size */ файла css шаблона Горизонтальное многоуровневое выпадающее меню.

      В исходном варианте эта группа имеет следующее содержание:

      #horizontal-multilevel-menu li a, #horizontal-multilevel-menu li:hover li a, #horizontal-multilevel-menu li.jshover li a, #horizontal-multilevel-menu li:hover li:hover li a, #horizontal-multilevel-menu li.jshover li.jshover li a, #horizontal-multilevel-menu li:hover li:hover li:hover li a, #horizontal-multilevel-menu li.jshover li.jshover li.jshover li a, #horizontal-multilevel-menu li:hover li:hover li:hover li:hover li a, #horizontal-multilevel-menu li.jshover li.jshover li.jshover li.jshover li a, #horizontal-multilevel-menu li:hover li:hover li:hover li:hover li:hover li a, #horizontal-multilevel-menu li.jshover li.jshover li.jshover li.jshover li.jshover li a

      Для добавления еще одного уровня необходимо добавить еще две строки:

      #horizontal-multilevel-menu li:hover li:hover li:hover li:hover li:hover li:hover li a, #horizontal-multilevel-menu li.jshover li.jshover li.jshover li.jshover li.jshover li.jshover li a

      Дополнив их соответственно :hover li — в одной строке и .jshover li — в другой строке.

      Теперь вы можете использовать глубину вложений равную 5.

      Выпадающее меню

      Чтобы сделать многоуровневое выпадающее меню нужно использовать шаблон многоуровнего выпадающего меню, вертикального или горизонтального, в зависимости от дизайна проекта. Настройка компонента и основные правила создания этого меню абсолютно аналогичны древовидному меню. Приведем их в обобщенном виде:

      • Необходимо иметь два типа меню. Одно (первичное) будет применено как основное меню в разделе, другое (вторичное) – как источник формирования собственно выпадающего меню.
      • В каждом разделе должно быть обязательно создано вторичное меню с указанием его пунктов.
      • При указании путей до разделов, которые должны быть развернуты в выпадающем меню, необходимо указывать путь до папки подраздела, а не до индексного файла подраздела.
      • Выпадающее меню может быть построено не только на базе статических разделов и страниц, но и на основе инфоблоков.
      • Система допускает только четыре уровня вложения.

      Меню из информационных блоков

      Построение меню из динамических элементов — информационных блоков — позволяет снять с контент-менеджера часть нагрузки по поддержке сайта. Не нужно будет выполнять работы по актуализации меню в связи с появившимися новыми разделами и страницами. Для решения этой задачи необходимо использовать компонент Пункты меню (bitrix:menu.sections).

      Перед созданием такого меню у вас должен быть создан необходимый тип инфоблока и сам инфоблок. Желательно создать пару разделов и элементов для наглядности.

      • Выполните команду Редактировать параметры компонента из меню компонента Меню.
      • В разделе Дополнительные настройки установите флажок в поле Подключать файлы с именами вида .тип_меню.menu_ext.php.
      • Сохраните внесенные изменения.
      • Перейдите в административную часть сайта.
      • Перейдите в раздел, для которого планируется создавать меню с помощью инфоблоков.
      • Создайте пустой файл под именем .podmenu.menu_ext.php в директории, в меню которой должны подключаться пункты инфоблока (например, /test_menu ).

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

      Настройте параметры компонента:

      IncludeComponent(…
      $aMenuLinks = array_merge($aMenuLinks, $aMenuLinksExt);

      Конечный код указанного файла должен быть примерно таким:

      IncludeComponent( "bitrix:menu.sections", "", Array( "ID" => $_REQUEST["ID"], "IBLOCK_TYPE" => "books", "IBLOCK_ID" => "5", "SECTION_URL" => "/catalog/phone/section.php?", "DEPTH_LEVEL" => "1", "CACHE_TYPE" => "A", "CACHE_TIME" => "3600" ) ); $aMenuLinks = array_merge($aMenuLinks, $aMenuLinksExt); ?>

      Результат: Перейдите в публичную часть в раздел, для которого создавался файл .тип_меню.menu_ext.php. Вы увидите Если вы ранее не отключали кеш, то, возможно, нужно сбросить кеш, чтобы меню отобразилось. созданное новое меню:

      Красным цветом выделены пункты, созданные в рамках главного меню (массив $aMenuLinks , возвращающий пункты главного меню), синим цветом – полученные из инфоблоков (массив $aMenuLinksExt ).

      Два меню рядом

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

      • Перейдите к редактированию шаблона сайта.
      • В режиме редактирования кода в левой колонке сайта создайте таблицу с одной строкой и двумя ячейками.
      • Переместите в левую ячейку компонент меню, использовавшийся в качестве верхнего меню, а в правую – компонент меню, использовавшийся в качестве левого меню.
      • Сохраните внесенные изменения.
      • Перейдите в публичную часть сайта.
      • Выполните команду Редактировать параметры компонента из меню компонента меню, стоящего в левой ячейке.
      • Задайте в качестве шаблона шаблон default.
      • В поле Уровень вложенности меню выставьте значение 1.
      • Сохраните внесенные изменения.
      • Создайте пункты в меню типа top (которое в левой ячейке).
      • Выполните команду Редактировать параметры компонента из меню компонента меню, стоящего справа.
      • Настройте его так, как мы настраивали в примере построения меню из инфоблоков.
      • Выполните команду Редактировать пункты меню для компонента меню, стоящего в правой ячейке.
      • Сохраните внесенные изменения.

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

      Графическое меню

      Иногда встает задача создания меню с графическими элементами в качестве его пунктов. Эту задачу можно решить разными способами.

      Самый простой – за счет редактирования файла CSS. Этот способ имеет преимущество в том плане, что текст, используемый в компонентах меню для разных пунктов, будет редактироваться обычным способом. Изображение, выводимое css, будет фоновым. Так как данный способ не относится непосредственно к Bitrix Framework, то он рассмотрен не будет.

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

      Задача: создать меню, где пункты оформляются выводом картинок. Отображение картинок должно быть различным: для активного пункта меню и пассивного пункта меню. Если по каким-то причинам картинки меню не загружены на сайт (либо для пункта меню не заданы параметры), должна отображаться картинка по умолчанию.

      • Создайте по паре картинок на каждый из пунктов меню и картинку для пунктов без параметров или без картинки.
      • Создайте папку /images/menu в рамках структуры сайта.
      • Загрузите в эту папку созданные картинки.

      Примечание: Для одного из пунктов меню картинки не загрузите, чтобы проверить работу кода.

    • Перейдите в административной части сайта в раздел с меню, для которого хотите назначить картинки.
    • Откройте меню для редактирования в Расширенном режиме.
    • В строке Параметры каждого пункта меню в колонке Название введите ACT .
    • В строке Параметры каждого пункта меню в колонке Значение укажите путь до картинки, соответствующей активному состоянию пункта меню, от корня сайта.
    • Примените внесенные изменения. После перезагрузки добавится еще одна строка Параметры.

      Примечание: Увеличить количество доступных сразу дополнительных параметров меню можно в настройках модуля Управление структурой с помощью соответствующей опции.

      Мы задали параметры для системы, по которым она будет определять какую картинку ей выводить. Теперь переходим к редактированию шаблона. Для простоты будем использовать шаблон default.

      • Перейдите в публичную часть сайта.
      • Выполните команду Редактировать параметры компонента из меню компонента Меню.
      • Назначьте для компонента шаблон default.
      • Перейдите к редактированию шаблона компонента, скопируйте его и откройте для редактирования.

      Вам нужно заменить код вызова пункта меню со штатного на обращение к параметрам, заданным для данного меню. Делается это в этом участке кода шаблона:

      Строки различаются между собой только выбором параметра из расширенных настроек: ACT или NOACT .

      Примечание: В коде использован путь /images/menu/default.png для указания картинки, выводимой, если отсутствует картинка для пункта меню или если для него не указаны параметры. Вам нужно использовать собственное имя этой картинки. И другой путь, если вы сохраняете картинки в другой папке.

      При переходе в публичную часть мы увидим такое меню:

      Создание списка

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

      Создавать списки может только администратор портала. В коробочной версии Битрикс24 списки могут находиться в разделе Сервис.

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

      Настройки

      Во вкладке Настройки укажите название списка и его описание.

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

      настройки.png

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

      Подписи

      На закладке Подписи можно задать собственные название элементов и разделов списка. Например, если создается список Отделы, то стоит заменить слово элемент на отдел, а слово раздел — на сотрудники, и т.п.

      подписи.jpg

      Доступ

      Установите права доступа к списку. С помощью кнопки Добавить выберите нужную группу или конкретного пользователя, для которых хотите применить или поменять права.

      доступ.jpg

      • Нет доступа — список даже не будет виден.
      • Чтение — даёт возможность только просматривать список.
      • Просмотр в панели — просмотр элементов списка. (Доступно в Битрикс24 в коробке.)
      • Добавление — можно добавлять элементы в список.
      • Добавление в панели — можно добавлять элементы в список и просматривать их. (Доступно в Битрикс24 в коробке.)
      • Изменение — допускается добавлять элементы и изменять список, а также запускать бизнес-процессы по элементам списка.
      • Изменение с ограничениями — запрещено добавлять и удалять разделы элементов. В остальном все те же действия что и для прав на Изменение.
      • Полный доступ — устанавливается полный уровень прав доступа к списку.
      • Пример работы с универсальным списком
      • Удаление списка

      Как создать страницу в битриксе и привязать к меню

      Нашли ошибку? Выделите мышкой и нажмите Ctrl+Enter

      Создание и редактирование посадочной страницы

      Посадочные страницы в разделе «Обзоры» состоят из следующих элементов:

      • Баннер (1) визуально подкрепляет содержание страницы. На нем расположены заголовок, описание и кнопка перехода к описанию товаров и проектов компании.
      • Блок с тизерами (2) дополняет состав страницы полезной информацией о заказах или клиентском сервисе.

      • Описание (3) в качестве анонса.
      • Детальное описание подборки товаров (4), которое содержит SEO-текст.

      • Фотогалерея (5).
      • Блок «Задать вопрос» для обратной связи с кнопкой перехода на форму (6).

      • Список предлагаемых товаров с техническими характеристиками и ценой (7) .
      • Под блоком с товарами можно добавить другой контент в настройках привязки, например, услуги, акции, сотрудники. Об этом подробно расскажем в следующем уроке.
      • Дополнительное описание под блоком с товарами (8).
      • Блок с возможностью оставлять комментарии для обратной связи (9).

      Изменить посадочную страницу можно двумя способами:

      • через виджет в публичной части;
      • в административном разделе.

      Рассмотрим каждый вариант подробнее.

      Виджет в публичной части

      Перейдите в режим правки. Наведите курсор на область с описанием под баннером. Появится меню с элементами управления страницей: изменить (1) , добавить (2) или удалить (3) посадочную страницу.

      Для изменения посадочной страницы в административной панели необходимо перейти в Контент (1) → Каталог (aspro.allcorp3) (2) → Обзоры (3) .

      Здесь можно добавить новую посадочную страницу (1) . Для изменения (2) , деактивации (3) или удаления (4) существующего лендинга нажмите на «Гамбургер» напротив него.

      Рассмотрим подробно окно редактирования посадочной страницы. На вкладке «Элемент» доступны следующие поля:

      • Активность (1) — включает отображение лендинга.
      • Период активности (2) — задает время показа лендинга.
      • Название (3) — установить название для лендинга.
      • Сортировка (4) — индекс сортировки.
      • URL фильтр (5) — умный фильтр для привязки, подробнее о настройках читайте в следующем уроке.
      • Заголовок H3 перед товарами (6) — задать заголовок над списком предлагаемых товаров.
      • Показывать блок «Задать вопрос» (7) — включить отображения блока обратной связи.
      • Раздел (8) — привязать к странице раздел или часть товаров из раздела с помощью умного фильтра, подробнее о настройках читайте в следующем уроке.

      На вкладке «Анонс» загрузите картинку для анонса (1) и задайте описание к нему (2) . Картинка и описание для анонса будут отображаться в разделе «Обзоры» и на детальных страницах посадок.

      На вкладке «Подробно» настраивается фотогалерея и описание подборки товаров. Здесь можно найти следующие поля:

      • Расположение фото (1) — назначьте расположение детальной картинки, если не используется составной баннер.
      • Галерея (2) — загрузите фотографии в галерею.
      • Файлы (3) — загрузите файлы для посадочной страницы.
      • Детальная картинка (4) — загрузите детальную картинку для лендинга.

      • Детальное описание (5) — задайте подробное описание товаров.

      На вкладке «Видео» вы можете загрузить видео с iFRAME (1) , то есть из других источников, например, YouTube. Также можно добавить видео в качестве файла (2) , настроить для него параметры и подробную информацию.

      На вкладке «Баннер» рассматривается большой рекламный баннер с заголовком, описанием и кнопкой. Здесь доступны следующие поля:

      • Баннер сверху (1) — включает отображение баннера в самой верхней части посадочной страницы. При отключенной настройке баннер не функционирует.
      • С наездом на шапку (2) — баннер наезжает на область шапки. При этом изображение станет более расширенным и будет служить фоном для верхнего меню.
      • Цвет шапки и текста (3) — назначить светлый или темный цвет шапки и текста.
      • Надпись в кнопке (4) — подписать кнопку, расположенную на большом баннере.
      • Текст в баннере (5) — задать описание к заголовку на баннере.
      • Фоновая картинка (6) — загрузить картинку на задний фон для большого баннера.
      • Активная картинка (7) — загрузить картинку на передний план для большого баннера. Совмещается с фоновой картинкой.

      Настройте отображение баннера и сохраните изменения.

      На вкладке «Связи» вы можете привязать другой контент к посадочной странице. Например, услуги, акции, город, статьи, сотрудники и т. д. Для этого нажмите кнопку «Добавить» или на многоточие в необходимой настройке. Сохраните изменения.

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *