Как сделать полную кастомизацию верхней полоски сайта (customHeader)

Разметка верхней полоски задается в GetLayout SELECT 1 в параметре CustomHeader.

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

• {mainLogo} - лого и название сайта 
• {topSidebarToggleButton} - кнопка сворачивания мобильного меню
• {breadcrumb} - хлебные крошки
• {menuHorizontal} - горизонтальное меню
• {fastAddForms} - меню быстрых действий
• {search} - поиск
• {seachMobile} - поиск под мобильный
• {alerts} - иконка меню уведомлений
• {messages} - иконка сообщений
• {divider} - вертикальный разделитель в элементах 
• {balance} - состояние баланса
• {cart} - корзина 
• {lang} - переключение языков
• {user} - меню пользователя

Разметку для CustomHeader указывать лучше не прямо в GetLayout, а генерировать через HTML блок. 

CustomHeader не влияет на левую колонку меню (логотип принадлежит именно левой колонке, а не верхней полоске). Если необходимо его скрыть, то используйте либо CSS либо HideLeftCol (если не нужна вся колонка). 

Есть параметры topMakeup и topMakeupMobile в GetLayout. Они отличаются от CustomHeader тем, что задают только разметку внутри списка иконок после поиска (и позволяют настроить разную верстку для мобильного и настольного вида).

Пример кастомизации панели на демостенде  - https://demo.web-automation.ru/list/watch/kastom-verkhney-paneli-sayta---85

Обновление Апрель 2023. Мы создали отдельный сниппет, который позволит использовать верхнюю полоску как на лендах, так и на стандартных страницах. 

Как он выглядит по умолчанию на ПК версии: 

Примечани: чтобы сделать светлым заголовок надо поменять всего лишь 2 класса с dark на light (navbar-dark и bg-dark).

Как выглядит по умолчанию на мобиальной версии в раскрытом виде: 

В данном случае менять разметку можно практически любую. 

Сам текст html блока (его можно использовать в customHeader): 

<div style="height: 55px;">
  <div class="navbar-container position-fixed bg-dark w-100" style="z-index:2;">
    <nav class="navbar navbar-expand-md navbar-dark">
      <!-- ЛОГО и НАЗВАНИЕ -->
      <a class="navbar-img mr-2" href="/"><i class="fas fa-dove "></i>
      </a>
      <a class="navbar-brand" href="#">Falcon Space</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbar">
        <!-- МЕНЮ СЛЕВА -->
        <ul class="navbar-nav mr-auto">
          <!-- Простые пункты меню -->
          <li class="nav-item">
            <a class="nav-link" href="#lnd-main3">Ссылка 1</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#link-2">Ссылка 2</a>
          </li>
          <!-- Вложенные пункты меню -->
          <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              Dropdown
            </a>
            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
              <a class="dropdown-item" href="#">Action</a>
              <a class="dropdown-item" href="#">Another action</a>
              <div class="dropdown-divider"></div>
              <a class="dropdown-item" href="#">Something else here</a>
            </div>
          </li>
		  <!-- Глобальный поиск -->
          <li class="nav-item">
            <div class="input-group" style="max-width: 150px; position:relative; top: 2px;">
              <select class="form-control  bg-light border-0 small asSearch as-select-search d-none" data-url="/controls/search/search" data-itemid="0">
                <option value="0">Найти...</option>
              </select>
            </div>
          </li>
          <!-- УВЕДОМЛЕНИЯ -->
          <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle " href="#" id="alertsDropdown" role="button" data-toggle="dropdown">
              <i class="fas fa-bell fa-fw"></i>
              <span class="badge badge-danger badge-counter as-notification-count hide">0</span>
            </a>
            <div class="dropdown-list dropdown-menu dropdown-menu-right shadow animated zoomInDown animated--grow-in" aria-labelledby="alertsDropdown">
              <a href="/notifications" class="dropdown-header text-center text-decoration-none">
                Все уведомления
              </a>
              <div class="as-notification-cont"></div>
            </div>
          </li>
          <!-- Сообщения -->
          <li class="nav-item dropdown no-arrow mx-1">
            <a class="nav-link " href="/messages" id="msgCount" role="button">
              <i class="fas fa-envelope fa-fw "></i>
              <span class="badge badge-danger badge-counter as-msg-count hide">0</span>
            </a>
          </li>
		  <!-- РАЗДЕЛИТЕЛЬ -->
          <li class="border d-none d-sm-block"></li>
		  <!-- Некая кнопка с иконкой -->
          <li class="nav-item dropdown no-arrow mx-1" title="">
            <a class="nav-link " href="#" role="button">
              <i class="fa fa-bars fa-fw"></i>
              <span>1000</span>
            </a>
          </li>
		  <!-- КОРЗИНА -->
          <li class="nav-item dropdown no-arrow asTopCartBar">
            <a class="nav-link dropdown-toggle" href="#" id="cartDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              <i class="fas fa-shopping-cart fa-fw"></i>
              <span class="badge badge-danger badge-counter as-cart-productCount hide">0</span>
            </a>
            <div class="dropdown-menu dropdown-menu-right p-3 shadow animated--grow-in text-center" aria-labelledby="cartDropdown">
              <div class="as-cart-info" data-code="supplierProduct"></div>
            </div>
          </li>
          <!-- ЯЗЫКИ -->
          <li class="nav-item dropdown no-arrow asTopLang">
            <a class="nav-link dropdown-toggle" href="#" id="langDropdown" role="button" data-toggle="dropdown">
              <i class="fas fa-globe fa-fw"></i><span class="as-langs-curLang hide text-uppercase"></span>
            </a>
            <div class="dropdown-menu dropdown-menu-right p-3 shadow text-center" aria-labelledby="langDropdown">
              <div class="as-langs hide"></div>
            </div>
          </li>
        </ul>
         <!-- МЕНЮ СПРАВА -->
        <ul class="navbar-nav">
          <li class="nav-item ">
            <a class="nav-link" href="https://wa.me/+79008007060" title="Whatsapp, telegram, viber" target="_blank"><i class="fab fa-whatsapp"></i> +7 (900) 800-70-60</a>
          </li>
          <!-- СЛУЖЕБНОЕ МЕНЮ ПОЛЬЗОВАТЕЛЯ -->
          <li class="nav-item dropdown no-arrow as-loginStatus">
            <a class="nav-link dropdown-toggle animated zoomInRight delay-1s slow" href="#" id="userDropdown" role="button" data-toggle="dropdown">
              <i class="fa fa-user-tie"></i>
              <span class="as-userPicLabel ">user1</span>
            </a>
            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="userDropdown">
              <span class="userDropdownLabel dropdown-item disabled text-center font-weight-bold">
                Пользователь
              </span>
              <div class="dropdown-divider"></div>
              <a class="dropdown-item " href="/user">
                <i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
                Мой профиль
              </a>
              <a class="dropdown-item " href="/changepass">
                <i class="fas fa-key fa-sm fa-fw mr-2 text-gray-400"></i>
                Сменить пароль
              </a>
              <a class="dropdown-item " href="/account/logoff">
                <i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>
                Выйти
              </a>
            </div>
          </li>

        </ul>
      </div>
    </nav>
  </div>
</div>