Блоки главной страницы

Главная в Slate состоит из отдельных блоков: обложки, карточек, этапов, тарифов, отзывов, контактов и других разделов. Их можно включать, выключать и переставлять, сохраняя оформление темы. Готовая конфигурация уже предлагает начальный порядок, подходящий её тематике.

Измените порядок и состав

Откройте «Главная страница → Сортировка блоков» в панели темы. Здесь управляется список блоков главной. Выключите те, для которых пока нет содержимого, и поставьте важные разделы выше. Например, для новой услуги разумно сначала объяснить предложение, затем показать состав работ, стоимость и способ обращения.

Выключение блока убирает его с главной, но не удаляет сохранённое содержание. Его можно включить снова. Это удобно для сезонной акции или временно неактуального расписания.

У каждой строки списка есть «Оформление строки»: фон (отдельно для тёмной темы), разделитель и отступы сверху и снизу — от «Нет» до «Максимального» или «Как у блока». Кнопка «Добавить заголовок» вставляет между блоками отдельный заголовок со своим текстом под ним, выравниванием, размером, тегом и ссылкой «Смотреть все»; таких заголовков может быть сколько угодно, и их можно удалять.

Одинаковые блоки встречаются в списке дважды: для главной сайта и для главной магазина. Если магазина на сайте нет, магазинные блоки просто не показываются; фотографии и записи тоже зависят от приложений, из которых они берут данные.

Разделы настроек и доступные блоки различаются между конфигурациями. Специальные блоки конфигурации подписаны в списке так же, как их разделы в панели, например «Первый экран» или «Услуги». Если нужного блока нет в списке, изменение порядка не добавит его само. Блоки, которые появились в теме с обновлением, дописываются в конец списка выключенными: на главной они сами не появляются. Пока вы не сохраните список, администратор видит над блоками главной подсказку о новых блоках. После обновления просмотрите список, включите нужные блоки и расставьте их как нужно. Многие блоки без содержимого посетителю не видны, а администратору показывают подсказку, чего не хватает.

В этом же подразделе «Фон главной страницы» и «Фон главной страницы для тёмной версии» меняют фон только главной. Пустое поле оставляет общий фон сайта; собственный фон блока задаётся отдельно.

Настройка «Главная — лендинг во всю ширину» в том же подразделе собирает главную сайта только из блоков: каждый блок занимает всю ширину экрана, а текст страницы «Главная» из приложения «Сайт» не выводится. Если её выключить, сначала идёт текст этой страницы в обычной ширине, а блоки — под ним.

Заполните отдельные блоки

После выбора состава откройте подраздел нужного блока в «Главная страница». В базовой теме это, например, «Обложка», «Карточки», «Этапы», «Тарифы», «Вопросы и ответы», «Отзывы» и «Контакты». Конфигурация может использовать другие названия для своих специальных блоков.

В обычном списке элементов настраиваются название, текст, изображение, ссылка и доступные дополнительные поля. Текст блока «О компании» набирается в визуальном редакторе: кнопки над полем делают выделение жирным или курсивом, списки и ссылки. Если текст был заполнен до появления редактора, панель перенесёт его в новое поле, сохранив абзацы. Порядок элементов внутри блока независим от порядка самих блоков на главной. Для тарифов это означает, что можно переставить предложения внутри «Тарифов», сохранив положение раздела на странице.

Проверьте ссылки всех кнопок. Если кнопка обещает расчёт или запись, она должна вести к действующей форме или странице обращения. Адрес с названием раздела после знака # работает только при наличии этого раздела на той же странице. Подробности подключения заявки — в статье о формах.

Выберите вид и подготовьте изображения

Если блок предлагает варианты оформления, выберите их по картинке предпросмотра. Такой выбор меняет представление блока; доступные варианты зависят от поставки. Для общего цвета и шрифтов используйте настройки оформления.

У каждого блока главной в его подразделе есть «Заголовок блока» — выравнивание (слева или по центру), размер заголовка и текста под ним, «Тег заголовка», «Как показывать «Смотреть все»» (текстом или стрелкой рядом с заголовком, кнопкой под блоком или не показывать) с адресом и текстом ссылки — и «Оформление»: фон блока для светлой и тёмной версии сайта. С фоном блок выглядит плашкой со скруглёнными углами. Слово в квадратных скобках в заголовке выделяется: «Наши [новинки]». У блоков-списков (категории, бренды, товары, записи, фото, альбомы, баннеры, отзывы, преимущества) можно задать, сколько карточек стоит в ряд на компьютере и показывать ли их на телефоне одной строкой с прокруткой вбок; у списков товаров — состав вкладок, у просмотренных товаров — сетка или карусель. Вид вкладок, стрелок и листания общий для сайта: «Общие настройки → Карусели и вкладки». У каждого блока отдельно включаются «Стрелки» и «Листание».

У «О компании» три вида — фото слева, справа или сверху — и выбор пропорций фото. У «Каталога» есть компактные карточки: маленькая картинка категории над названием. Поле «Как выводить категории» выбирает «Сетку», «Слайдер» или «Лентой с прокруткой на компьютере», а «Сколько в ряд на компьютере» — от четырёх до восьми карточек. «Мини-карточки на телефоне» включены по умолчанию и действуют для любого вида блока; выключите их, чтобы сохранить полные карточки. «Лентой на телефоне» отдельно переключает мобильную сетку на одну строку с прокруткой пальцем. У второй и третьей секции промо-баннеров можно включить «Свою раскладку»: тогда их вид, число баннеров, колонки, пропорции, лента на телефоне и таймер задаются независимо от первой. Пока этот флажок выключен, используется оформление первой секции.

У «Больших баннеров» четыре вида: «Текст на панели, фото рядом», «Текст поверх фото», «Слайдер и товары рядом» и «Во всю ширину экрана». В подразделе блока настраиваются пропорции кадра на компьютере и телефоне, автопрокрутка, «Стрелки» и «Листание», сила затемнения под текстом, стиль кнопок слайдов (в том числе градиентом), показ текста и плиток на телефоне, а для вида с панелью — её цвет (для светлой и тёмной версии) и ширина.

• «Шапка поверх баннера» — для вида «Во всю ширину экрана», когда баннер стоит первым на странице: на компьютере фото уходит под шапку, а шапка лежит на нём полупрозрачной подложкой.
• «Карточка товара рядом со слайдером» — для вида «Слайдер и товары рядом»: «Компактная» (фото слева, название рядом, цена и кнопка ниже) или «Обычная», как в каталоге, с крупным фото. Товары выбираются по номерам, заголовок колонки — своим полем.
• Плитки рядом со слайдером — до двух своих плиток или до двух акций магазина, с описанием под заголовком; цвет текста и затемнение плиток настраиваются отдельно.

Чтобы готовый баннер показывался целиком, откройте «Главная страница → Большие баннеры» и выберите «Естественная высота по картинке» в поле «Пропорции баннера на компьютере». Высота будет меняться вслед за активным слайдом. Для телефона этот режим включается отдельно в «Пропорции баннера на телефоне»; при наличии мобильной картинки используется она. В остальных пропорциях изображение заполняет кадр с обрезкой. При естественной высоте стрелки на компьютере стоят по краям баннера на середине высоты; на телефоне слайды переключаются свайпом и через «Листание», если оно включено.

У каждого слайда можно выбрать «Цвет текста» (тёмный или светлый), «Текст по ширине» (слева, по центру, справа), «Текст по высоте» (сверху, по центру, снизу) и отметить «Без затемнения под текстом». Заголовок и текст слайда набираются в визуальном редакторе. Вместо картинки слайд может показывать видео MP4 — картинка тогда служит обложкой; играет только видимый слайд, а посетителям, отключившим анимацию в системе, показывается обложка. У слайда может быть несколько кнопок, кнопка может открывать форму «Заявок» в окне. Слайд без заголовка и текста, но с кнопкой, целиком становится ссылкой.

Картинки первых семи слайдов можно загрузить с компьютера в подразделе «Картинки слайдов с компьютера»: отдельно кадр для компьютера (16:5, например 1504×470) и для телефона (16:10, например 960×600).

Замените демонстрационные изображения собственными и проверьте кадрирование на телефоне. Одного удачного широкого кадра иногда недостаточно: у большого слайдера может быть отдельное изображение для мобильного экрана. Загружайте достаточно крупный исходник, но учитывайте его вес: загрузка в настройку темы сама по себе не создаёт набор облегчённых копий. Как подготовить копии разной ширины, чтобы телефон получал лёгкий файл, — в статье об изображениях.

Карточки объектов, вопросы и логотипы

В «Главная страница → Объекты → Вид карточек» поле «Как выводить» переключает карточки между вариантами «Сеткой» и «Каруселью». «Сколько карточек показывать» ограничивает подборку; 0 показывает все включённые карточки. «Сколько в ряд на компьютере» задаёт от одной до шести колонок. В «Пропорции фотографий» доступны «Исходная», 1:1, 4:3, 3:2 и 16:9: исходная сохраняет фотографию целиком без обрезки. Для карусели есть «Стрелки» и «Листание» — переключение под карточками в общем для сайта виде. Если включены «Вкладки по тегам», они фильтруют только карточки, попавшие в заданное количество; при выборе вкладки карусель возвращается к началу подборки.

В «Главная страница → Вопросы и ответы → Ширина» выберите «Как у текста» для более узкого списка или «Во всю ширину», чтобы занять весь контейнер содержимого.

В «Главная страница → Логотипы клиентов» выберите «Как выводить» → «Каруселью» и включите «Стрелки». Кнопки под лентой работают и на компьютере, и на телефоне. Когда все логотипы помещаются без прокрутки, кнопки скрываются.

Первый экран отдельной страницы

Блок «Первый экран страницы» может быть компактным: заголовок обычного размера и текст без картинки и больших отступов. Факты, кнопки и примечание сохраняются. Такой вид задаётся параметром вставки блока view="compact"; передайте это пожелание специалисту, который собирает страницу. Вид блока не меняет тег заголовка: H1 или H2 задаётся отдельно. Подробнее — в статье о блоках на страницах.

Главный заголовок страницы (H1)

На странице должен быть ровно один главный заголовок — H1: по нему поисковики и читалки понимают, о чём страница. Сама тема его не добавляет и не прячет — откуда он берётся, задаёте вы:

• Главная — лендинг во всю ширину (так собраны готовые конфигурации): заголовка страницы нет, H1 — у блока, которому в его подразделе выбран «Тег заголовка» → H1. По умолчанию это обложка («Первый экран»). Если главная начинается не с обложки, выберите H1 у блока с главным названием страницы, а у обложки, если она ниже, — H2.
• Обычная главная: сначала выводится текст страницы «Главная» приложения «Сайт» с её названием в H1, блоки — под ним. Если ниже стоит обложка с H1, заголовков станет два: либо уберите заголовок страницы параметром hide_title=1 в её «Дополнительных параметрах», либо выберите обложке H2.
• Главная магазина своей страницы не имеет: H1 появится, только если он выбран у одного из блоков главной магазина. Без этого на ней H1 нет.

По умолчанию у обложки H1, у остальных блоков — H2. Тема не повышает заголовок сама: первый блок не получает H1 автоматически, а обложка не прячет заголовок страницы. «Тег заголовка» меняет только разметку, размер заголовка задаётся отдельно. Проверить можно в коде страницы: строка <h1 должна встретиться один раз.

Проверьте результат

Нажмите «Предпросмотр», прокрутите страницу целиком и дождитесь появления нижних разделов. Проверьте длинные заголовки, пустые карточки, порядок кнопок и переходы по ним. Только после проверки сохраните настройки.

Не путайте содержимое главной с отдельной страницей услуги. Если блок на внутренней странице настроен самостоятельно, изменение одноимённого блока главной может не повлиять на него. Об этом подробнее в статье о страницах.