Аспро: Премьер — документация, часть 2 из 6: Главная страница

Евгений Урядов · обновлено 19 сентября 2026 г.

Источник: официальный курс «Аспро: Премьер» из базы знаний Аспро. Решение: Аспро: Премьер. Справочная выгрузка сертифицированного партнёра Аспро, обновлено 19.09.2026.

Части курса: 1 · 2 · 3 · 4 · 5 · 6

Содержание


Главная страница

Описание курса

назадЗащита подписки на рассылку от спама Управление расположением блоков на главнойвперед

Управление расположением блоков на главной

Главная страница сайта состоит из блоков. К примеру, есть блок «Баннеры картинками» (1), блок «Акции» (2) и блок «Новости» (3).

Все блоки вашего сайта — это единый организм, где каждая часть дополняет друг друга. Чтобы структура сайта выглядела органично, продумайте стратегию расположения блоков. Покажем на примере.

Как управлять расположением блоков

  1. Открыть виджет настроек.
  2. Перейти на вкладку «Главная».
  3. Ухватить левой кнопкой мыши вертикальные стрелки рядом с ползунком, который отключает отображение блока, и переместить строку вверх или вниз.

Элементы сместятся в сторону освободившегося пространства — вверх или вниз, в зависимости от того, откуда вы перетащили строку.

Например, при перемещении блока акции (1) под блок «Баннеры с картинками» (2), баннеры текстом (3) и новости (4) переместятся на одну позицию вверх.

Вы можете отключить отображение определенного блока. Для этого используйте виджет настроек и в блоке «Главная» деактивируйте ненужный блок.

Управлять блоками можно в административной части. Для этого перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В блоке есть параметры Порядок блоков на главной (1). Возле полей, активирующих отображение блоков, располагаются вертикальные стрелки (2). С их помощью можно менять блоки местами (так же, как в виджете).

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

Описание курса

назадГлавная страница Большие баннеры на главной страницевперед

Большие баннеры на главной странице

На главной странице вы можете отобразить большие баннеры. Добавляйте блок с большими баннерами, чтобы посетители сайта могли подробно рассмотреть широкие изображения с вашей продукцией и выгодными предложениями. Выводите баннеры с информацией о предстоящий акций и тизеры через заголовок и описание к каждому баннеру.

Всего доступно 3 типа отображения больших баннеров на главной. Рассмотрим подробнее каждый из них.

  1. С наездом на шапку.

  1. Без наезда на шапку.

  1. С баннерами сбоку.

Выбрать подходящий тип можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Большие баннеры» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Административная панель

Для выбора подходящего типа блока необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

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

Далее прокрутите бегунок до «Вид отображения больших баннеров». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадУправление расположением блоков на главной Настройки оформления блока «Большие баннеры» на главнойвперед

Настройки оформления блока «Большие баннеры» на главной

Настроить вид отображения блока можно так, как этого требует ваш проект. Например, выбрать тип, ширину текста и др. Рассмотрим настройки подробнее.

Общие настройки блока

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок.

Вот так выглядит блок с разделителем и серым фоном.

Настройки по типам блока

Всем типам отображения можно настроить ширину текста (1) и высоту картинки (3). Для первого и второго типа можно расположить текст баннера по контенту (с краю или по центру) (2). Второму и третьему типу можно задать узкий баннер (4) и отступы (5).

Рассмотрим, чем отличается широкий и неширокий текст у больших баннеров:

  • неширокий текст;

  • широкий текст.

Первому и второму типу можно расположить текст баннера по контенту (с краю или по центра).

  • Расположение по контенту.

  • Расположение не по контенту.

Любому типу отображения можно назначить высокую, обычную или низкую высоту баннеров.

  • высокий по высоте баннер;

  • обычный по высоте баннер;

  • низкий по высоте баннер.

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

  • узкий баннер;

  • обычный баннер.

Настройка отступов позволяет оставлять свободное место в правом и левом крае от баннеров и определить, насколько блок будет отдален от шапки сайта и соседних блоков.

  • баннер с отступами;

  • баннер без отступов.

Описание курса

назадБольшие баннеры на главной странице Создание и редактирование больших баннероввперед

Создание и редактирование больших баннеров

Создавать и редактировать большие баннеры на главной странице можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Включите режим правки, переведите курсор на область баннера. Для создания нового баннера нажмите кнопку «Добавить баннер» (1). Чтобы отредактировать уже существующий баннер, нажмите «Изменить баннер» (2).

Административная панель

В административной панели для создания и редактирования баннеров необходимо перейти в Контент (1) → Реклама (aspro.premier) (2) → Большие баннеры (3).

Для создания нового баннера нажмите кнопку «Добавить баннер» (1). Чтобы отредактировать уже существующий баннер, нажмите на «Гамбургер» рядом с ним и выберите «Изменить» (2).

Рассмотрим подробнее настройки баннера. На вкладке «Баннер» доступны поля:

  1. Активность, чтобы баннер отображался.
  2. Название — обязательное для заполнения поле. Его содержимое отображается на сайте как заголовок баннера.
  3. Ссылка с баннера — можно прописать URL (абсолютный или относительный) страницы. Это сделает баннер кликабельным — при нажатии на него пользователь перейдет на заданную страницу.
  4. Заголовок баннера h1 — назначить заголовку баннера мета-тег h1 для использования в SEO.

Ниже можно загрузить активную картинку (1) и фоновую (2). Если фоновая картинка будет не загружена, то баннер будет располагаться на сером фоне. Картинки загружаются отдельно для высоких, обычных и низких баннеров (3).

Также можно загрузить изображение в поле «Картинка для <768px». Эта картинка предназначена для мобильных устройств и не предусматривает вывод заголовка и текста баннера. Подробнее об этом читайте в статье про мобильные баннеры.

Ниже доступны поля для настройки текста:

  1. Затемнение/засветление — включить затемнение или засветление для текста на баннере.
  2. Центрировать текст — выравнивание текста по центру.
  3. Цвет шапки и текста — установить светлый или темный цвет текста.

Отдельно доступны поля для настройки кнопок:

  1. Кнопка 1 текст — подпись для кнопки на баннере.
  2. Кнопка 1 класс — кнопка может быть залитая, полупрозрачная и прозрачная с бордером.
  3. Кнопка 1 ссылка — установить ссылку перехода на заданную страницу при нажатии на кнопку.
  4. Кнопка 1 цвет — назначить цвет для кнопки. Это может быть цвет темы или любой другой цвет на выбор.
  5. Код формы для первой кнопки — используется, если нет ссылки. При нажатии на кнопку открывается определенная форма. Например, задать вопрос или зарегистрироваться на сайте.
  6. Точно такие же функции, как у первой кнопки, вы можете настроить и для второй кнопки.

Для подключения видео на баннере доступны следующие поля:

  1. Источник видео — выбрать способ привязки видео: из файла или по HTML-коду.
  2. Отключить звук для видео.
  3. Ссылка на видео — HTML-код с ссылкой на видеоролик. Можно привязать ролик с YouTube.
  4. Текст кнопки воспроизведения видео — подпись кнопки для запуска видео.
  5. Класс кнопки воспроизведения видео — кнопка может быть залитая и прозрачная с бордером.
  6. Файл видео — загрузить файл с видео в систему.
  7. Включить автовоспроизведение.
  8. Показывать видео, чтобы видеоролик можно было воспроизводить на баннере.
  9. Повторять видео.
  10. Заполнять видео по размеру.

На вкладке «Связи» можно назначить регион показа баннера.

На вкладке «Разделы» отнесите баннер к одному из разделов, чтобы упорядочить баннеры по типам отображения.

Описание курса

назадНастройки оформления блока «Большие баннеры» на главной Настройки анимации и слайд-шоу у больших баннероввперед

Настройки анимации и слайд-шоу у больших баннеров

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

Чтобы настраивать скорость автоматической прокрутки и управлять скоростью при переключении, необходимо в административной панели перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

Прокрутите бегунок в самую нижнюю часть до блока «Большой баннер». Задайте тип анимации большого баннера (1). Можно назначить горизонтальное скольжение баннеров или выцветание.

Чтобы баннеры перелистывались быстрее или медленнее, задайте скорость слайд-шоу большого баннера (2). Чем выше значение в миллисекундах, тем быстрее баннеры будут переключаться.

Установите скорость анимации большого баннера (3), чтобы задать параметр перехода, который влияет на быстроту переключения одного баннера к другому. Чем ниже значение, тем плавней произойдет переход. Выберите необходимые параметры и нажмите «Применить».

Описание курса

назадСоздание и редактирование больших баннеров Скрывать большой баннер на узких экранахвперед

Скрывать большой баннер на узких экранах

Большие баннеры на главной странице можно скрывать на узких экранах. Это используется, например, для мобильных устройств, на которых большие баннеры занимают слишком много места. Скрывайте громоздкие баннеры на узких экранах для обеспечения аккуратности в оформлении главной страницы.

Чтобы скрывать большой баннер на узких экранах, необходимо в административной панели перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

Прокрутите бегунок в самую нижнюю часть до блока «Большой баннер», поставьте галку напротив пункта «Скрывать на узких экранах (<600 px)» и нажмите «Применить».

Описание курса

назадНастройки анимации и слайд-шоу у больших баннеров Тизеры преимуществ на главнойвперед

Тизеры преимуществ на главной

Тизеры преимуществ — это блок с небольшими иконками. К тизерам можно привязывать ссылки и сделать их кликабельными как баннеры. Блок с тизерами преимуществ вы можете отобразить на главной странице.

В решении уже создан набор тизеров с основными преимуществами для типового интернет-магазина. Вы можете дополнить их своими собственными и комбинировать в любых сочетаниях.

Доступно три варианта отображения тизеров.

  1. Карточкой.

  1. Без отступов.

  1. Картинкой.

Отобразить тизеры преимуществ на главной можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Тизеры» (1). Вы можете активировать и деактивировать этот блок через переключатель (2).

Административная панель

Для выбора подходящего типа отображения тизера необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Тизеры», чтобы отобразить его на главной странице.

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

Содержание главы:

Описание курса

назадСкрывать большой баннер на узких экранах Настройки отображения тизероввперед

Настройки отображения тизеров

Настроить вид отображения блока с тизерами можно так, как этого требует ваш проект. Например, выбрать количество элементов в строке, позицию картинки и др. Рассмотрим настройки подробнее.

Общие настройки блока

Для блока с тизерами можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). А также задать верхние и нижние отступы, которые отделяют блок от соседних (2).

Разделитель служит для указания границы блока, а галка с фоном назначает блоку серый фон вместо белого.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего шесть интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Настройки по типам блока

Первому типу блока можно задать обводку (1) и фон (2). Первому и второму типу блока можно настроить позицию картинки (3). Всем типам блока можно задать количество элементов в строке (4) и само количество строк (5). Третьему типу блока можно выбрать положение текста (6).

  • Тизеры с обводкой.

  • Тизеры без обводки.

  • Тизеры с фоном.

  • Тизеры без фона.

  • Позиция картинки: сверху.

  • Позиция картинки: слева.

  • 3 элемента в строке;

  • 5 элемента в строке.

  • количество строк: 1;

  • количество строк: 2.

  • Положение текста: внутри.

  • Положение текста: снизу.

Описание курса

назадТизеры преимуществ на главной Настройка сортировки тизероввперед

Настройка сортировки тизеров

Блоку тизеров в публичной части можно указать дополнительные настройки. Для этого включите режим правки, наведите на область блока с тизерами и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения тизеров. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Нажмите «Сохранить».

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

Описание курса

назадНастройки отображения тизеров Добавление и изменение тизероввперед

Добавление и изменение тизеров

Для добавления и изменения тизеров переключитесь на административную часть сайта и перейдите в необходимый раздел: Контент (1) → Контент (aspro.premier) (2) → Тизеры (3).

Чтобы добавить новый тизер, нажмите «Добавить элемент» (1). Чтобы отредактировать уже существующий, нажмите кнопку «Гамбургер» рядом с ним и выберите «Изменить» (2).

Рассмотрим подробнее настройки тизера. На вкладке «Элемент» доступны поля:

  1. Активность, чтобы тизер отображался.
  2. Название — обязательное для заполнения поле. Его содержимое отображается на сайте как заголовок тизера.
  3. Ссылка — можно прописать URL (абсолютный или относительный) страницы. Это сделает тизер кликабельным — при нажатии на него пользователь перейдет на заданную страницу.
  4. Текст под заголовком — дополнительный текст тизера.

На вкладке «Изображения» можно загрузить картинку (1) или иконку (2) для тизера. Рекомендуемый размер иконки — 40 х 40 px в формате SVG. Также здесь вы можете активировать свойство «Не инлайновая svg» (3). При активации свойства, иконка не будет окрашиваться в цвет темы.

Описание курса

назадНастройка сортировки тизеров Разделы каталогавперед

Разделы каталога

Разделы каталога на главной странице — специальный блок для быстрого доступа к необходимым товарам. Например, клиент при клике на картинку или заголовок «Одежда» может сразу попасть в соответствующий раздел каталога и не тратить время на поиски этого раздела на сайте.

В решении доступно 4 типа отображения списка разделов каталога на главной странице. Вы можете настроить обводку, задать количество элементов в строке, вид изображения. Рассмотрим подробнее типы отображения списка разделов каталога на главной.

  1. Компактно.

  1. Большие картинки.

  1. Слайдером.

  1. Плиткой.

Выбрать подходящий тип можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Разделы каталога» (1). Раскройте пункт и выберите необходимый тип отображения списка разделов каталога (2).

Административная панель

Для выбора подходящего типа отображения разделов необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Разделы каталога», чтобы отобразить его на главной странице.

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

Содержание главы:

Описание курса

назадДобавление и изменение тизеров Настройки оформления блока «Разделы каталога»вперед

Настройки оформления блока «Разделы каталога»

Настроить вид отображения блока с разделами каталога можно так, как этого требует ваш проект. Например, выбрать количество элементов в строке, тип изображения, отступы и др. Рассмотрим настройки подробнее.

Общие настройки блока

При любом типе отображения для блока с разделами каталога можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). А также задать верхние и нижние отступы, которые отделяют блок от соседних (2). По вашему усмотрению можно настроить заголовок всего блока или полностью его убрать (3).

Вот так выглядит блок с разделителем и серым фоном.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Заголовок можно добавлять/убирать через галку.

  • заголовка нет;

  • заголовок есть.

Настройки по типам блока

Первому, третьему и четвертому типу отображения можно задать обводку (1), картинку на фоне (2) и тип отображения (3). Второму типу можно задать высоту картинки (4). Второму и четвертому типу можно выбрать количество элементов в строке (5) и количество строк (6). Третьему типу можно задать компактность элементов (7).

  • разделы каталога с обводкой;

  • разделы каталога без обводки;

  • картинка с фоном;

  • картинка без фона;

  • вид изображения «иконки»;

  • вид изображения «картинки»;

  • вид изображения «прозрачные картинки»;

  • высокие картинки;

  • невысокие картинки;

  • количество элементов в строке: 3;

  • количество элементов в строке: 5.

  • количество строк: 1;

  • количество строк: 3.

Для третьего типа можно задать компактное отображение.

  • компактно;

  • компактное отображение отключено.

Описание курса

назадРазделы каталога Дополнительные настройки блока «Разделы каталога»вперед

Дополнительные настройки блока «Разделы каталога»

Блоку «Разделы каталога» в публичной части можно указать дополнительные настройки. Для этого включите режим правки, наведите на область блока с разделами и нажмите на шестеренку.

В открывшемся окне на вкладке «Источник данных» можно настроить максимальную отображаемую глубину разделов.

Максимальная глубина позволяет определить, какого уровня вложенности отобразить подраздел. Например, у раздела «Спортивные товары» есть подраздел «Экипировка» 3-его уровня вложенности.

На вкладке «Дополнительные настройки» можно изменить заголовок блока (1), настроить название ссылки при наведении (2) и саму ссылку на все элементы (3). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Разделы каталога» Активация разделов каталога на главной страницевперед

Активация разделов каталога на главной странице

Чтобы отобразить раздел каталога на главной странице, в административной панели проделайте путь: Контент (1) → Каталог (aspro.premier) (2) → Каталог товаров (3).

В поле раздела каталога кликните на «Гамбургер» и нажмите «Изменить».

Для вывода определенного раздела каталога на главной странице необходимо перейти на вкладку «Доп. поля» и установить галку в поле «Отображать на главной». Сохраните изменения.

Описание курса

назадДополнительные настройки блока «Разделы каталога» Блок «Видеоотзывы» на главной страницевперед

Блок «Видеоотзывы» на главной странице

На главной странице можно отобразить блок «Видеоотзывы». Это надежный способ наглядно продемонстрировать счастливых клиентов и результаты собственной работы. Улучшайте имидж компании и повышайте лояльность посетителей.

Ролики подгружаются из YouTube, а с обновлением Аспро: Премьер 1.2.0 с сервисов VK Видео и Rutube из плейлиста или с главной страницы канала. Также вы можете переименовать блок и выводить туда любые видео на ваше усмотрение. Например, обзоры своих проектов.

Чтобы настроить блок с видео, в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) и выберите вкладку «Социальные сети», которая появилась в обновлении 1.2.0.

Рассмотрим, как получить данные для интеграции с видеохостингами.

YouTube

Для подключения роликов с канала потребуется API Token YouTube.

Чтобы его получить, зайдите на специальный сервис от Google. Выберите пункт YouTube Data API v3.

Нажмите кнопку ENABLE.

После этого откроется новое окно, в котором нужно нажать на кнопку CREATE CREDENTIALS.

В поле Select an API выберите YouTube Data API v3.

На выбор появится два пункта. Отметьте Public data и нажмите NEXT.

Скопируйте ключ из поля API Key и нажмите Done.

Полученный ключ вставьте в соответствующее поле в административной части сайта.

После этого укажите ID канала (1), если хотите брать видео напрямую с YouTube-страницы. Укажите ID плейлиста (2), если хотите использовать видео из плейлиста. Также здесь вы можете выбрать сортировку видео (3), задать заголовок блока (4) и указать подсказку ссылки на все видео (5).

Сохраните изменения.

Для корректной работы блока «Видеоотзывы» в настройках хостинга необходимо включить модуль allow_url_fopen. На картинке ниже показали пример для хостинга Reddock.

VK Видео

Чтобы виджет заработал, нужно получить токен API. Сделать это можно через создание своего приложения для «ВКонтакте». Token API одинаковый для блоков с постами и видео.

Обратите внимание! Чтобы видеозаписи отображались на сайте, создатель приложения и API токена должен обязательно быть администратором сообщества во Вконтакте, из которого будут подгружаться ролики.

Для начала зайдите на https://id.vk.com/about/business/go/ и нажмите «Добавить приложение».

Выберите, кем будет управляться приложение. Нажмите «Далее».

Затем заполните свои данные. Эта информация не будет отображаться публично. Согласитесь с офертой и обработкой персональных данных. Нажмите «Создать аккаунт».

Заполните название приложения (1) и выберите платформу: Web (2). Нажмите «Далее».

В поле «Базовый домен» напишите адрес вашего сайта без протокола (1). В поле «Доверенный Redirect URL» вставьте: https://oauth.vk.com/blank.html (2). Нажмите «Готово».

Введите код из push-уведомления для подтверждения.

После этого вы получите ID приложения. Оно будет доступно в соответствующем поле.

После создания приложения настройте расширенные доступы. Перейдите на вкладку «Доступы» и нажмите кнопку «Заполнить» в блоке «Расширенные доступы».

В строке «Паспортные данные» нажмите на кнопку «Добавить». Заполните поля и нажмите «Добавить данные»

После заполнения паспортных данных нажмите на кнопку «Отправить на проверку».

Перед вами появится сообщение, что данные проверяются. Проверка занимает около 2 часов.

Если проверка пройдена успешно, сообщение изменится на «Аккаунт подтвержден».

На данный момент выдача расширенных доступов со стороны ВКонтакте приостановлена.

Теперь вам понадобится следующая ссылка. Скопируйте ее в текстовый редактор и отредактируйте, заполнив своими данными: [code] https://oauth.vk.com/authorize?client_id=[ID нашего приложения]&scope=notify,photos,friends,audio,video,notes,pages,docs,status,questions,offers,wall,groups,messages,notifications,stats,ads,offline&redirect_uri=https://oauth.vk.com/blank.html&display=page&response_type=token

[/code]

  • Вместо [ID нашего приложения] подставляем полученный ID. Квадратные скобки также нужно убрать;

  • В атрибуте scope оставляем только тот контент, доступ к которому вам нужен. Как правило, достаточно оставить параметры video, wall и offline.

Получившуюся ссылку вставьте в адресную строку браузера и перейдите по ней. После этого вас попросят авторизоваться в VK. Нажмите «Продолжить как …».

В новом окне из ссылки скопируйте показатель атрибута все символы после «access_token=». Это и есть ваш API токен.

Далее в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) и выберите вкладку «Социальные сети».

Вставьте код полученного API токена (1) и ID сообщества, откуда вы хотите подтягивать видео (2). Укажите название для блока (3) и подсказку ссылки на все видео (4). Сохраните параметры.

Неотмеченные цифрами настройки относятся к блоку «Вконтакте» на главной, который подгружает посты со стены сообщества.

Для корректной работы блока «Видеоотзывы» в настройках хостинга необходимо включить модуль allow_url_fopen. На картинке ниже показали пример для хостинга Reddock.

Rutube

Для подключения интеграция с Rutube укажите ID канала (1). Также вы можете выбрать сортировку видео (2), указать заголовок блока с видео (3) и подсказку ссылки на все видео (4).

Сохраните изменения.

Для корректной работы блока «Видеоотзывы» в настройках хостинга необходимо включить модуль allow_url_fopen. На картинке ниже показали пример для хостинга Reddock.

Дополнительные настройки

Вы можете внести корректировки в настройки видео через параметры компонента. Для этого включите режим правки.

Наведите курсор на блок с видео и нажмите на шестеренку.

Здесь вы можете выбрать источник видео, ID канала, сортировку видео и другие опции.

Описание курса

назадАктивация разделов каталога на главной странице Элементы каталога на главнойвперед

Элементы каталога на главной

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

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

Отобразить блок с товарами на главной можно двумя способами:

  • через виджет в публичной части,
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Элементы каталога» (1). Чтобы активировать блок, нажмите на переключатель (2).

Административная панель

Для активации блока с товарами на главной необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

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

Далее прокрутите бегунок до «Вид отображения элементов каталога». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадБлок «Видеоотзывы» на главной странице Настройки оформления блока «Элементы каталога»вперед

Настройки оформления блока «Элементы каталога»

Настроить вид отображения блока можно так, как этого требует ваш проект. Например, выбрать количество товаров в строке и др. Рассмотрим настройки подробнее.

Для блока с товарами можно установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Также задайте верхние и нижние отступы, которые отделяют блок от соседних (2) и включите отображение заголовка блока и табов (3).

Вот так выглядит блок с разделителем и серым фоном.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Рассмотрим отображение заголовка блока. При выключенном параметре исчезает не только заголовок, но и ссылка на каталог.

  • блок с заголовком;

  • блок без заголовка;

  • блок с табами;

  • блок без табов.

В дополнительных настройках типа блока можно задать отображение с обводкой (1), картинку в края (2), количество элементов в строке (3) и количество строк (4).

Обводку и картинку в края можно задать только при отключенной настройке «Серая подложка у товаров». Она находится по пути: виджет «Точная настройка» → Каталог.

  • элементы каталога с обводкой;

  • картинка в края;

  • количество элементов в строке: 4;

  • количество элементов в строке: 5;

  • количество строк: 2;

  • количество строк: 3.

Описание курса

назадЭлементы каталога на главной Активация товаров на главной страницевперед

Активация товаров на главной странице

Чтобы отобразить товары каталога на главной странице, в административной панели проделайте путь: Контент (1) → Каталог (aspro.premier) (2) → Каталог товаров (3).

В поле товара кликните на «Гамбургер» и нажмите «Изменить».

Далее отнесите товар к определенному списку специальных предложений, чтобы он отображался в соответствующем табе. Сохраните изменения.

Описание курса

назадНастройки оформления блока «Элементы каталога» Дополнительные настройки блока «Элементы каталога»вперед

Дополнительные настройки блока «Элементы каталога»

Блоку «Элементы каталога» на главной странице можно указать дополнительные настройки. Для этого в режиме правки наведите на область блока с элементами каталога и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения товаров каталога. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2).

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

На вкладке «Дополнительные настройки» можно назначить заголовок блока (1) и указать саму ссылку на все элементы (2).

Описание курса

назадАктивация товаров на главной странице Изменение порядка табов в блоке «Лучшие предложения» на главнойвперед

Изменение порядка табов в блоке «Лучшие предложения» на главной

В блоке «Лучшие предложения» на главной странице вы можете изменить порядок табов «Хит», «Советуем», «Новинка» и «Акция». Акцентируйте внимание посетителей на важных товарах и стимулируйте продажи.

Чтобы изменить порядок табов, в административной части сайта перейдите в Контент (1) → Инфоблоки (2) → Типы инфоблоков (3) → Каталог (aspro.premier) (4) → Каталог товаров (5).

На вкладке «Свойства» найдите поле «Наши предложения» и нажмите на три точки напротив него для перехода к детальному редактированию.

В блоке «Значение списка» для изменения порядка табов установите необходимую сортировку. Чем меньше число сортировки, тем раньше отобразится таб. Сохраните изменения.

Далее в настройках инфоблока еще раз сохраните изменения.

Теперь в блоке «Лучшие предложения» табы отображаются в том порядке, который вы установили.

Описание курса

назадДополнительные настройки блока «Элементы каталога» Баннеры с текстом на главнойвперед

Баннеры с текстом на главной

Баннеры с текстом на главной странице — небольшие кликабельные статичные изображения с текстом. Они выстраиваются в ровную плитку на любой ширине окна. Эти баннеры дают быстрый доступ к нужным страницам. Например, клиент при клике на баннер «Запчасти для мотоциклов» может сразу попасть в соответствующий раздел каталога и не тратить время на поиски этого раздела на сайте.

В Аспро: Премьер доступно 3 типа баннеров с текстом.

  1. С текстом внутри.

  1. С текстом внизу.

  1. В произвольном порядке.

Настройка баннеров с текстом в публичной части сайта

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

Настройка баннеров с текстом в административной части сайта

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В пункте «Порядок блоков на главной» найдите настройку «Баннеры с текстом» и задайте отступы.

На этой же странице ниже найдите пункт «Вид отображения блоков на главной» и задайте вид отображения блока баннеров с текстом. После изменения нажмите «Применить».

Содержание главы:

Описание курса

назадИзменение порядка табов в блоке «Лучшие предложения» на главной Настройки оформления блока «Баннеры с текстом»вперед

Настройки оформления блока «Баннеры с текстом»

Настроить вид отображения баннеров с текстом можно так, как этого требует ваш проект. Например, выбрать количество элементов в строке, ширину блока и др. Рассмотрим настройки подробнее.

Для блока баннеров с текстом можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). Настроить ширину (2), задать отступы (3), число баннеров в строке (4) и количество строк (5), сделать текст по центру баннера или слева (6). А также задать верхние и нижние отступы, которые отделяют блок от соседних (7).

Вот так выглядит блок с разделителем и серым фоном.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120;

  • неширокие баннеры;

  • широкие баннеры;

  • с отступами;

  • без отступов;

  • количество элементов в строке: 1;

  • количество элементов в строке: 2;

  • количество элементов в строке: 4;

  • количество строк: 1;

  • количество строк: 3;

  • текст баннера: по центру;

  • текст баннера: слева.

Описание курса

назадБаннеры с текстом на главной Настройка сортировки баннеров с текстомвперед

Настройка сортировки баннеров с текстом

Блоку «Баннеры с текстом» в публичной части можно указать дополнительные настройки. Для этого включите режим правки, наведите на область блока с баннерами и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения вопросов. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Нажмите «Сохранить».

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Баннеры с текстом» Создание и редактирование баннеров с текстомвперед

Создание и редактирование баннеров с текстом

Баннеры с текстом на главной странице — небольшие кликабельные статичные изображения с текстом. Они выстраиваются в ровную плитку на любой ширине окна. Эти баннеры дают быстрый доступ к нужным страницам. Например, клиент при клике на баннер «Товары для похода и кемпинга» может сразу попасть в соответствующий раздел каталога и не тратить время на поиски этого раздела на сайте.

Чтобы добавить или редактировать сами баннеры, переключитесь на административную часть сайта и перейдите в необходимый раздел: Контент (1) → Реклама (aspro.premier) (2) → Баннеры с текстом (3).

Чтобы добавить новый баннер, нажмите «Добавить элемент» (1). Чтобы отредактировать уже существующий, нажмите кнопку «Гамбургер» рядом с ним и выберите «Изменить» (2).

Рассмотрим подробнее настройки баннера. На вкладке «Элемент» доступны поля:

  1. Активность, чтобы баннер отображался.
  2. Название — обязательное для заполнения поле. Его содержимое отображается на сайте как заголовок баннера.
  3. Сортировка — укажите нужную сортировку, чтобы задать порядок отображения баннеров. Чем ниже число сортировки, тем раньше отображается баннер.
  4. Теги для баннера — укажите теги для баннера. Подробнее о настройке тегов читайте в отдельной статье.
  5. Ссылка — можно прописать URL (абсолютный или относительный) страницы. Это сделает баннер кликабельным — при нажатии на него пользователь перейдет на заданную страницу.
  6. Текст сверху — дополнительный заголовок к баннеру, который располагается над основным заголовком.

На вкладке «Анонс» можно загрузить картинку для баннера с текстом.

На вкладке «Разделы» отнесите баннер к одному из разделов, чтобы упорядочить баннеры по типам отображения.

Чтобы добавить или отредактировать баннер в публичной части, включите режим правки, наведите на область блока, где располагаются баннеры с текстом. Чтобы добавить новый баннер, выберите «Добавить баннер» (1). Нажмите на «Изменить баннер» (2), если хотите отредактировать баннер. Откроются те же вкладки, что мы рассматривали ранее.

Описание курса

назадНастройка сортировки баннеров с текстом Создание тегов в баннере с текстомвперед

Создание тегов в баннере с текстом

Для баннеров с текстом на главной странице вы можете создавать теги. Функционал позволяет вести пользователей на разные страницы каталога и разделы сайта, поскольку каждому тегу можно задать индивидуальную ссылку. Благодаря настройке вы также информируете клиента о товарах магазина. Располагайте теги на баннерах с текстом и ведите пользователей на целевые страницы сайта.

Чтобы создать теги, в административной части сайта, перейдите в Контент (1) → Highload-блоки (2) → AsproPremierBannersTags (3).

Для создания нового тега нажмите «Добавить запись» (1). А для редактирования существующего нажмите на «Гамбургер» напротив поля с тегом и нажмите «Изменить» (2).

В окне редактирования баннера доступны следующие поля:

  1. Название тега, которое будет отображаться на баннере
  2. XML_ID — идентификатор тега.
  3. Ссылка — укажите относительную ссылку, по которой пользователь перейдет при клике по тегу.
  4. Сортировка — задайте сортировку, чтобы определить порядок отображения тегов для баннера. Чем ниже число сортировки, тем раньше располагается тег.

Сохраните изменения.

Чтобы добавить тег на баннер, перейдите в Контент (1) → Реклама (aspro.premier) (2) → Баннеры с текстом (3) и зайдите в редактирование необходимого баннера.

На вкладке «Элемент» укажите необходимые теги в поле «Теги для баннера» и сохраните изменения.

Описание курса

назадСоздание и редактирование баннеров с текстом Баннеры с фоном на главнойвперед

Баннеры с фоном на главной

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

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

  1. Вертикальный.

  1. Горизонтальный.

  1. В произвольном порядке.

Выбрать подходящий тип можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Баннеры с фоном» (1). Раскройте пункт и выберите необходимый тип отображения баннеров с фоном (2).

Административная панель

Для выбора подходящего типа баннера перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

Поставьте галку в поле «Баннеры с фоном», чтобы активировать блок.

Ниже выберите необходимый вид отображения баннеров с фоном, а также установите нужную ширину, отступы и количество строк. Сохраните изменения.

Содержание главы:

Описание курса

назадСоздание тегов в баннере с текстом Настройки оформления блока «Баннеры с фоном»вперед

Настройки оформления блока «Баннеры с фоном»

Настроить вид отображения блока баннеров с фоном можно так, как этого требует ваш проект. Например, выбрать количество элементов в строке, ширину блока и др. Рассмотрим настройки подробнее.

Общие настройки блока

При любом типе отображения для блока с разделами каталога можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). А также задать верхние и нижние отступы, которые отделяют блок от соседних (2).

Вот так выглядит блок с разделителем и серым фоном.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Настройки по типам блока

Каждому типу можно настроить ширину баннеров и отступы между баннерами (1). Для первого и второго типа можно задать количество элементов в строке (2). Всем типам блока можно настроить количество строк (3). Первому типу отображения можно задать положение текста (4) и тегов (5).

  • неширокий баннер;

  • широкий баннер;

  • баннеры с отступами;

  • баннеры без отступов;

  • количество элементов в строке: 1;

  • количество элементов в строке: 4;

  • количество строк: 1;

  • количество строк: 2;

  • положение текста: слева;

  • положение текста: по центру;

  • положение тегов: сверху;

  • положение тегов: снизу.

Описание курса

назадБаннеры с фоном на главной Дополнительные настройки блока «Баннеры с фоном»вперед

Дополнительные настройки блока «Баннеры с фоном»

Блоку «Баннеры с фоном» в публичной части можно указать дополнительные настройки. Для этого включите режим правки, наведите на область блока с баннерами и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения вопросов. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Нажмите «Сохранить».

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Баннеры с фоном» Баннеры с фоном, создание и настройкавперед

Баннеры с фоном, создание и настройка

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

Чтобы добавить или редактировать сами баннеры, переключитесь на административную часть сайта и перейдите в необходимый раздел: Контент (1) → Реклама (aspro.premier) (2) → Баннеры с фоном (3). Далее выбираем нужную папку с интересующим нас типом отображения баннеров.

Чтобы добавить новый баннер, нажмите «Добавить элемент» (1). Чтобы отредактировать уже существующий, нажмите кнопку «Гамбургер» рядом с ним и выберите «Изменить» (2).

Рассмотрим подробнее настройки баннера. На вкладке «Элемент» доступны поля:

  1. Активность, чтобы баннер отображался.
  2. Название — обязательное для заполнения поле. Его содержимое отображается на сайте как заголовок баннера.
  3. Текст сверху — дополнительный заголовок к баннеру.
  4. Ссылка с баннера — можно прописать URL (абсолютный или относительный) страницы. Это сделает баннер кликабельным — при нажатии на него пользователь перейдет на заданную страницу.
  5. Тип баннера — определяет тип баннера, например, можно отнести конкретный баннер к типу большого баннера, с описанием или без описания.
  6. Цвет текста — можно установить темный или светлый цвет текста.
  7. Теги для баннера — укажите теги, которые будут размещаться на баннере.

На вкладке «Анонс» можно загрузить картинку и добавить описание. Если фоновая картинка будет не загружена, то баннер будет располагаться на сером фоне.

Чтобы добавить или отредактировать баннер в публичной части, включите режим правки, наведите на область блока, где располагаются баннеры картинками. Чтобы добавить новый баннер, выберите «Добавить баннер» (1). Нажмите на «Изменить баннер» (2), если хотите отредактировать баннер. Откроются те же вкладки, что мы рассматривали ранее.

Описание курса

назадДополнительные настройки блока «Баннеры с фоном» Блок «Акции» на главнойвперед

Блок «Акции» на главной

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

В Аспро: Премьер доступно 3 типа отображения блока с акциями.

  1. С текстом внизу.

  1. С текстом внутри.

  1. Списком.

Настроить блок можно двумя способами:

  • через виджет в публичной части,
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Акции» (1) и активируйте его через бегунок (2). Раскройте пункт и настройте отображение блока.

Административная панель

Для настройки отображения блока необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Акции», чтобы отобразить его на главной странице.

Далее прокрутите бегунок до «Вид отображения акций». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадБаннеры с фоном, создание и настройка Настройки оформления блока «Акции»вперед

Настройки оформления блока «Акции»

Настроить вид отображения блока можно так, как этого требует ваш проект. Например, задать отступы, выбрать количество элементов в строке и др. Рассмотрим настройки подробнее.

Для блока с акциями можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). Задать число баннеров в строке (2) и количество строк (3). А также задать верхние и нижние отступы, которые отделяют блок от соседних (4). Выбрать отображение заголовка блока и его позицию (5).

Вот так выглядит блок с разделителем и серым фоном.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

  • блок с заголовком;

  • положение заголовка: обычно;

  • положение заголовка: по центру;

  • количество элементов в строке: 2;

  • количество элементов в строке: 4;

  • количество строк: 1;

  • количество строк: 3;

  • кнопка «Загрузить еще».

Описание курса

назадБлок «Акции» на главной Дополнительные настройки блока «Акции»вперед

Дополнительные настройки блока «Акции»

Блоку «Акции» в публичной части можно указать дополнительные настройки. Для этого включите режим правки, наведите на область блока с баннерами и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения акций. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Нажмите «Сохранить».

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

На вкладке «Дополнительные настройки» можно назначить заголовок блока (1). Также можно подписать название ссылки на все элементы (2), указать саму ссылку (3), задать количество элементов в строке (4). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Акции» Активация акций на главной страницевперед

Активация акций на главной странице

Чтобы отобразить акции на главной странице, в административной части сайта перейдите в Контент (1) → Контент (aspro.premier) (2) → Акции (3) и откройте любую папку с акциями.

В поле акции кликните на «Гамбургер» и нажмите «Изменить».

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

Описание курса

назадДополнительные настройки блока «Акции» Баннеры картинками на главнойвперед

Баннеры картинками на главной

Баннеры картинками на главной странице — небольшие кликабельные статичные изображения. Они дают быстрый доступ к нужным страницам. Например, клиент при клике на баннер с игровой консолью может сразу попасть в карточку товара и купить эту модель. Не придется тратить время на поиск товара на сайте.

В Аспро: Премьер есть 4 вида отображения баннеров картинками.

1 в ряд

2 в ряд

3 в ряд

4 в ряд

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

Выбрать тип отображения баннеров картинками можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Баннеры картинками». Раскройте пункт и настройте отображение блока.

Административная панель

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

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

Далее пролистайте до «Вид отображения баннеров картинками», установите нужную ширину и отступы. Нажмите «Применить».

Содержание главы:

Описание курса

назадАктивация акций на главной странице Настройки оформления блока «Баннеры картинками»вперед

Настройки оформления блока «Баннеры картинками»

Настроить вид отображения блока баннеров с картинками можно так, как этого требует ваш проект. Рассмотрим настройки подробнее.

Для блока можно установить разделитель для указания границы блока и назначить специальный фон на весь блок (1). Настроить ширину баннеров, отступы при широком баннере и количество строк (2). А также отдельно задать верхние и нижние отступы (3).

Вот так выглядит блок с разделителем и серым фоном.

Рассмотрим, чем отличаются широкие и неширокие баннеры, с отступами и без отступов:

  • неширокий баннер;

  • широкий баннер;

  • баннер с отступами (при широком отображении);

  • баннер без отступов (при широком отображении);

  • количество строк: 1;

  • количество строк: 3.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего шесть интервалов: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Описание курса

назадБаннеры картинками на главной Баннеры картинками, создание и настройкавперед

Баннеры картинками, создание и настройка

Баннеры картинками на главной странице — небольшие кликабельные статичные изображения. Они дают быстрый доступ к нужным страницам. Например, клиент при клике на баннер с игровой консолью может сразу попасть в карточку товара и купить эту модель. Не придется тратить время на поиск товара на сайте.

Чтобы добавить или редактировать сами баннеры, переключитесь в административную часть сайта и перейдите в необходимый раздел: Контент (1) → Реклама (aspro.premier) (2) → Баннеры картинками (3).

Чтобы добавить новый баннер, нажмите «Добавить баннер» (1). Чтобы отредактировать уже существующий, нажмите кнопку «Гамбургер» рядом с ним и выберите «Изменить» (2).

Рассмотрим подробнее настройки баннера. На вкладке «Элемент» доступны поля:

  1. Активность, чтобы баннер отображался.
  2. Название — обязательное для заполнения поле.
  3. Регион — задайте регион показа баннера.
  4. Ссылка — пропишите URL (абсолютный или относительный) страницы. Это сделает баннер кликабельным — при нажатии на него пользователь перейдет на заданную страницу.

На вкладке «Анонс» загрузите картинку для баннера. Сохраните изменения.

Чтобы добавить или отредактировать баннер в публичной части, включите режим правки, наведите на область блока, где располагаются баннеры картинками. Чтобы добавить новый баннер, выберите «Добавить элемент» (1). Нажмите на «Изменить элемент» (2), если хотите отредактировать баннер. Откроются те же вкладки, что мы рассматривали ранее.

Описание курса

назадНастройки оформления блока «Баннеры картинками» Блок «Новости» на главной страницевперед

Блок «Новости» на главной странице

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

В Аспро: Премьер есть 2 типа отображения новостей.

  1. С картинками

  1. Без картинок

Настройка блока в публичной части

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

Настройка блока в административной части сайта

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Новости», чтобы отобразить его на главной странице.

Далее прокрутите бегунок до «Вид отображения новостей». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадБаннеры картинками, создание и настройка Настройки оформления блока «Новости» на главной страницевперед

Настройки оформления блока «Новости» на главной странице

Настроить вид отображения блока можно так, как этого требует ваш проект. Рассмотрим настройки подробнее.

Для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Настроить количество элементов в строке и число строк (2). Задать обводку и фон (3). Также можно задать верхние и нижние отступы, которые отделяют блок от соседних (4), и выбрать отображение заголовка блока (5).

Вот так выглядит блок с разделителем и серым фоном.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего шесть интервалов: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Рассмотрим отображение заголовка блока:

  • блок с заголовком;

  • блок без заголовка;

  • позиция заголовка: по центру.

Для блока можно установить 3, 4 или 5 элементов в одной строке:

  • количество элементов в строке: 3;

  • количество элементов в строке: 5.

Любому типу можно назначить отображение 1-3 строк или установить под новостями кнопку «Загрузить еще» для вызова строк вручную.

  • количество строк: 2;

  • кнопка «Загрузить еще».

Второму типу отображения можно задать обводку и фон.

  • новости с обводкой;

  • новости с фоном;

  • новости без фона.

Описание курса

назадБлок «Новости» на главной странице Дополнительные настройки блока «Новости»вперед

Дополнительные настройки блока «Новости»

Блоку «Новости» в публичной части можно указать дополнительные настройки. Для этого в режиме правки наведите на область блока с новостями и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения статей из блога. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2).

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

На вкладке «Дополнительные настройки» можно назначить заголовок блока (1). Подписать название ссылки на все элементы (2), указать саму ссылку (3) и выводить название раздела (4). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Новости» на главной странице Активация статей на главной страницевперед

Активация статей на главной странице

Чтобы отобразить новости на главной странице, в административной части сайта перейдите в Контент (1) → Контент (aspro.premier) (2) → Новости (3).

В поле с новостью кликните на «Гамбургер» и нажмите «Изменить».

Для вывода определенной новости на главной странице необходимо установить галку в поле «Показывать на главной». Сохраните изменения.

Описание курса

назадДополнительные настройки блока «Новости» Блок «Проекты» на главной страницевперед

Блок «Проекты» на главной странице

Начиная с версии 1.10.0, на главную страницу добавлен блок «Проекты». В нем можно демонстрировать реализованные кейсы. Добавляйте его, чтобы показать клиентам свою экспертность.

Доступно 2 типа отображения проектов на главной.

  1. С текстом внизу.

  1. С текстом внутри.

Настройка в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Проекты» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Настройка в административной части

Для выбора подходящего типа блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В блоке «Порядок блоков на главной» поставьте галку в поле «Проекты», чтобы отображать блок. Здесь также доступны настройки отображения.

Прокрутите бегунок до «Вид отображения проектов». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадАктивация статей на главной странице Настройки оформления блока «Проекты»вперед

Настройки оформления блока «Проекты»

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Задать количество элементов в строке и количество строк (2). Установить верхние и нижние отступы, которые отделяют блок от соседних, а также отобразить заголовок и его позицию (3).

Вот так выглядит блок с разделителем и серым фоном.

  • количество элементов в строке: 2;

  • количество элементов в строке: 3;

  • количество строк: 2;

  • кнопка «Загрузить еще».

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

Для первого типа отображения «С текстом внизу» можно отображать табы.

Описание курса

назадБлок «Проекты» на главной странице Дополнительные настройки блока «Проекты»вперед

Дополнительные настройки блока «Проекты»

В публичной части сайта вы можете:

  • указывать количество элементов в блоке;
  • изменять заголовок блока и ссылку;
  • задавать сортировку для вывода элементов.

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

В параметрах компонента можно задать сортировку для вывода элементов.

Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Иногда значения элементов совпадают по первому полю. Тогда по второму полю будет решено, какой элемент отобразить раньше.

Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

Также можно изменить заголовок и ссылку блока.

Выберите «Дополнительные настройки» → Измените заголовок блока (1) → Отредактируйте ссылку на все элементы (2) → Включите отображение текста над заголовком (3). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Проекты» Блок «О компании» на главной страницевперед

Блок «О компании» на главной странице

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

В Аспро: Премьер есть 3 типа отображения блока о компании.

  1. С текстом и картинкой

  1. С текстом и картинкой вертикально

  1. С текстом и картинкой без обводки

Настройка отображения блока в публичной части сайта

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Блок о компании». Раскройте пункт и настройте отображение блока.

Настройка отображения блока в административной части сайта

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

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

Далее прокрутите бегунок до «Вид отображения о компании». Настройте отображение и нажмите «Применить».

Содержание главы:

Описание курса

назадДополнительные настройки блока «Проекты» Настройки оформления блока «О компании»вперед

Настройки оформления блока «О компании»

Настроить вид отображения блока можно так, как этого требует ваш проект. Рассмотрим настройки подробнее.

В настройках вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Задать положение картинки для первого типа (2). А для второго типа — активировать отображение картинки и разместить текст по центру (3). Наконец для третьего типа — задать размер картинки (4).

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

Вот так выглядит блок с разделителем и серым фоном.

Вы можете включить отображение картинки и задать обводку в блоке:

  • с картинкой;

  • без картинки;

  • с обводкой;

  • без обводки;

  • положение картинки: справа;

  • положение картинки: слева;

  • текст расположен по центру;

  • текст расположен не по центру.

  • большой размер картинки;

  • маленький размер картинки.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120.

Описание курса

назадБлок «О компании» на главной странице Редактирование блока «О компании» на главной страницевперед

Редактирование блока «О компании» на главной странице

Информация для блока «О компании» заполняется и редактируется в элементе инфоблока. Если вы используете региональность, заполнить текст и заголовок блока необходимо в инфоблоке регионов.

Редактирование блока в публичной части сайта

Включите «Режим правки», наведите курсор на область блока и нажмите кнопку «Изменить элемент».

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

  1. Активность, чтобы блок отображался.
  2. Название — обязательное для заполнения поле.
  3. Картинка — загрузите картинку для отображения в блоке.
  4. Заголовок — задайте заголовок для всего блока.
  5. Текст кнопки подробнее — подпишите кнопку, которая будет ссылаться на заданную вами страницу сайта.
  6. Ссылка — назначьте кнопке ссылку на определенную страницу.
  7. Описание — задайте текст блоку. Если картинка загружена, текст располагается под заголовком. А если изображение отсутствует, то текст отображается справа от заголовка.

Редактирование блока в административной части сайта

Перейдите в Контент (1) → Контент (aspro.premier) (2) → О компании (3).

В окне редактирования блока откроются те же вкладки, что мы рассматривали ранее.

Описание курса

назадНастройки оформления блока «О компании» Блок «Бренды» на главной страницевперед

Блок «Бренды» на главной странице

На главной странице вы можете добавить блок «Бренды». При клике на логотип вы попадаете в список товаров определенного бренда. Доступно 3 типа отображения блока «Бренды» на главной. Рассмотрим каждый из них.

  1. Плиткой.

  1. Каруселью.

  1. С картинкой.

Настройка в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Бренды» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Настройка в административной части

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В блоке «Порядок блоков на главной» поставьте галку в поле «Бренды», чтобы отображать блок. Здесь также доступны настройки отображения.

Прокрутите бегунок до «Вид отображения производителей». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадРедактирование блока «О компании» на главной странице Настройки оформления блока «Бренды»вперед

Настройки оформления блока «Бренды»

Настроить вид отображения блока можно исходя из ваших предпочтений. Рассмотрим настройки подробнее.

При любом типе отображения можно установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Установить обводку и фон для брендов в блоке (2). Для первого и третьего типа отображения задать количество строк (3). И только для третьего типа — количество элементов строке (4). Еще можно установить верхние и нижние отступы, которые отделяют блок от соседних (5), подключить заголовок и его позицию (6).

Вот так выглядит блок с разделителем и серым фоном.

  • бренды с обводкой;

  • бренды без обводки;

  • бренды с фоном;

  • бренды без фона;

  • количество строк: 2;

  • кнопка «Загрузить еще»;

  • количество элементов в строке: 4;

  • количество элементов в строке: 6.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний отступ: 0, нижний: 0;

  • верхний отступ: 120, нижний: 120.

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

  • блок с заголовком с обычным расположением;

  • блок с заголовком по центру.

Описание курса

назадБлок «Бренды» на главной странице Дополнительные настройки блока «Бренды»вперед

Дополнительные настройки блока «Бренды»

В публичной части сайта вы можете:

  • указывать количество элементов в блоке;
  • изменять заголовок блока и ссылку;
  • задавать сортировку для вывода элементов.

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

В параметрах компонента списка новостей перейдите в основные параметры. В поле «Количество новостей на странице» задайте нужное число и сохраните изменения.

В этом же окне можно задать сортировку для вывода элементов.

Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Иногда значения элементов совпадают по первому полю. Тогда по второму полю будет решено, какой элемент отобразить раньше.

Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

Также в окне «Список новостей» можно изменить заголовок и ссылку блока.

Выберите «Дополнительные настройки» → Измените заголовок блока (1) → Отредактируйте ссылку на все бренды (2) → Сохраните изменения.

Описание курса

назадНастройки оформления блока «Бренды» Активация брендов на главнойвперед

Активация брендов на главной

Чтобы активировать бренды на главной странице, в административной части сайта перейдите в Контент (1) → Контент (aspro.premier) (2) → Бренды (3).

Перейдите в редактирование элемента. Для этого в строке кликните на «Гамбургер», затем на «Изменить».

В окне редактирования бренда поставьте галку в поле «Показывать на главной» и сохраните изменения.

Описание курса

назадДополнительные настройки блока «Бренды» Настройки анимации и слайд-шоу в блоке «Бренды»вперед

Настройки анимации и слайд-шоу в блоке «Бренды»

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

Чтобы настраивать скорость автоматической прокрутки или управлять скоростью при переключении, в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

Пролистайте до блока «Бренды». Чтобы бренды перелистывались не так быстро либо не так медленно, задайте скорость слайдшоу баннеров (1). Чем выше значение в миллисекундах, тем быстрее баннеры будут переключаться.

Установите скорость анимации брендов (2), чтобы задать параметр перехода, который влияет на быстроту и медленность переключения одного бренда к другому. Чем ниже значение, тем плавней произойдет переход. После внесения изменений нажмите «Применить».

Описание курса

назадАктивация брендов на главной Блог на главной страницевперед

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

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

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

1) Плиткой

2) С большим блоком

Выбрать подходящий тип можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Блог» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Административная панель

Для выбора подходящего типа блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Блог», чтобы отобразить его на главной странице.

Далее прокрутите бегунок до «Вид отображения блога». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадНастройки анимации и слайд-шоу в блоке «Бренды» Настройки оформления блога на главной страницевперед

Настройки оформления блога на главной странице

Настроить вид отображения блока можно так, как этого требует ваш проект. Например, задать обводку, отступы и др. Рассмотрим настройки подробнее.

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Для первого типа отображения можно задать обводку и количество элементов в строке (2). Для всех типов можно установить количество строк (3), верхние и нижние отступы, которые отделяют блок от соседних, а также выбрать отображение заголовка блока и его позицию (4).

Вот так выглядит блок с разделителем и серым фоном.

  • блок с обводкой;

  • блок без обводки;

  • количество элементов: 3;

  • количество элементов: 5;

  • количество строк: 2;

  • кнопка «Загрузить еще».

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120;

  • обычная позиция заголовка;

  • позиция заголовка: по центру.

Описание курса

назадБлог на главной странице Дополнительные настройки блока «Блог»вперед

Дополнительные настройки блока «Блог»

Блоку с блогом в публичной части можно указать дополнительные настройки. Для этого в режиме правки наведите на область блока с блогом и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения статей из блога. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2).

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

На вкладке «Дополнительные настройки» можно назначить заголовок блока (1). Также можно подписать подсказку ссылки на все элементы (2), указать саму ссылку (3) и включить отображение текста под заголовком (4). Сохраните изменения.

Описание курса

назадНастройки оформления блога на главной странице Активация статей из блога на главной страницевперед

Активация статей из блога на главной странице

Чтобы отобразить статьи из блога на главной странице, в административной части сайта перейдите в Контент (1) → Контент (aspro.premier) (2) → Блог (3) и откройте любую папку со статьями.

В поле статьи кликните на «Гамбургер» и нажмите «Изменить».

Для вывода определенной статьи на главной странице необходимо установить галку в поле «Показывать на главной». Сохраните изменения.

Описание курса

назадДополнительные настройки блока «Блог» Блок «Образы» на главной страницевперед

Блок «Образы» на главной странице

На главной странице вы можете добавить блок «Образы». Чаще всего наборы образов используют для презентации одежды, обуви и аксессуаров. Но в виде лукбуков можно собирать и другие образы. Добавьте варианты интерьера тем, кто хочет приобрести жилье. Разместите фотосессию на мотобайке любителям экстрима. Загрузите живые фотографии с вечеринки в интернет-магазине настольных игр. Покажите настоящие эмоции!

  1. Списком.

  1. С текстом внизу.

  1. С текстом внутри.

Настройка в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Образы» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Настройка в административной части

Для выбора подходящего типа блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В блоке «Порядок блоков на главной» поставьте галку в поле «Образы», чтобы отображать блок. Здесь также доступны настройки отображения.

Прокрутите бегунок до «Вид отображения образов». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадАктивация статей из блога на главной странице Настройки оформления блока «Образы»вперед

Настройки оформления блока «Образы»

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Для второго и третьего типа отображения можно задать количество элементов в строке и количество строк (2). Для всех типов можно установить верхние и нижние отступы, которые отделяют блок от соседних, а также отобразить заголовок и табы (3).

Вот так выглядит блок с разделителем и серым фоном.

  • количество элементов: 2;

  • количество элементов: 4;

  • количество строк: 2;

  • кнопка «Загрузить еще».

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок:

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120;

  • показывать табы;

  • не показывать табы.

Описание курса

назадБлок «Образы» на главной странице Дополнительные настройки блока «Образы»вперед

Дополнительные настройки блока «Образы»

В публичной части сайта вы можете:

  • указывать количество элементов в блоке;
  • изменять заголовок блока и ссылку;
  • задавать сортировку для вывода элементов.

Включите режим правки и наведите курсор на область с образами. Нажмите на шестеренку, чтобы редактировать параметры компонента списка образов.

В параметрах компонента перейдите во вкладку «Основные параметры». В поле «Количество элементов на странице» задайте нужное число и сохраните изменения.

В этом же окне можно задать сортировку для вывода элементов.

Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Иногда значения элементов совпадают по первому полю. Тогда по второму полю будет решено, какой элемент отобразить раньше.

Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

Также можно изменить заголовок и ссылку блока.

Выберите «Дополнительные настройки» → Измените заголовок блока (1) → Отредактируйте ссылку на все элементы (2) → Включите отображение текста над заголовком (3). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Образы» Активация образов на главнойвперед

Активация образов на главной

Чтобы активировать образы на главной странице, в административной части сайта перейдите в Контент (1) → Каталог (aspro.premier) (2) → Образы (3).

Перейдите в редактирование элемента. Для этого в строке кликните на «Гамбургер», затем на «Изменить».

В окне редактирования образа поставьте галку в поле «Показывать на главной» и сохраните изменения.

Описание курса

назадДополнительные настройки блока «Образы» Блок «Коллекции» на главной страницевперед

Блок «Коллекции» на главной странице

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

Доступно 2 типа отображения коллекций на главной.

  1. С текстом внутри.

  1. Списком.

Настройка в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Коллекции» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Настройка в административной части

Для выбора подходящего типа блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В блоке «Порядок блоков на главной» поставьте галку в поле «Коллекции», чтобы отображать блок. Здесь также доступны настройки отображения.

Прокрутите бегунок до «Вид отображения коллекций». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадАктивация образов на главной Настройки оформления блока «Коллекции»вперед

Настройки оформления блока «Коллекции»

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Задать количество элементов в строке и количество строк (2). Установить верхние и нижние отступы, которые отделяют блок от соседних, а также отобразить заголовок и его позицию (3).

Вот так выглядит блок с разделителем и серым фоном.

  • количество элементов в строке: 2;

  • количество элементов в строке: 3;

  • количество строк: 2;

  • кнопка «Загрузить еще».

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 12, 24, 40, 80, 120. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 120, нижний: 120;

  • обычная позиция заголовка;

  • позиция заголовка: по центру.

Описание курса

назадБлок «Коллекции» на главной странице Дополнительные настройки блока «Коллекции»вперед

Дополнительные настройки блока «Коллекции»

В публичной части сайта вы можете:

  • указывать количество элементов в блоке;
  • изменять заголовок блока и ссылку;
  • задавать сортировку для вывода элементов.

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

В параметрах компонента перейдите во вкладку «Основные параметры». В поле «Количество элементов на странице» задайте нужное число и сохраните изменения.

В этом же окне можно задать сортировку для вывода элементов.

Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2). Иногда значения элементов совпадают по первому полю. Тогда по второму полю будет решено, какой элемент отобразить раньше.

Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

Также можно изменить заголовок и ссылку блока.

Выберите «Дополнительные настройки» → Измените заголовок блока (1) → Отредактируйте ссылку на все элементы (2) → Включите отображение текста над заголовком (3). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Коллекции» Блок «Отзывы» на главной страницевперед

Блок «Отзывы» на главной странице

На главной странице вы можете отобразить отзывы компании. Добавляйте блок с отзывами, чтобы посетители сайта могли сразу прочитать обратную связь о вашей работе.

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

  1. 1 в ряд.

  1. Несколько в ряд.

Выбрать подходящий тип можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «Отзывы» (1). Раскройте пункт и выберите необходимый тип отображения блока (2).

Административная панель

Для выбора подходящего типа блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

В разделе «Главная» поставьте галку напротив пункта «Отзывы», чтобы отобразить его на главной странице.

Далее прокрутите бегунок до «Вид отображения отзывов». Выберите нужное и нажмите «Применить».

Содержание главы:

Описание курса

назадДополнительные настройки блока «Коллекции» Настройки оформления блока «Отзывы» на главнойвперед

Настройки оформления блока «Отзывы» на главной

Настроить вид отображения блока можно так, как этого требует ваш проект. Например, выбрать тип, задать обводку и др. Рассмотрим настройки подробнее.

При любом типе отображения для блока вы можете установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Задать обводку и фон для отзывов (2). Второму типу отображения можно настроить количество элементов в строке (3). Также для любого типа можно установить верхние и нижние отступы, которые отделяют блок от соседних, а еще есть возможность выбрать отображение заголовка блока и его позицию (4).

Вот так выглядит блок с разделителем и серым фоном.

  • отзывы с обводкой;

  • отзывы без обводки;

  • отзывы с фоном;

  • отзывы без фона;

  • количество элементов в строке: 3.

Верхние и нижние отступы задаются по конкретным значениям и определяют, насколько блок будет отдален от соседних блоков. Всего четыре интервала: 0, 40, 80, 130. Чем больше значение, тем удаленнее блок.

  • верхний блок: 0, нижний: 0;

  • верхний блок: 80, нижний: 80.

  • обычная позиция заголовка;

  • позиция заголовка: по центру.

Описание курса

назадБлок «Отзывы» на главной странице Дополнительные настройки блока «Отзывы»вперед

Дополнительные настройки блока «Отзывы»

Блоку «Отзывы» в публичной части можно указать дополнительные настройки. Для этого в режиме правки наведите на область блока с отзывами и нажмите на шестеренку.

На вкладке «Источник данных» можно задать порядок отображения отзывов. Перейдите в раздел «Источник данных» → Задайте поле для первой сортировки (1) → Укажите направление первой сортировки (2).

Иногда значения элементов совпадают по первому полю. Тогда какой элемент отобразить раньше, будет решено по второму полю. Задайте поле для второй сортировки (3) → Укажите направление второй сортировки (4).

На вкладке «Дополнительные настройки» можно назначить заголовок блока (1) и дополнительный заголовок над ним (2). Также можно подписать заголовок на все элементы (3), указать на них ссылку (4) и включить отображение текста под заголовком (5). Сохраните изменения.

Описание курса

назадНастройки оформления блока «Отзывы» на главной Активация отзывов на главнойвперед

Активация отзывов на главной

Чтобы отобразить отзывы на главной странице, в административной части сайта перейдите в Контент (1) → Контент (aspro.premier) (2) → Отзывы клиентов (3).

В поле отзыва кликните на «Гамбургер» и нажмите «Изменить».

Для вывода определенного отзыва на главной странице необходимо установить галку в поле «Показывать на главной». Сохраните изменения.

Описание курса

назадДополнительные настройки блока «Отзывы» Блок «ВКонтакте» на главнойвперед

Блок «ВКонтакте» на главной

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

Картинка для блока будет браться из ленты «ВКонтакте». Поле, в которое она будет вставляться, имеет соотношение сторон 16:9.

Чтобы виджет заработал, нужно получить токен API. Сделать это можно через создание своего приложения для «ВКонтакте».

Для начала зайдите на https://id.vk.com/about/business/go/ и нажмите «Добавить приложение».

Выберите, кем будет управляться приложение. Нажмите «Далее».

Затем заполните свои данные. Эта информация не будет отображаться публично. Согласитесь с офертой и обработкой персональных данных. Нажмите «Создать аккаунт».

Заполните название приложения (1) и выберите платформу: Web (2). Нажмите «Далее».

В поле «Базовый домен» напишите адрес вашего сайта без протокола (1). В поле «Доверенный Redirect URL» вставьте: https://oauth.vk.com/blank.html (2). Нажмите «Готово».

С начала 2025 года появился новый способ получения токена VK при создании нового приложения. Теперь нужно указывать другой доверенный Redirect URL: https://ДОМЕН/bitrix/tools/КОД_РЕШЕНИЯ/vk_oauth.php

Пример для демоверсии Аспро: Премьер: https://premier-demo.ru/bitrix/tools/aspro.premier/vk_oauth.php

Для старого приложения, в котором уже есть работающий токен, ничего менять не нужно.

Введите код из push-уведомления для подтверждения.

После этого вы получите ID приложения. Оно будет доступно в соответствующем поле.

Далее переходим к нашему сайту, в его административную часть. Проходим следующий путь:

Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Социальные сети (4).

В пункте «VK» доступны следующие поля:

  1. Способ обращения к API — вы можете выбрать новый вариант через VK ID или устаревший через OAuth. Мы рекомендуем первый вариант — VK ID.
  2. ID приложения — введите ID вашего приложения ВКонтакте, который вы получили ранее. Если у вас есть API-токен, в предыдущем поле выберите вариант «OAuth (устаревший)» и вставьте имеющийся токен.
  3. ID сообщества ВКонтакте — для его получения достаточно открыть любую фотографию сообщества или скопировать ссылку на пост. Тогда в URL-адресе появится часть с ID сообщества. Например, ID сообщества Аспро — 26208053.
  4. Название для блока.
  5. Текст ссылки на все записи.
  6. Размер отображаемого текста — в символах.
  7. Заголовок блока с видео.
  8. Ссылки на все видео.

Поле «Размер отображаемого текста» позволяет задать количество символов, которое получит сайт для каждого поста. При этом количество отображаемых символов в блоке на главной будет отличаться от максимально доступного из-за ограничений по высоте. Например, у блока с 4 элементами в ряд помещается меньше символов, чем у 3 элементов в ряд. Количество символов может меняться и от разрешения экрана, но первые три строки всегда отображаются.

ID сообщества по умолчанию находится в ссылке. Если же у вашего сообщества VK уникальный URL, откройте любой пост на стене.

Затем скопируйте ID сообщества из URL-адреса поста.

Сайт подключен к API ВКонтакте. Теперь нужно включить блок. Находясь в настройках в административной части, переходим во вкладку «Главная».

Находим пункт «ВКонтакте» и ставим галку. Здесь же можно настроить отступы и позицию заголовка. Подробнее об этом расскажем в конце статьи.

Чуть ниже на этой же странице найдите поле «Вид отображения блока ВКонтакте», выберите подходящий тип и нажмите «Применить».

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

VK убрали из приложения возможность запрашивать доступы к видео напрямую. Теперь это можно делать только через техподдержку VK.

Включить блок можно не только через административную, но и публичную часть сайта. Для этого перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите пункт «ВКонтакте» (1). Раскройте пункт и настройте вид отображения блока (2).

Настройка отображения блока

В Аспро: Премьер есть 2 типа отображения блока.

  1. С текстом внизу.

  1. Квадратная картинка.

Для блока «ВКонтакте» можно установить разделитель для указания границы блока и назначить серый фон на весь блок вместо белого (1). Для первого типа отображения можно задать обводку (2) и фон (3). Второму типу блока можно задать ширину (4) и отступы (5). Любому типу блока можно задать количество элементов в строке (6). Установить верхние и нижние отступы, которые отделяют блок от соседних, а также можно настроить отображение заголовка и его позицию (7).

  • с обводкой;

  • без обводки;

  • с фоном;

  • без фона;

  • широкий;

  • неширокий;

  • с отступами;

  • без отступов;

  • количество элементов в строке: 3;

  • количество элементов в строке: 4.

Настройка периода обновления постов


В параметрах компонента вы можете выбирать период обновления постов в блоке. Мы не рекомендуем отключать кеширование и обновлять посты раньше, чем раз в час.

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

На вкладке «Настройки кеширования» включите кеширование с необходимым типом (1) и задайте период обновления в секундах (2). Сохраните изменения.

Описание курса

назадАктивация отзывов на главной Блок «YouTube» на главной страницевперед

Блок «YouTube» на главной странице

На главной странице можно отобразить блок «Видеоотзывы». Это надежный способ наглядно продемонстрировать счастливых клиентов и результаты собственной работы. Улучшайте имидж компании и повышайте лояльность посетителей.

Ролики подгружаются из YouTube, а также с сервиса VK Видео и Rutube из плейлиста или с главной страницы канала. Также вы можете переименовать блок и выводить туда любые видео на ваше усмотрение. Например, обзоры своих проектов.

Чтобы настроить блок с видео, в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → YouTube (4).

Для подключения роликов с канала потребуется API Token YouTube.

Чтобы его получить, зайдите на специальный сервис от Google. Выберите пункт YouTube Data API v3.

Нажмите кнопку ENABLE.

После этого откроется новое окно, в котором нужно нажать на кнопку CREATE CREDENTIALS.

В поле Select an API выберите YouTube Data API v3.

На выбор появится два пункта. Отметьте Public data и нажмите NEXT.

Скопируйте ключ из поля API Key и нажмите Done.

Полученный ключ вставьте в соответствующее поле в административной части сайта.

После этого укажите ID канала (1), если хотите брать видео напрямую с YouTube-страницы. Укажите ID плейлиста (2), если хотите использовать видео из плейлиста. Также здесь вы можете задать заголовок блока (3) и указать подсказку ссылки на все видео (4).

Сохраните изменения.

Для корректной работы блока «Видеоотзывы» в настройках хостинга необходимо включить модуль allow_url_fopen. На картинке ниже показали пример для хостинга Reddock.

Настройки оформления блока

Вы можете настроить оформление блока «YouTube» через публичную и административную часть сайта.

Для настройки через публичную часть перейдите в виджет «Точная настройка». Затем перейдите на вкладку «Главная» и раскройте пункт «YouTube».

Здесь вы можете задать разделитель и серый фон (1), задать количество элементов в строке (2), задать отступы блока (3), подключить заголовок и выбрать его позицию (4).

Для настройки через административную часть перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

Здесь вы можете подключить блок «YouTube» на главной.

Ниже вы можете настроить отображение блока «YouTube». Чтобы сохранить изменения, нажмите «Применить».

Дополнительные настройки

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

Здесь вы можете выбрать ID канала, сортировку видео и другие опции.

Описание курса

назадБлок «ВКонтакте» на главной Дополнительные блоки на главнойвперед

Дополнительные блоки на главной

В Аспро: Премьер доступно добавление дополнительных блоков на главную страницу. Если вы хотите отдельно вынести какую-либо важную информацию, например, о компании, событиях или услугах, создайте дополнительный блок и разместите необходимый текст и баннеры на нем.

Создавайте произвольные блоки на главной, чтобы показать все преимущества. Берите за основу любой из готовых блоков. Скопированный блок сохранит настройки, появится в виджете и будет получать улучшения из обновлений. Вы также можете использовать блок с главной для произвольной верстки. Он будет отображаться в виджете для управления: перемещения или отключения.

Добавить и редактировать дополнительные блоки можно в административной части сайта. Для этого перейдите в Контент (1) → Дополнительные блоки на главной (aspro.premier) (2) → Дополнительные блоки на главной (3).

В инфоблок «Дополнительные блоки на главной» можно добавлять разделы, которые будут соответствовать блоку главной страницы в виджете и админке. Здесь можно добавить новый раздел (1), а также редактировать (2) и удалять (3) существующие при нажатии на «Гамбургер».

В этих разделах можно создавать элементы, которые будут соответствовать типам отображения дополнительного блока. Здесь можно добавить новый элемент (1). Когда элементы уже созданы, их можно изменить (2), деактивировать (3) и удалить (4) при нажатии на «Гамбургер».

Рассмотрим процесс на примере создания дополнительного блока на основе «О компании». Сначала необходимо скопировать блок в структуре сайта. Для этого перейдите в Контент (1) → Структура сайта (2) → Файлы и папки (3) → include (4) → mainpage (5) → components (6).

Скопируем существующую папку с файлами блока «О компании». Для этого нажмите на «Гамбургер» напротив нее и выберите «Копировать». Папка скопируется со всеми содержимыми файлами.

Переименуйте папку, например, в custom_company. Для этого нажмите на «Гамбургер» напротив скопированной папки и выберите «Переименовать». Название папки будет нашим символьным кодом при создании раздела для дополнительных блоков. Скопируйте это название, оно нам понадобится в дальнейшем.

Для корректной работы дополнительного блока название файла должно содержать именно нижнее подчеркивание — без тире и пробелов.

Название обязательно должно начинаться с «custom_», иначе будут ошибки.

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

Чтобы текст блока был всегда одинаковый, необходимо отключить зависимость от региональности. Для этого в параметре компонента дополнительного блока очистите значение в поле «Регион». Сохраните изменения.

Теперь подготовим новый блок в виджете. Вернемся в раздел «Дополнительные блоки на главной» и выберем «Добавить раздел» при нажатии на стрелку.

На вкладке «Раздел» заполним следующие поля:

  1. Раздел активен — включает активность раздела.
  2. Родительский раздел — задает уровень вложенности раздела.
  3. Название — устанавливает название для блока, которое будет отображаться в виджете и админке.

На вкладке «Дополнительно» вставьте символьный код, который ранее копировали из названия переименованной папки в структуре сайта. В нашем случае — это custom_company. Сохраните изменения.

После добавления раздела создадим тип отображения дополнительного блока. Для этого перейдите в список элементов раздела и нажмите «Добавить элемент».

При добавлении типа отображения дополнительного блока вам потребуется заполнить следующие поля на вкладке «Элемент»:

  1. Активность — включает отображение типа в настройках.
  2. Период активности — задает время показа типа блока.
  3. Название — устанавливает название для типа, которое будет отображаться в виджете и административной части сайта.
  4. Символьный код — кодом для элемента выступает название определенного файла из скопированной ранее папки. Например, в папке custom_company мы переименовывали несколько файлов. Именно они нас интересуют. Все настройки блока будут взяты из указанного файла.
  5. Сортировка — задайте сортировку для типа отображения дополнительного блока.

На вкладке «Анонс» укажите картинку для отображения блока в виджете «Точная настройка».

На вкладке «Разделы» присвойте тип отображения необходимому разделу и сохраните изменения.

Перейдите в публичную часть сайта. Теперь в виджете настроек на вкладке «Главная» появился наш дополнительный блок. Активируйте его, тогда он появится на главной странице.

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

Например, чтобы изменить содержимое дополнительного блока «О компании», перейдите в Контент (1) → Контент (aspro.premier) (2) → О компании (3).

Скопируйте элемент с контентом оригинального блока. Для этого нажмите на «Гамбургер» и выберите «Копировать».

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

В окне редактирования элемента измените название и символьный код, чтобы эти параметры не совпадали с оригинальным блоком. Скопируйте измененный символьный код, он понадобится для настройки связи между элементом и дополнительным блоком. Настройте содержимое блока, добавьте свой текст, картинки и видео.

Теперь нужно связать созданный элемент с типом отображения блока на главной странице. Перейдите в публичную часть сайта. Включите режим правки, наведите курсор на область дополнительного блока и нажмите на шестеренку.

На вкладке «Основные параметры» найдите пункт «Код новости» и вставьте в поле скопированный символьный код. Теперь весь контент из созданного элемента отображается в дополнительном блоке на главной странице. Сохраните изменения.

Теперь, когда мы настроили содержимое и связали элемент с типом отображения, наш дополнительный блок стал уникальным.

Содержание главы:

Описание курса

назадБлок «YouTube» на главной странице Настройки оформления дополнительного блокавперед

Настройки оформления дополнительного блока

Настроить дополнительный блок можно тремя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Главная». В списке блоков главной страницы найдите созданный вами блок. Он должен идти сразу после стандартных блоков, но его можно перетаскивать курсором в другие части главной страницы. В настройках также можно включить отображение блока, установить разделитель для указания границы блока и назначить серый фон на весь блок (1). Выберите необходимый тип отображения блока, которые вы ранее назначали (2). Задайте верхние и нижние отступы, которые отделяют блок от соседних (3).

Административная часть сайта

Для настройки дополнительного блока перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Главная (4).

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

Описание курса

назадДополнительные блоки на главной Настройка пользовательского блока с товарами по фильтрувперед

Настройка пользовательского блока с товарами по фильтру

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

Чтобы добавить пользовательские блоки с товарами, в административной части сайта перейдите в Контент (1) → Дополнительные блоки на главной (aspro.premier) (2) → Дополнительные блоки на главной (3). В разделе уже будут созданы три дополнительных блока с товарами. Вы можете воспользоваться готовыми или создать новые.

В инфоблок «Дополнительные блоки на главной» можно добавлять разделы, которые будут соответствовать блоку главной страницы в виджете и админке. Здесь можно добавить новый раздел (1), а также редактировать (2) и удалять (3) существующие при нажатии на «Гамбургер».

В этих разделах можно создавать элементы, которые будут соответствовать типам отображения дополнительного блока. Здесь можно добавить новый элемент (1). Когда элементы уже созданы, их можно изменить (2), деактивировать (3) и удалить (4) при нажатии на «Гамбургер».

Рассмотрим процесс на примере создания дополнительного блока на основе «Каталог». Сначала необходимо скопировать блок в структуре сайта. Для этого перейдите в Контент (1) → Структура сайта (2) → Файлы и папки (3) → include (4) → mainpage (5) → components (6).

Скопируем существующую папку с файлами блока «Каталог» — catalog_tab. Для этого нажмите на «Гамбургер» напротив нее и выберите «Копировать» (1). Папка скопируется со всеми содержимыми файлами. Если вы используете готовые пользовательские блоки, то они представлены в папках custom_catalog, custom_catalog_2, custom_catalog_3 (2).

Переименуйте папку, например, в custom_catalog_4. Для этого нажмите на «Гамбургер» напротив скопированной папки и выберите «Переименовать». Название папки будет нашим символьным кодом при создании раздела для пользовательских блоков. Скопируйте это название, оно нам понадобится в дальнейшем.

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

Теперь подготовим новый блок в виджете. Вернемся в раздел «Дополнительные блоки на главной» и выберем «Добавить раздел» при нажатии на стрелку (1). Если вы хотите хотите воспользоваться готовыми пользовательскими блоками, нажмите на «Гамбургер» напротив необходимого раздела и нажмите «Изменить» (2).

В окне редактирования задайте активность раздела (1), уровень вложенности (2) и название (3), которое будет отображаться в виджете «Точная настройка».

На вкладке «Дополнительно» вставьте символьный код, который ранее копировали из названия переименованной папки в структуре сайта. В нашем случае — это custom_catalog_4. Сохраните изменения.

После добавления раздела создадим тип отображения дополнительного блока. Для этого перейдите в список элементов раздела и нажмите «Добавить блок».

При добавлении типа отображения дополнительного блока вам потребуется заполнить следующие поля на вкладке «Элемент»:

  1. Активность — включает отображение типа в настройках.
  2. Период активности — задает время показа типа блока.
  3. Название — устанавливает название для типа, которое будет отображаться в виджете и административной части сайта.
  4. Символьный код — кодом для элемента выступает название определенного файла из скопированной ранее папки. Например, в папке custom_catalog_4 мы переименовывали несколько файлов. Именно они нас интересуют. Все настройки блока будут взяты из указанного файла.
  5. Сортировка — задайте сортировку для типа отображения дополнительного блока.

На вкладке «Анонс» по желанию укажите картинку для отображения блока в виджете «Точная настройка».

На вкладке «Разделы» присвойте тип отображения необходимому разделу и сохраните изменения.

Перейдите в публичную часть сайта. Теперь в виджете настроек на вкладке «Главная» появился наш дополнительный блок. Активируйте его, тогда он появится на главной странице.

На этом этапе созданный нами дополнительный блок — точная копия оригинального блока. Чтобы заполнить его другими товарами, перейдите в режим правки, наведите курсор на область блока и нажмите на шестеренку.

В параметрах компонента «Табы на главной» перейдите на вкладку «Источник данных» и найдите поле «Отображать товары». В этом поле вы можете выбрать два варианта:

  1. Отмеченные к отображению на главной странице — в блоке будут отображаться стандартно все товары, у которых стоит галка «Показывать на главной».
  2. Соответствующие пользовательскому фильтру — при выборе этого варианта ниже появляется новое поле «Фильтр товаров» в виде конструктора фильтра. Так вы сможете выводить необходимые вам товары из каталога.

Чтобы настроить пользовательский блок товаров по фильтру, выберите вариант «Соответствующие пользовательскому фильтру». После этого в конструкторе «Фильтр товаров» выберите условие (1). Напротив условия нажмите на три точки и укажите необходимый раздел товаров, который необходимо отображать в блоке (2). В нашем случае — это одежда.

Далее перейдите на вкладку «Дополнительные настройки». Здесь представлены следующие параметры:

  1. Группировать товары по табам — если настройка отмечена, то ниже появляется поле «Тип табов».
  2. Тип табов — выберите тип, по которому хотите отображать табы в блоке:
  • По значениям свойства типа “список” — табы распределятся по выбранному свойству. При выборе этого параметра ниже появляется поле «Свойство со значениями для табов», в котором можно задать необходимое свойство. По умолчанию — это стикер.

  • По дочерним разделам — если указан параметр «Ограничивать разделом (ID) / Ограничивать разделом (символьный код)», то в блоке будут отображаться дочерние подразделы ограничивающего раздела. Если же этот параметр не указан — в блоке выведутся корневые разделы каталога.

  • Заголовок блока — укажите заголовок для блока.

Сохраните изменения.

Если для блока настроен только один таб, то он не будет отображаться пользователям.

На примере настройки фильтра по значениям свойств с одеждой у нас получился такой блок. Табы в нем отображаются по значениям свойств типа «Список».

Описание курса

назадНастройки оформления дополнительного блока Блок «Истории» на главнойвперед

Блок «Истории» на главной

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

На главной странице отображаются кликабельные разделы блока «Истории».

Доступно 2 типа отображения разделов блока на главной.

1 тип — Прямоугольные истории. При наведении на раздел отображается его название.

2 тип — Круглые истории. Название расположено под разделом.

При клике на раздел с историями открывается попап-окно.

Поведение при просмотре историй

  • При просмотре истории перелистываются автоматически.
  • На каждую историю отводится 5 секунд.
  • Если удерживать палец на истории, то она останавливается.

На десктопах при клике на правую область истории открывается следующий элемент этого же раздела.

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

При клике на область кнопки открывается ссылка с кнопки.

При клике на другой раздел откроются его истории.

На мобильных устройствах поведение аналогичное. Только при переходе к другому разделу нужно свайпнуть.

Настройка отображения блока «Истории»

Чтобы отобразить «Истории» на главной через публичную часть сайта, перейдите в виджет «Точные настройки». Выберите раздел «Главная», активируйте блок и выберите тип отображения. Не забудьте сохранить изменения.

Чтобы отобразить блок через административную часть сайта, перейдите в Аспро (1) → Аспро: Premier (2) → Настройки (3) → Главная (4).

Поставьте галку напротив пункта «Истории».

Прокрутите бегунок до «Вид отображения историй». Выберите нужный вид и примените изменения.

Содержание главы:

Описание курса

назадНастройка пользовательского блока с товарами по фильтру Редактирование разделов и элементов блока «Истории»вперед

Редактирование разделов и элементов блока «Истории»

Вы можете редактировать и добавлять разделы. Для этого проделайте путь: Контент (1) → Контент (aspro.premier) (2) → Истории (3).

Для добавления нового раздела нажмите на стрелочку с выпадающим списком на кнопке «Добавить элемент». Выберите «Добавить раздел».

Для редактирования выберите нужный вам раздел и нажмите на «Гамбургер». В выпадающем окне вы можете удалить или изменить существующий раздел.

В окне редактирования укажите название (1), загрузите изображение (2) и сохраните изменения (3).

Чтобы редактировать или добавлять элементы (истории) в разделе, проделайте путь:

Последний пункт пути — любой раздел, элементы которого вы хотите изменить.

Чтобы добавить историю, нажмите на кнопку «Добавить историю».

Чтобы редактировать историю в разделе, нажмите на «Гамбургер». В выпадающем окне кликните на команду «Изменить».

Во вкладке «Элемент» укажите класс (цвет) кнопки (1), ссылку на страницу сайта (2) и текст кнопки (3).

Во вкладке «Анонс» загрузите картинку.

Не забудьте сохранить изменения.

Описание курса

назадБлок «Истории» на главной Добавление товаров в историювперед

Добавление товаров в историю

В решении Аспро: Премьер, начиная с версии 1.4.1, появилась возможность привязать товары в историю. Это поможет повысить средний чек интернет-магазина и увеличить конверсию.

При добавлении товаров в историю появляется кнопка «Товары в истории».

При нажатии на нее появляются привязанные товары. Их сразу можно добавить в корзину или перейти в карточку товара для подробного ознакомления.

Чтобы привязать товары, перейдите в Контент (1) → Контент (aspro.premier) (2) → Истории (3). Зайдите в редактирование необходимой истории.

Привяжите товары через поле «Товары».

Если этой настройки нет, перейдите по шестеренке в правой верхней части интерфейса и перенесите поле «Товары» из доступных в выбранные.

Описание курса

назадРедактирование разделов и элементов блока «Истории» Настройки шапки и менювперед

Настройки шапки и меню

Описание курса

назадДобавление товаров в историю Типы и состав шапкивперед

Типы и состав шапки

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

На выбор вам предлагается 6 вариантов шапок с различными настройками.

Настроить типы шапок можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Шапка». Здесь можно выбрать необходимый вариант шапки.

У каждого типа шапок есть свой набор настроек (1). Можно задать ширину, позицию кнопки каталога, а также цвета панели и меню. Каждому варианту шапок можно определить состав (2).

Рассмотрим, чем отличаются варианты шапок по ширине контента.

  • шапка по ширине контента:

  • шапка не по ширине контента:

В зависимости от выбранного варианта в шапке можно подключить или отключить:

  1. Популярные категории.
  2. Слоган
  3. Телефоны.
  4. Переключатель оформления.
  5. Личный кабинет.
  6. Сравнение товаров.
  7. Избранное.
  8. Корзину.

Административная панель

Для настройки оформления раздела в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Шапка (4).

Выберите необходимый тип шапки и настройте ее. Сохраните изменения.

Описание курса

назадНастройки шапки и меню Фиксированная шапкавперед

Фиксированная шапка

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

Чтобы включить фиксированную шапку в публичной части, перейдите в «Точную настройку», далее в разделе «Шапка» перетащите ползунок «Фиксированная шапка сайта» в нужную сторону (1). Ниже вы можете определить ее состав (2).

Для управления настройкой через административную часть сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Шапка (4).

Поставьте галку напротив пункта «Фиксированная шапка сайта», настройте ее и нажмите «Применить».

Описание курса

назадТипы и состав шапки Загрузка мобильного меню и меню в фиксированной шапке только при первом отображениивперед

Загрузка мобильного меню и меню в фиксированной шапке только при первом отображении

В решении реализовано 3 типа меню: меню в шапке, фиксированное меню и мобильное меню. Это значит, что в коде дублируются эти элементы.

Существует опция, которая позволяет избежать тройного дублирования пунктов меню в исходном коде каждой страницы сайта. Поисковые системы не будут фиксировать дубли страниц. Это помогает уменьшить размер композитного кеша на проектах с большим количеством разделов каталога.

На мобильных устройствах содержимое мобильного меню подгрузится отдельным AJAX-запросом при первом его открытии. Для устройств с более широким экраном содержимое меню в фиксированной шапке также подгрузится при ее первом появлении.

Обратите внимание, что у пользователей с медленным Интернетом может быть задержка при этой первой загрузке.

Чтобы активировать настройку, в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Верхнее меню (4).

Прокрутите вниз до раздела «Меню в шапке», поставьте галку в поле «Загружать мобильное меню и меню в фиксированной шапке только при первом отображении». Сохраните изменения.

Описание курса

назадФиксированная шапка Меню в шапкевперед

Меню в шапке

Описание курса

назадЗагрузка мобильного меню и меню в фиксированной шапке только при первом отображении Настройки оформления выпадающего меню шапкивперед

Настройки оформления выпадающего меню шапки

Выпадающее меню выводится при клике на каталог или раздел в шапке сайта. В Аспро: Премьер вы можете задать уровень вложенности и количество видимых пунктов в верхнем меню, а также настроить его оформление.

Настроить выпадающее меню можно двумя способами:

  • через виджет в публичной части;
  • в административном разделе.

Рассмотрим каждый вариант подробнее.

Виджет в публичной части

Перейдите в «Точную настройку», далее в раздел «Верхнее меню». Здесь можно выбрать тип меню (1), включить большое меню (2) и рекламный блок (3).

Рассмотрим визуально разницу меню с рекламным блоком и без него.

  • меню с рекламным блоком;

  • меню без рекламного блока.

Ниже в настройке «Изображения в широком меню» можно выбрать способ показа изображений у разделов каталога и услуг (4). Далее есть возможность изменить положение этих изображений в меню (5), а также уровень вложенности меню (6).

Изображения в широком меню у разделов каталога и услуг могут быть в виде картинок, прозрачных картинок, иконок или без них. Рассмотрим подробно эти варианты изображений.

  • без изображений;

  • картинки;

  • прозрачные картинки;

  • иконки.

Положение изображений можно установить сверху и слева от меню.

  • положение изображений: сверху;

  • положение изображений: слева.

Уровней вложенности меню в шапке может быть 2, 3, 4 или 5 (если не установлена настройка «Каталог в кнопке»).

  • Второй уровень вложенности меню — видны только корневые категории.

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

  • Четвертый уровень вложенности меню — становятся видны подразделы разделов.

Чтобы предоставить пользователю возможность раскрывать 4 уровень вложенности меню по клику, необходимо во вкладке «Верхнее меню» включить соответствующую настройку.

Рассмотрим подробно, как работает эта настройка.

  • Четвертый уровень вложенности не раскрывается по клику.

  • Четвертый уровень вложенности меню раскрывается только по клику.

Административная часть сайта

Для настройки оформления выпадающего меню в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Верхнее меню (4).

Вы увидите те же настройки, что рассматривались ранее.

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

Описание курса

назадМеню в шапке Редактирование пунктов меню в шапкевперед

Редактирование пунктов меню в шапке

Вы можете отредактировать пункты меню в шапке сайта.

Чтобы редактировать пункты меню в публичной части, перейдите в режим правки и наведите курсор на область с пунктами меню. Нажмите кнопку «Редактировать пункты меню».

В окне редактирования можно перетаскивать пункты меню (1), менять их название (2) и редактировать ссылку (3), на которые они ведут посетителя при клике по ним. Есть возможность открыть диалог выбора файла, перемещать вверх/вниз и удалять пункты меню (4).

Описание курса

назадНастройки оформления выпадающего меню шапки Тип менювперед

Тип меню

В Аспро: Премьер вы можете выбрать, откуда будет подгружаться выпадающее меню: разделов и подразделов каталога или инфоблока и включить большое меню.

При типе «Разделы и подразделы» отображается вся структура раздела, который размещен в пункте меню. Это классический вариант, но у него нет гибкой настройки.

Тип меню «Из инфоблока» позволяет не меня структуры раздела изменить вывод информации в меню. Благодаря этому вы можете не ограничивать себя в формировании меню и в одном пункте разместить информацию из абсолютно разных разделов. Используйте эту возможность в период акций или адаптируйте меню под специфику вашего бизнеса. Подробнее о настройке рассказываем в документации.

Большое меню выключено

Большое меню включено

Настроить этот функционал можно через публичную и административную части сайта.

Для настройки через публичную часть перейдите в виджет точных настроек и нажмите вкладку «Верхнее меню». Выберите тип меню (1) и перетащите переключатель в поле «Большое меню» (2).

Для настройки через административную часть сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Верхнее меню (4). Выберите тип меню (5) и поставьте галку в поле «Большое меню» (6). Сохраните изменения.

Содержание главы:

Описание курса

назадРедактирование пунктов меню в шапке Настройка меню из инфоблокавперед

Настройка меню из инфоблока

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

Выбрать способ отображения меню можно в публичной части сайта. Перейдите в «Точную настройку», далее в раздел «Верхнее меню». Выберите тип меню «Из инфоблока» (1) и задайте необходимый способ вставки разделов в пунктах меню (2).

Способ вставки: заменить — отображать только меню из инфоблока. При этом разделы из структуры каталога не показываются.

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

Для выбора способа вставки в административной части сайта необходимо перейти в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Верхнее меню (4). Выберите тип меню «Из инфоблока».

Создание разделов меню из инфоблока

Чтобы создать разделы меню из инфоблока в выпадающее меню шапки, необходимо указать родительский пункт верхнего меню, для которого будут указываться дочерние пункты. В административной части сайта перейдите в Контент (1) → Каталог (aspro.premier) (2) → Мегаменю (3).

Чтобы создать новый раздел, нажмите на стрелку и выберите «Добавить раздел» (1). Здесь также можно редактировать (2) и удалять (3) существующие разделы при нажатии на «Гамбургер».

При создании раздела в настройках заполните его название на вкладке «Раздел». Это название не будет отображаться в меню. Оно используется только для поиска в административной части сайта.

На вкладке «Доп. поля» укажите ссылку пункта меню, для которого будет создано меню из инфоблока, и сохраните изменения.

Ссылка пункта меню — путь для верхнего пункта меню, в который будут выгружаться элементы. А ссылка при клике — путь для вложенных пунктов меню. Для меню верхнего уровня ее заполнять не нужно. Также не стоит вставлять разные значения в этих полях.

Далее в этом разделе создайте необходимые пункты, которые будут отображаться в меню. Для этого нажмите на стрелку и выберите «Добавить раздел».

Рассмотрим подробнее настройки пунктов раздела. На вкладке «Раздел» доступны следующие поля:

  1. Раздел активен — включает активность раздела.
  2. Родительский раздел — задает родительский раздел для обеспечения уровня вложенности.
  3. Название — устанавливает название раздела, которое будет отображаться в меню.
  4. Изображение — загружает картинку для раздела.

На вкладке «Доп. поля» укажите ссылку при клике (1). Загрузите иконку (2), которая будет отображаться в зависимости от заданных настроек изображения во всплывающем меню. Сохраните изменения.

Описание курса

назадТип меню Рекламный блок в выпадающем меню шапкивперед

Рекламный блок в выпадающем меню шапки

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

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

Для активации настройки в административной части сайта перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Верхнее меню (4). Поставьте галку в поле «Отображать рекламный блок».

Добавление рекламного баннера в выпадающее меню шапки

Для добавления рекламного баннера в административной части сайта перейдите в Контент (1) → Реклама (aspro.premier) (2) → Баннеры в меню (3).

Добавьте новый рекламный баннер (1) или измените (2), деактивируйте (3), скопируйте (4) или удалите (5) существующий баннер.

Рассмотрим подробнее настройки баннера. На вкладке «Элемент» вы найдете следующие поля:

  1. Активность — включает отображение баннера.
  2. Период активности — задает время показа баннера.
  3. Название — установить название для баннера, которое будет отображаться в административной части.
  4. Сортировка — индекс сортировки.
  5. Ссылка с баннера — назначить url страницы, куда пользователь будет переходить при клике на баннер.
  6. Показ в пункте меню — указать пункт в большом меню для баннера.

На вкладке «Анонс» загрузите активную картинку для баннера и сохраните изменения.

Описание курса

назадНастройка меню из инфоблока Популярные категории каталога в шапкевперед

Популярные категории каталога в шапке

В Аспро: Премьер доступен вывод популярных категорий каталога в шапку сайта для удобной навигации.

Отображение популярных категорий предусмотрено в любом варианте шапки.

Популярные категории в 1-м варианте шапки сайта.

Популярные категории во 2-м варианте шапки сайта.

Популярные категории в 6-м варианте шапки сайта.

Настройка вывода популярных категорий в публичной части сайта

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

Настройка вывода популярных категорий в административной части сайта

Перейдите в Аспро (1) → Аспро: Премьер (2) → Настройки (3) → Шапка (4).

Здесь представлены те же настройки, что мы рассматривали выше. Выберите подходящую кнопки каталога и нажмите «Применить».

Добавление и изменение разделов в популярных категориях

Чтобы добавить новые разделы в популярные категории в шапке или изменить ссылки у старых, в административной части сайта перейдите в Контент (1) → Каталог (aspro.premier) (2) → Мегаменю (3) → Категории в шапке (4).

Чтобы добавить новый раздел в шапку, нажмите на стрелку и выберите «Добавить раздел» (1). Для изменения ссылки у существующей категории нажмите на «Гамбургер» напротив необходимого поля и выберите «Изменить» (2).

В окне редактирования задайте активность раздела (1) и пропишите название (2).

На вкладке «Дополнительно» настройте порядок отображения раздела в поле «Сортировка».

Далее перейдите на вкладку «Доп. поля». На ней заполните следующие поля:

  1. Ссылка при клике — задайте относительный путь, по которому клиент будет переходить из шапки сайта.
  2. Иконка — добавьте иконку для, которая будет отображается рядом с названием категории
  3. Показывать в шапке — активируйте отображение кнопки с категорией в шапке.
  4. Фон для ссылки — по желанию добавьте фон, чтобы акцентировать внимание на категории.
  5. Белый цвет текста на фоне — закрашивает текст белым для кнопок с фоном.
  6. Закрашивать иконку в цвет шапки — закрашивает иконку рядом с кнопкой.

После внесения изменений сохраните настройку.

Описание курса

назадРекламный блок в выпадающем меню шапки Каталогвперед


Полная версия курса: Аспро: Премьер в базе знаний Аспро. Вопросы по внедрению, настройке или обновлению решения — свяжитесь со мной.

📞 +7 (906) 311-77-69 · ✉ hello@automata.sale · 💬 Telegram: @automatasale · 🌐 automata.sale

ИП Урядов Евгений Евгеньевич · ИНН 645112058391 · ОГРНИП 312645301900058
Работаем по России, Беларуси и Казахстану