Горна част (хъдер) е блок, който присъства на всички страници на сайта. Това е едно от първите неща, които клиентът забелязва, когато търси информация за магазина, затова е важно хедъра да бъде визуално привлекателен и удобен за посетителите на сайта.

Можете да конфигурирате структурата и визуалното представяне на този блок в Уебсайт → Дизайн → Редактор на дизайна → блок Header.

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

Quantity badge показват броя на продуктите, изобразявани в елементите на хедъра, като любими, списък за сравнение и количката.
В панела Header Style можете да настроите фона на иконата и цвета на числото, показано вътре.

В първия таб Header Style можете да фиксирате хедъра при скролиране, като отметнете чекбокса Sticky header.

На изображението по-долу можете да видите схематично представяне на хедъра на сайта в Cartum.

Хедъра се състои от три хоризонтални линии, всяка от които съдържа няколко секции.

Секциите заемат определена позиция в линията и отговарят за подравняването на компонентите вътре.

Горната и долната линия съдържат по три секции. Основната линия съдържа четири секции, една от които е с двойна височина, което позволява елементите да се подреждат в два реда.

За да разберете по-добре как изглеждат линиите на структурата, предоставяме пример на реална хедъра на сайт със схематично наслагване на линиите.

За всяка линия на хедъра можете да конфигурирате нейния визуален стил: височина, фон, цвят на елементите, вътрешни отстъпи и т.н. Всички налични настройки могат да се видят в съответния таб.

На екранните снимки по-долу можете да видите настройките на хедъра на един от дизайните от нашата галерия с дизайни. Там можете да намерите и други варианти за оформление на хедъра.

Това е най-широката линия на хедъра, където обикновено се намират големи елементи — лого, работно време, блок с контакти, количка, поле за търсене и т.н.

Конфигурира се в Редактор на дизайна → Header→ таб Main section.

Конфигурира се в Редактор на дизайна → Header→ таб Top section.

Конфигурира се в Редактор на дизайна → Header→ таб Bottom section.

Можете да включвате и изключвате елементи на интерфейса в хедъра, както и да променяте разположението им в хедъра в Редактор на дизайна → Header в таба Header layout.

Тук предоставяме пример за разположение на елементите, което съответства на хедъра от примера. Някои елементи са изключени и няма да се показват.

Елементите, поставени в двойната секция, ще се подравняват по левия край, а тези, добавени в различни части на двойната секция, се подреждат в два реда — един под друг.

Елементите в единична централна секция ще се подравняват по центъра.

Ако искате да промените разположението на конкретен елемент в хедъра, просто го плъзнете в желаната секция и запазете промените.

В редактора на дизайна можете да променяте стила на показване на даден елемент. За всеки елемент на хедъра са налични допълнителни настройки, до които можете да получите достъп, като разгънете неговия панел.

Още примери за различни оформления на хедъра, визуален дизайн на линиите и разположение на елементите можете да видите в нашата Галерия с дизайни.

Всички налични елементи на хедъра на сайта:

Визуалното представяне и разположението на елементите в хедъра на мобилната версия се конфигурират отделно