---
metadata:
  - name: generator
    content: Diplodoc Platform v5.70.0
alternate:
  - https://yandex.ru/support/kit/ru/site-editor/sections/head.md
  - href: https://yandex.ru/support/kit/ru/site-editor/sections/head.md
    type: text/markdown
    title: Markdown version
  - href: https://yandex.ru/support/kit/ru/llms.txt?revision=r22105010
    rel: describedby
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.ru/support/kit/ru/llms.txt?revision=r22105010

# Шапка 

Секция **Шапка** расположена вверху страницы сайта. Ее нельзя удалить, она обязательна для каждой страницы.

В шапке отображаются меню сайта, логотип и контакты компании, а также поисковая строка.

## Настроить секцию {#set-section}

Чтобы настроить внешний вид главного и дополнительного меню:

1. Нажмите на секцию **Шапка**.
    
1. В панели справа отредактируйте настройки:
&nbsp;

   #|
   ||
   
   **Настройка**

   |
   
   **Описание**

   ||
   ||
   
   **Палитра цветов**

   |
   
   Выберите палитру цветов, которая будет использоваться для секции.

   Палитры цветов настраиваются на вкладке [Тема](https://yandex.ru/support/kit/ru/site-editor/themes.md#settings).

   ||
   ||
   
   **Внешний вид шапки**

   |
   
   Выберите значение:

   * **Прозрачная**
   * **Непрозрачная**
   * **Прозрачная наверху и меняется при скролле**

   ||
   ||
   
   **Цвет текста и иконок для прозрачной шапки**

   |
   
   Выберите значение:

   * **Инвертировать** — изменить цвет или тон на дополнительный цвет или противоположный тон, например, черный на белый.
   * **Свое значение** — выберите свой цвет.

   ||
   ||
   
   **Разделительная линия**

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

   ||
   ||
   
   **Закреплять шапку при скролле**

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

   ||
   ||
   
   <span style="font-size: 20px; font-weight: 600;">Размеры секции</span>

   |
   
   >

   ||
   ||
   
   **Растянуть секцию на весь экран**

   |
   
   Настройте расположение секции:

   * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**.
   
   * **Да** — секция займет всю ширину экрана.

   * **Нет** — секция будет расположена ближе к центру экрана.

   ||
   ||
   
   **Отступ по краям на десктопе**

   |
   
   Настройте отступ секции от краев экрана для полной версии сайта:

   * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**.
   
   * **Своё значение** — выберите значение для отступа. 

   ||
   ||
   
   **Отступ по краям на телефоне**

   |
   
   Настройте отступ секции от краев экрана для мобильной версии сайта:

   * **Как в теме** — секция будет расположена в соответствии с настройкой на вкладке **Тема**.
   
   * **Своё значение** — выберите значение для отступа. 

   ||
   |#

    {% note info %}

    На разных страницах можно задать разный внешний вид шапки.

    {% endnote %}

1. Настройте [главное](#main-menu) и [дополнительное меню](#extra-menu).

## Главное меню {#main-menu}

{% note info %}

Создайте и наполните меню в разделе [**Редактор сайта** → **Меню**](https://yandex.ru/support/kit/ru/site-editor/menu.md). Это инструкция по настройке отображения меню на сайте.

{% endnote %}

1. Слева от названия секции **Шапка** нажмите ![](../../_images/arrow-down.svg).

1. Выберите **Главное меню**. Откроется правая панель управления настройками этого элемента.

1. В панели справа настройте отображение главного меню:
&nbsp;

   #|
   ||
   
   **Настройка**
   
   |
   
   **Описание**
   
   ||
   ||
   
   **Меню**
   
   |
   
   1. Нажмите **Выбрать меню**.
   
   1. Выберите меню из списка или нажмите **Создать меню**. Откроется окно редактирования меню.
   
   Меню настраивается в личном кабинете в разделе **Редактор сайта** → **Меню**.
   
   ||
   ||
   
   **Вид меню**
   
   |

   Выберите отображение меню:
   
   * **Выпадающее сверху** — для маленького меню с одним уровнем категорий.
   * **Шторка** — для среднего меню с одним или двумя уровнями категорий.
   * **Многоуровневая шторка** — для большого меню с двумя и больше уровнями категорий.
   * **Мега меню** — для большого меню с двумя и больше уровнями категорий.
   * **Автоматический** — автоматически подставится подходящий вариант по вашему количеству уровней категорий.

   Примеры меню см. в [Комбинации отображений меню](#combinations).
   
   ||
   ||
   
   **Пункты меню**
   
   |
   
   Укажите, как будут выглядеть пункты меню:
   
   - **Ссылки**
   - **Иконка**
   - **Кнопка**

   Примеры меню см. в [Комбинации отображений меню](#combinations).
   
   ||
   ||
   
   **Расположение логотипа**
   
   |
   
   Укажите, как будет располагаться логотип:
   
   - **Слева**
   
   - **По центру**
   
   ||
   ||
   
   **Размер логотипа**
   
   |
   
   Выберите размер логотипа:

   * **Крошечный**

   * **Маленький**

   * **Средний**

   * **Большой**

   * **Огромный**
   
   ||
   ||
   
   **Вид отображения поиска**
   
   |
   
   Выберите, как будет отображаться строка поиска:
   
   * **Не отображать** — убрать кнопку поиска.
   
   * **Иконка** — показывать только кнопку поиска.
   
   * **Компактный** — показывать кнопку и короткую строку поиска.
   
   * **Во всю ширину** — показывать кнопку и строку поиска во всю ширину шапки.
   
   ||
   ||
   
   **Подписи к иконкам**
   
   |
   
   Включите опцию, чтобы показывать подписи **Избранное**, **Войти**, **Корзина**.

   ||
   |#


### Комбинации отображений меню {#combinations}

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

{% list tabs dropdown %}

- Выпадающее сверху {selected}

  {% list tabs %}

  - Ссылки

    8 позиций категории первого уровня помещаются в шапке, 9 категория и более — скрываются.

    ![](../../_images/head/link.png)

  - Иконка

    ![](../../_images/head/drop-down-icon.png)
  
  - Кнопка

    ![](../../_images/head/drop-down-button.png)

  {% endlist %}

- Шторка

    {% list tabs %}

  - Ссылки

    8 позиций категории первого уровня помещаются в шапке, 9 категория и более — скрываются.

    ![](../../_images/head/link.png)


  - Иконка

    ![](../../_images/head/curtain-icon.png)
  
  - Кнопка

    ![](../../_images/head/curtain-button.png)

  {% endlist %}

- Многоуровневая шторка

    {% list tabs %}

  - Ссылки

    8 позиций категории первого уровня помещаются в шапке, 9 категория и более — скрываются.

    ![](../../_images/head/link.png)

  - Иконка

    ![](../../_images/head/multi-level-curtain-icon.png)
  
  - Кнопка

    ![](../../_images/head/multi-level-curtain-button.png)

  {% endlist %}

- Мега меню

    {% list tabs %}

  - Ссылки

    8 позиций категории первого уровня помещаются в шапке, 9 категория и более — скрываются.

    ![](../../_images/head/link.png)

  - Иконка

    ![](../../_images/head/mega-menu-icon.png)
  
  - Кнопка

    ![](../../_images/head/mega-menu-button.png)

  {% endlist %}

{% endlist %}
   

## Дополнительное меню {#extra-menu}

{% note info %}

Создайте и наполните меню в разделе [**Редактор сайта** → **Меню**](https://yandex.ru/support/kit/ru/site-editor/menu.md). Это инструкция по настройке отображения меню на сайте.

{% endnote %}

1. Слева от названия секции **Шапка** нажмите ![](../../_images/arrow-down.svg).

1. Выберите **Дополнительное меню**. Справа откроется панель управления настройками этого элемента.

1. Настройте отображение дополнительного меню:
&nbsp;

   #|
   ||
   
   **Настройка**

   |
   
   **Описание**

   ||
   ||
   
   **Меню**

   |
   
   1. Нажмите **Выбрать меню**.

   1. Выберите меню из списка или нажмите **Создать меню**. Откроется окно редактирования меню.

   ||
   ||
   
   **Контакт основной**

   |
   
   Укажите, какой контакт будет отображаться справа от кнопок со страницами магазина:

   * **Нет**

   * **E-mail**

   * **Телефон**

   * **Адрес**

   * **Режим работы**

   ||
   ||
   
   **Контакт дополнительный**

   |
   
   Укажите, какой контакт будет отображаться справа от кнопок со страницами магазина:

   * **Нет**

   * **E-mail**

   * **Телефон**

   * **Адрес**

   * **Режим работы**

   ||
   ||
   
   **Геопозиция покупателя**

   |
   
   Включите опцию, чтобы показывать геопозицию покупателя.

   ||
   |#

&nbsp;
   
<!-- source: ru/_includes/support.md -->


## Обратиться в службу поддержки


[Написать в чат](https://yandex.ru/chat/#/user/6c041b05-07a4-99cc-79be-8670b7aff93d){.button}

[Написать письмо](https://yandex.ru/support/kit/ru/feedback.md){.button}

[Яндекс KITᵝ в Telegram](https://t.me/kityandex_support_bot){.button}

[Яндекс KITᵝ в МАКС](https://max.ru/yandex_kit_bot){.button}
<!-- endsource: ru/_includes/support.md -->
