Конструктор шапки и подвала из настоящих блоков
Шапки, подвалы, верхние полосы, мега-меню, боковые панели, заголовки страниц и hero-секции создаются как записи в редакторе блоков и назначаются всему сайту или одной странице.
Обновлено
Вложенность блоков работает так, как вы ожидаете
Запись шапки содержит Header Root. Header Root содержит Container, а Container содержит Zones. Zone — это ячейка строки шапки: в одной находится логотип, в следующей меню, а в последней значок поиска и корзина.
Зоны задают раскладку
Зона определяет, что где находится. Сдвиньте одну зону вправо, объедините поиск и корзину в группу или оставьте зону без оформления, если хотите убрать лишнюю разметку.
- Зоны меняют порядок для каждого брейкпоинта, поэтому одна запись охватывает десктоп, планшет и телефон
- Любую зону можно ограничить одной категорией устройств, и на остальных она не попадает в разметку
- Дополнительные классы для зоны, если нужно обращаться к ней из собственного CSS
22 блока шапки
Header Root
Сама шапка. Всё остальное вложено внутрь неё.
Header Container
Контейнер ширины, чтобы шапка могла быть в ограниченной ширине, на всю ширину или сочетать оба варианта на разных брейкпоинтах.
Header Zone
Ячейка в строке шапки. Зоны вмещают элементы и определяют их расположение.
Header Logo
Ваш логотип с отдельными файлами для закреплённого и тёмного состояний.
Header Navigation
Главное меню с выпадающими списками и панелями Мега-меню.
Header Search
Значок поиска, который открывает поле, или поле, которое всегда открыто.
Header Cart
Корзина WooCommerce с количеством товаров и выпадающей сводкой.
Header Social
Ряд значков социальных сетей из профилей, которые вы настроили один раз.
Header Button
Кнопка призыва к действию с обычными настройками размера, стиля и ссылки.
Header Icon Link
Один значок со ссылкой на любой адрес, например на номер телефона или страницу аккаунта.
Header Info
Небольшой блок с контактными данными, адресом или часами работы.
Header Shop Search
Поиск товаров для магазина в пределах вашего каталога.
Header Topbar
Размещает запись верхней панели над строкой шапки.
Mega Menu Column
Колонка внутри панели мега-меню, благодаря которой панель может содержать полноценную разметку.
7 пресетов для старта
Пресет — это набор настроек макета, который применяется в один клик. Выберите нужное поведение, затем измените любые параметры в настройках блока.
Прозрачность
Фон не задан, поэтому видно всё, что находится за шапкой.
Полупрозрачный
Полупрозрачный фон, чтобы изображение за ним оставалось видимым, а текст оставался читаемым.
Плавающая
Шапка располагается внутри страницы с отступами со всех сторон.
Плавающая полупрозрачная
Плавающая, также с полупрозрачным фоном.
Плавающая и уменьшенная
Плавающая шапка уменьшенной высоты.
Во всю ширину, липкая
Занимает всю ширину окна просмотра и остаётся закреплённым при прокрутке страницы.
Закрепление при прокрутке вверх
Скрывается при прокрутке вниз и возвращается при прокрутке вверх.
Верхние панели, мега-меню и боковые панели тоже записи
Создайте каждую шапку один раз, задайте её как шапку сайта по умолчанию, затем переопределите её на страницах, которым нужно что-то другое.
Верхние панели
Верхняя панель хранится как отдельная запись со своими блоками: номер телефона, часы работы, переключатель языка, акция. Блок Header Topbar размещает её над строкой шапки. Назначьте её глобально и переопределяйте для каждой страницы.
В 12 из 88 демо есть верхняя полоса, которую можно редактировать.
Боковые панели
Боковая панель представляет собой запись, которая выезжает от края экрана и служит для вторичного меню, корзины, контактной формы или набора сведений, которые перегрузили бы шапку.
В 6 демо боковая панель уже связана с триггером.
Назначение элемента задаётся в поле: выберите боковую панель по умолчанию, край, с которого она появляется, режим (сдвигает страницу или открывается поверх неё) и внешний вид триггера. Верхние панели, мега-меню и подвалы назначаются так же.
94 поля: самый большой раздел в Настройках темы
Настройки темы содержат параметры шапки для всего сайта, которые не должны относиться к отдельной записи. Импорт демо задаёт их все автоматически, а вы меняете только нужные.
- 94 of the 533 Theme Options fields belong to the header
- Задайте шапку по умолчанию, а затем переопределите её на любой странице
- Закрепление при прокрутке, высота, отступы и мобильные брейкпоинты
- Каждое поле описано в справочных статьях
40 шаблонов шапки для старта
Вставьте паттерн, и вы получите обычные блоки, которые можно переставлять, переименовывать и удалять. Ничего не заблокировано, и ни один макет не сведён к скриншоту, до которого нельзя добраться.
- 40 паттернов шапки, больше, чем в любой другой категории
- 16 шаблонов подвала для нижней части страницы
- 183 шаблона всего, сгруппированы в 17 категорий
- Вставляется из вкладки «Шаблоны» в панели добавления блоков, которой вы уже пользуетесь
Подвалы и строки копирайта — отдельные записи
Подвал работает точно так же, как шапка. Запись Footer хранит колонки, а запись Copyrights — тонкую полоску под ними, поэтому юридическую строку можно поменять по всему сайту, не трогая оформление выше.
Шесть блоков и 17 параметров
Footer About для описания компании, Footer Contacts для адреса и телефона, Footer Instagram для ленты, Footer Widget Area для любого содержимого, которое может выводить виджет, Widget Links для аккуратного столбца ссылок и Copyrights для нижней полосы.
- Назначайте подвал глобально или для каждой страницы отдельно, так же как шапку
- Отдельная запись с копирайтом для нижней полосы
- 16 шаблонов подвала, с которых можно начать
- Отображается в области редактирования по мере сборки страницы
4 стиля, или создайте свой
Полоса под шапкой — самостоятельная область дизайна с 57 параметрами и переопределением настроек для каждой страницы, которую вы публикуете.
По умолчанию, Мини, Шаблон или Своя
Default — это стандартная полоса. Mini — компактная версия для внутренних страниц. Template выбирает один из именованных специализированных макетов. Custom выводит запись заголовка страницы, которую вы собрали из блоков самостоятельно.
- Page Title, Heading, Subtitle, Breadcrumbs and Buttons blocks
- Общая настройка по умолчанию, которую может переопределить любая отдельная страница
- Фон, высота, выравнивание и хлебные крошки задаются в настройках
Размещается в шаблоне блоком слота
Секции Hero и слайдеры хранятся как отдельные записи, так же как шапки. Блок слота находится в шаблоне блока и подключает секцию Hero или слайдер, назначенный просматриваемой странице.
- Записи Hero и записи Slider, созданные из блоков
- Блоки Hero Slot и Slider Slot находятся в шаблоне, а не в вашем контенте
- Один шаблон для всех страниц, у каждой своё вступление
- 12 из 88 демо содержат слайдер, который можно редактировать
Шапку вы создаёте прямо там, где её видите
Слотовые блоки переносят шапку, верхнюю панель, заголовок страницы, главный баннер и подвал в область редактирования, поэтому страница открывается как страница, а не как набор абзацев.
Страница в редакторе блоков, в которой шапка и подвал отображаются вокруг содержимого тем же кодом, что и для посетителя.
Единый рендерер
Шапка, которую вы видите в редакторе, строится тем же кодом, что и для посетителя, поэтому отдельного предпросмотра, который нужно было бы держать в актуальном состоянии, нет.
Глобально или для каждой страницы
Задайте для всего сайта шапку, верхнюю панель, заголовок страницы, главный баннер и подвал по умолчанию, а затем переопределите любой из них на отдельной странице в её собственных настройках.
Адаптивность по умолчанию
Зоны меняют порядок для каждого брейкпоинта и могут быть ограничены определённым классом устройств, поэтому вы проверяете расположение на телефоне в редакторе, прежде чем его увидит кто-либо ещё.
Нужна ли отдельная шапка для мобильных устройств?
Одна шапка Canvas обычно работает и на мобильных устройствах, потому что зоны перестраиваются по брейкпоинтам и каждую можно ограничить определённым классом устройств. Одна запись шапки может поместить логотип по центру на телефоне, скрыть контактные данные и спрятать меню за переключателем. Создавайте вторую запись, только если вам действительно нужен другой дизайн, а не для исправления вёрстки.
Может ли одна страница использовать другую шапку?
Да, в каждой шапке, верхней панели, заголовке страницы и подвале Canvas есть общий для всего сайта вариант по умолчанию и переопределение для отдельной страницы, поэтому на лендинге может быть прозрачная шапка и верхняя панель только с логотипом, а остальной сайт сохраняет свои настройки.
Шапка — это область виджетов или меню?
Шапка Canvas не относится ни к тому, ни к другому: это запись, которую вы редактируете в редакторе блоков, точно так же, как страницу. Навигация, логотип, поиск, корзина и кнопки внутри неё — это блоки со своими панелями настроек.
Что будет с шапкой, когда истечёт лицензия?
Когда лицензия Canvas истекает, ваша шапка и остальная часть сайта продолжают отображаться так же, как сейчас. Приостанавливается сам сервис: обновления, импорт демо, AI и редактирование премиум-блоков остаются недоступны до продления. Если проверка лицензии не может связаться с нашими серверами, действует 14-дневный льготный период.
Можно ли по-прежнему пользоваться Редактором сайта?
Да, Canvas построен на настоящих блочных шаблонах, поэтому шаблоны и части шаблонов остаются там, где их хранит WordPress, а запись шапки помещается в шаблон с помощью блока. Узнайте, как работает редактор.
Создайте свой следующий сайт с Canvas
Новичок, фрилансер или агентство: вы получаете одни и те же блоки и одни и те же демо. Начните с одного сайта и создавайте столько, сколько нужно, на одной лицензии.