Как добавить меню под стандартное меню Магазина

Добавляем меню

Переходим на главную страницу магазине, наводим курсор мыши на стандартное меню и нажимаем правую клавишу мыши, в появившемся окне выбираем "Исследовать элемент", Рис. 2.

В открывшемся окне смотрим селектор, чтобы при его наведении было выделено всё меню или любой другой блок, после которого меню должно появляться. Выбираем класс контейнера такой, чтобы он больше нигде не повторялся, т.е. нужно максимально индивидуальный (Рис. 3), в примере это .ins-tile--header

.ins-tile--header

Берем скрипт

<!-- скрипт мультилевел меню -->  
<script>
document.addEventListener("DOMContentLoaded", function() {
   try {
      const announcementBar =
document.querySelector('.ins-tile--announcement-bar');
      announcementBar.insertAdjacentHTML('afterend', '<div id="kinvasoft-menu-static-container"></div>');
   } catch (e) { console.debug(e); };
});
</script>

Находим в нем .ins-tile--announcement-bar и заменяем его на выбранный нами селектор .ins-tile--header

Получается скрипт

<!-- скрипт мультилевел меню -->  
<script>
document.addEventListener("DOMContentLoaded", function() {
   try {
      const announcementBar =
document.querySelector('.ins-tile--header');
      announcementBar.insertAdjacentHTML('afterend', '<div id="kinvasoft-menu-static-container"></div>');
   } catch (e) { console.debug(e); };
});
</script>

Переходим на страницу настроек меню в блок "Параметры совместимости" (Рис.4.), в строке "Container" прописываем #kinvasoft-menu-static-container

#kinvasoft-menu-static-container

Переходим на страницу Сайт в блок "Настройки SEO", нажимаем "Изменить" и добавляем в поле скрипт, Рис. 5

Нажимаем кнопку "Сохранить". Переходим на главною страницу для проверки. Переходим на страницу витрины и тоже проверяем наличие меню на странице.

Показываем строку поиска

Меню загружается стабильно и работает отлично, но при нажатии на кнопку Поиск, строка поиска скрыта под меню. Рис. 8.

Настроим видимость строки поиска. Рис. 8.

Для настройки переходим на страницу Сайт в блок "Настройки SEO", нажимаем "Изменить" и добавляем в поле скрипт

<style>
/*For Multi-level menu, See Search 70px*/
.ins-tile--header.ins-tile--left-logo-burger .ins-header__sidebar--search, .ins-tile--header.ins-tile--left-logo-compact .ins-header__sidebar--search, .ins-tile--header.ins-tile--left-logo-detailed .ins-header__sidebar--search, .ins-tile--header.ins-tile--left-logo-search .ins-header__sidebar--search, .ins-tile--header.ins-tile--left-logo-text .ins-header__sidebar--search, .ins-tile--header.ins-tile--center-logo-burger .ins-header__sidebar--search, .ins-tile--header.ins-tile--center-logo-compact .ins-header__sidebar--search, .ins-tile--header.ins-tile--center-logo-detailed .ins-header__sidebar--search {
    margin-top: 70px;
}
</style>

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

Если вам нужно, чтобы строка поиска отображалась ниже, то вам вместо 70px нужно написать свою цифру, например 120px

Настраиваем ширину меню

Если вам нужно на странице витрины, чтобы меню было на всю ширину, то переходим к настройке Menu bar > Layout > Menu Width (Рис. 6), выбираем настройку Maximum, нажимаем кнопку сохранить

Если у вас есть вопросы или предложения пишите нам в поддержку, мы всегда рады помочь.