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

Эти карточки позволяют посетителям быстро находить интересующие их программы и легко переходить на страницы курсов всего по одной кнопке. В этой статье мы рассмотрим, как настроить раздел с настраиваемыми карточками курсов, чтобы повысить удобство использования вашего сайта и помочь пользователям быстрее достигать своих образовательных целей.
Вместо использования онлайн-флеш-карточек вы можете добавить на страницу сайта списки уроков: просто выберите нужный курс в разделе, и все уроки будут отображены.
Как добавить раздел "Карточки курсов"
Чтобы добавить раздел "Карточки курсов", нажмите на "+" в режиме редактирования вашего сайта.
Затем найдите в открывшемся меню раздел "Карточки курсов" и нажмите на него, чтобы добавить раздел на ваш сайт:

Раздел будет добавлен на ваш сайт, и для вас откроется меню настроек содержимого:

Раздел контента
Настройка содержимого раздела "Карточки курсов" заключается в выборе курса(ов), уже созданных в проекте, для отображения на сайте, а также в настройке элементов карточки.
Как создавать курсы на платформе Salebot, описано в разделе “Онлайн-курсы”.
Выбор курса
Выберите курсы, которые вы хотели бы показать на своём сайте:

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

Тень

Для карточек курсов в разделе можно настроить интенсивность тени:
а) без тени:

b) легкая тень:

c) сильная тень:

Настройки цвета элементов карточки
Настройте внешний вид карточки, изменяя цвета различных элементов. Вы также можете добавить интерактивные эффекты при наведении.
Цвет текста: Изменяет основной цвет текста на карточке (кроме кнопок).
Фон карточки: Задаёт цвет фона карточки.
Цвет рамки: Определяет цвет контура или рамки карточки.
Текст кнопки: Задаёт цвет текста внутри кнопки (в статичном состоянии).
Фон кнопки: Задаёт цвет фона кнопки.
Интерактивные эффекты при наведении (необязательный раздел):
Включите эффекты при наведении, чтобы динамически менять цвет этих элементов, когда пользователь перемещает курсор над карточкой.
Теперь вы знаете, как отображать доступные курсы на вашем сайте MaviBot с помощью раздела "Карточки курсов".
Для настроек фона и отображения см. статью «Глобальные настройки раздела».
Как добавить блок "Уроки"
Чтобы добавить блок для отображения списка уроков в курсе, перейдите в режим редактирования сайта и наведите курсор на рабочую область, а затем нажмите на "+":
Справа откроется меню с доступными разделами сайта, где нужно найти блок "Уроки":

Нажмите на "Карточки курсов", и затем откроется меню для настройки содержимого блока:

Вам нужно лишь выбрать в выпадающем меню нужный курс, который уже создан в Salebot, и нажать "Сохранить".
Затем перейдите в настройки, чтобы настроить содержимое блока:

Настройка
Когда вы нажимаете на кнопку "Настройки" и наводите курсор на раздел, открываются настройки для изменения содержимого и самого блока:

Какие настройки доступны?
Стиль списка уроков

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

Стиль нумерации

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

Иконки уроков

Они отображаются, если вы добавили превью внутри самого урока в настройках курса.
Как добавить иконки
Шаг 1. Перейдите в настройки урока:
Для этого перейдите в режим настроек курса и найдите вкладку "Уроки":

Далее нажмите "Редактировать", после чего страница урока откроется для редактирования.
Шаг 2. Откройте настройки страницы урока.

Перейдите в раздел "Общие" в настройках страницы урока:

Шаг 3. Загрузите превью урока
Разверните список настроек изображения в настройках основной информации:

Загрузите изображение для превью урока:

Сохраните настройки.
Готово! Теперь превью уроков будут отображаться в виде иконок в разделе "Уроки" на сайте.

Фоновый узор

Это добавляет объём и уникальность вашим карточкам уроков:

Скругление элементов
Значение задаётся в пикселях и скругляет углы карточек уроков.
Стиль карточки урока

Это помогает размещать карточки уроков в одну строку или в строку с переносом или без него.
Цвет фона и текста

Доступна обширная цветовая палитра для настройки цвета фона карточки и цвета шрифта на карточке урока:

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