Настроив цены на курсы и прием платежей на мини-лендинге на базе MaviBot, вы сможете значительно упростить процесс покупки для своих клиентов и оптимизировать управление финансовыми транзакциями.
Создание простого и интуитивно понятного процесса оплаты позволяет предлагать свои курсы, не беспокоясь о технической стороне интеграции платежной формы на ваш лендинг.
В этой статье вы узнаете, как быстро и легко настроить цены на курсы и прием платежей на вашем сайте без лишних сложностей.
Обратите внимание!
Прежде чем добавлять форму записи на курс на вашу страницу, обязательно настройте свой тарифный план.
Мы рассказали, как настраивать тарифные планы для онлайн-курсов, в отдельной статье. ссылка
Как создать сайт для курса
Прежде чем начать, подготовьте свой сайт, перейдя в соответствующий раздел:
Затем нажмите «+Создать»:
Выберите тип вашего сайта: «Многостраничный сайт», «Лендинг» или «Форма»:
Подробные инструкции по созданию сайта из разделов с помощью конструктора можно найти в разделе «Бизнес-сайты». ссылка
Если у вас уже есть сайт, созданный на платформе MaviBot, перейдите в режим редактирования разделов сайта, нажав на карточку сайта:
Многостраничный сайт
При создании многостраничного сайта автоматически создаются несколько страниц следующего типа:
- Главная страница;
- Наша команда;
- О нас.
Верхний и нижний колонтитулы генерируются автоматически, и в них можно добавить важную информацию о вашей компании. Оба колонтитула отображаются на каждой странице сайта, поэтому вам не нужно создавать одни и те же блоки на каждой отдельной странице.
Чтобы войти в режим редактирования любой страницы сайта, нажмите на строку нужной страницы.
Вы также можете создавать дополнительные страницы для сайта. Для этого нажмите кнопку с тем же названием, затем выберите шаблон страницы, форму или загрузите страницу из файла:
Загрузка страницы из файла позволяет переносить страницы сайта из другого проекта.
Подробнее об экспорте и импорте страниц сайта см. в разделе ниже «Экспорт / Импорт страниц сайта». ссылка
Нажатие на «Создать шаблон» откроет окно, где вы сможете выбрать любой шаблон страницы, в том числе пустой:
Лендинг (формы, опросы и викторины)
Нажатие на «Создать лендинг» откроет форму, где вы сможете выбрать различные шаблоны сайтов:
Вы можете выбрать любой понравившийся шаблон сайта и настроить различные параметры, такие как шрифты, фон и изображения. Вы также можете добавить любые дополнительные блоки (разделы) сайта, которые вам нужны.
В отличие от многостраничного сайта, создание лендинга сразу переносит вас в редактор страниц.
Позже, когда вы нажмете на вкладку лендинга,
вы попадете в раздел с заявками, основной информацией и настройками лендинга. В отличие от многостраничного сайта, вы не увидите несколько страниц, потому что лендинг состоит всего из одной страницы.
Если вам когда-нибудь понадобится добавить больше страниц на ваш лендинг, превратив его в многостраничный сайт, перейдите в настройки сайта, измените тип сайта на «Многостраничный сайт» и сохраните изменения:
Сайт ведет себя аналогично при создании в виде формы, опроса или викторины. Однако, в отличие от других типов сайтов, при создании не предлагается шаблон, поскольку страница автоматически включает блок «Форма» или «Викторина» в зависимости от выбранного типа сайта.
Как показано в примере, чтобы получить доступ к настройкам сайта типа «Форма», необходимо нажать кнопку «Редактировать».
Это приведет вас в режим редактирования страницы, где создан единственный раздел «Форма» (или викторины и многостраничные опросы, в зависимости от выбранного типа сайта).
Вы можете добавлять разделы «Форма», «Викторина» и «Опрос» на свой сайт (как многостраничный, так и лендинг) в любое время.
Для дальнейшей настройки перейдите в режим редактирования сайта.
Раздел «Форма» для записи на курс
Независимо от того, какой тип сайта вы выберете — «Многостраничный сайт», «Лендинг» или «Форма» — режим редактирования страницы остается тем же.
Чтобы создать раздел «Форма» для записи на курс (или любой другой раздел в конструкторе сайтов), наведите курсор на раздел, после которого вы хотите добавить платежную форму. Затем нажмите на появившуюся кнопку «+», чтобы открыть меню разделов:
Затем найдите раздел «Форма» в открывшемся меню:
Затем нажмите на «Форма», чтобы добавить раздел на ваш сайт:
Теперь давайте настроим форму:
Здесь необходимо активировать флажок «Форма для записи студента на курс»:
Этот флажок открывает дальнейшие настройки оплаты курса:
- Выберите курс, для которого вы хотите создать форму на сайте:
- Выберите план:
Это поле является одной из ключевых настроек для оплаты планов курса, так как позволяет выбрать, к какому плану (или ко всем планам) будет применяться форма на сайте.
- Подсказка формы:
Вы можете оставить текст подсказки по умолчанию или написать свой:
Если вы не хотите, чтобы подсказка отображалась в форме записи/оплаты курса, используйте флажок «Скрыть подсказку»:
Вопросы формы
При создании формы обязательно добавить поля для электронной почты, номера телефона и имени пользователя.
Чтобы добавить поле для ввода данных для ваших пользователей, нажмите кнопку «Создать вопрос»:
Затем появится форма настройки вопроса:
Вам нужно выбрать тип поля «Имя» из выпадающего списка:
И активировать флажок «Обязательный вопрос»:
Затем создайте второй вопрос:
Для второго вопроса выберите тип поля «Email»:
Этот вопрос также должен быть обязательным; в противном случае студент не сможет получить доступ к вашему курсу или завершить автоматическую запись.
Аналогично добавьте следующий вопрос с типом поля «Номер телефона»:
Ваша основная настройка формы записи на курс и оплаты завершена.
Далее вы можете настроить раздел по своему желанию: изменить цвета фона и кнопок, а также добавить другие поля вопросов.
Подробнее о настройке и всех функциях раздела «Форма» см. в разделе «Ответы форм». ссылка
Тестирование
Обязательно сохраните настройки сайта после настройки формы оплаты и записи.
Затем перейдите в предварительный просмотр сайта:
Вы увидите форму записи/оплаты курса на сайте.
Давайте протестируем форму, заполнив пустые поля своими данными:
Теперь отправьте данные в систему и перейдите к форме заявки и оплаты.
Форма сработала правильно: она перенаправила клиента на страницу обработки заказа, а затем на окно оплаты через выбранный платежный сервис.
Раздел «Карточки курсов»
Вы можете отображать информацию о курсах, доступных в вашей школе, на сайте с помощью раздела «Карточки курсов»:
Чтобы добавить раздел «Карточки курсов», нажмите кнопку «+» в режиме редактирования вашего сайта:
Затем найдите раздел «Карточки курсов» в появившемся меню и нажмите на него, чтобы добавить раздел на ваш сайт:
Раздел будет добавлен на ваш сайт, и для вас откроется меню настройки содержимого:
Содержимое блока
Настройка блока «Карточки курсов» включает выбор одного или нескольких уже созданных в проекте курсов для отображения на сайте, а также настройку элементов карточки.
О том, как создавать курсы на платформе MaviBot, рассказано в разделе «Онлайн-курсы». ссылка
Выбор курсов
Выберите курсы, которые вы хотите показывать на своем сайте:
Для этого установите флажок рядом с названием каждого курса, который вы хотите включить:
Выбранные курсы сразу же появятся на странице вашего сайта с изображением обложки, которое вы установили в настройках курса.
Настройка
Теперь давайте настроим элементы карточки после выбора нужных курсов:
- Тень
Вы можете настроить интенсивность тени для карточек курсов в разделе:
а) без тени:
b) легкая тень:
c) сильная тень:
- Цветовая палитра для элементов карточки
Вы можете изменять цвета на карточке для фона, текста (как на самой карточке, так и на кнопках) и добавлять интерактивность, изменяя цвета элементов при наведении курсора:
a) Цвет шрифта: помогает изменить основной цвет текста на карточке (исключая ее кнопку):
b) Фон карточки: для изменения цвета фона карточки.
c) Цвет границы: для изменения цветовой схемы границ карточки.
d) Текст кнопки: для изменения цвета текста кнопки в ее обычном (статическом) состоянии.
e) Фон кнопки: позволяет изменить цвет фона кнопки карточки курса.
Чтобы добавить интерактивности вашему сайту, вы также можете изменить цвета кнопок при наведении. Используйте для этого настройки цвета при наведении.
Теперь вы знаете, как отображать ваши существующие курсы MaviBot на вашем сайте с помощью раздела «Карточки курсов».
Узнайте о настройках фона и параметрах отображения в статье «Универсальные настройки разделов». ссылка
Раздел «Списки уроков»
Наряду с карточками онлайн-курсов вы можете добавлять списки уроков на страницу вашего сайта. Просто выберите нужный курс в разделе, и все уроки будут отображены:
Чтобы добавить блок для отображения списка уроков курса, войдите в режим редактирования сайта, наведите курсор на рабочую область, а затем нажмите кнопку «+»:
Справа откроется меню с доступными разделами сайта. Вам нужно найти там блок «Списки уроков»:
Нажмите на «Карточки курсов», чтобы открыть меню настройки содержимого блока:
Просто выберите нужный курс (уже созданный в MaviBot) из выпадающего меню и нажмите «Сохранить».
Затем перейдите в настройки, чтобы настроить содержимое блока.
Настройка
Наведите курсор на раздел и нажмите «Настройки», чтобы открыть панель настройки как содержимого, так и внешнего вида блока.
Вы можете настроить следующие параметры:
- Стиль списка уроков
По умолчанию список уроков отображается в новом формате. При желании вы можете переключиться на более лаконичный, классический стиль отображения.
- Стиль нумерации
Этот параметр доступен только для нового макета списка уроков. Выбранный тип нумерации применяется внутри каждой карточки урока.
- Иконки уроков
Отображаются только в том случае, если в настройках урока курса загружена превью.
Как добавить иконки
Шаг 1. Перейдите в настройки урока:
Для этого войдите в режим настройки курса и найдите вкладку «Уроки»:
Затем нажмите «Редактировать», чтобы открыть страницу редактирования урока.
Шаг 2. Откройте настройки страницы урока.
В настройках страницы урока перейдите в раздел «Основная информация»:
Шаг 3. Загрузка превью урока
В настройках «Основной информации» разверните выпадающее меню настроек изображения:
Загрузите изображение для превью урока:
Сохраните настройки:
Готово! Теперь превью уроков будут отображаться в виде иконок в разделе «Списки уроков» на вашем сайте.
- Фоновый узор
Добавляет глубину и уникальность вашим карточкам уроков:
- Скругление элементов
Значение задается в пикселях и скругляет углы карточек уроков:
- Стиль карточки урока
Помогает расположить карточки уроков в один ряд или в несколько рядов, с переносом или без.
- Цвет фона и текста
Вам доступна обширная цветовая палитра для установки цвета фона и цвета шрифта на карточке урока:
Теперь вы знаете, как добавлять списки уроков на ваш сайт и настраивать содержимое раздела.
Прочитайте статью «Универсальные настройки разделов», чтобы узнать о настройках фона и отображения. ссылка