что такое виджет на геткурсе
Виджет расписания уроков
На странице со списком тренингов располагается актуальное расписание ближайших уроков.
Отображаются уроки, для которых используется общее расписание, и которые запланированы на ближайшую неделю. Даты уроков можно задать в настройках тренинга.
Также вы можете посмотреть расписание в разделе «Обучение» — «Расписание»:
Также расписание уроков можно разместить на странице сайта с помощью блока «Запись расписания». В блок можно вручную добавить дату и время начала урока, его название и краткое описание.
Ещё вы можете разместить на страницах сайта блок-виджет «Список уроков тренинга».
В этом блоке вы можете выбрать тренинг, список уроков которого будет отображаться на странице. Список будет обновляться автоматически при внесении изменений в тренинг.
Также можно скрыть этот блок для тех, кому тренинг недоступен.
HTML-код формы в виджете
На платформе GetCourse вы можете создавать свои посадочные страницы и сайты.
Если у вас уже есть своя страница и вы хотите работать с ней, вы можете разместить на ней виджет платформы GetCourse.
По умолчанию виджет можно вставить на ваш сайт кодом Javascript:
Если вам необходимо разместить на своей странице виджет через HTML-код — напишите нам в техподдержку, и мы включим такую возможность в вашем аккаунте.
Преимущество вставки виджета через HTML-код формы:
1. Сокращение времени загрузки виджета на странице,
2. Можно настраивать индивидуальный дизайн формы,
4. Можно использовать в конструкторах страниц, которые не позволяет вставить код Javascript (например, для интеграции с сервисом LeadsBridge).
Виджет, вставленный на лендинг с помощью HTML-кода имеет особенность: если отправить такую форму с незаполненным обязательным полем, то информация об ошибке отобразится не в том же блоке с формой, а произойдёт переадресация на другую страницу с указанием данной ошибки.
Если вам необходимо, чтобы данное сообщение отображалось в том же блоке с формой, то рекомендуем использовать для вставки на ваш сайт javascript-код виджета.
Виджет вставлен с помощью html кода
Виджет вставлен через javascript-код
На данный момент виджет, вставленный на лендинг с помощью HTML-кода поддерживает не все части формы, которые могут быть дополнительно добавлены на нее. Например, не поддерживаются дополнительные поля пользователя или поле пользователя «Язык». Обязательно после настройки формы на вашем сайте проведите ее тестирование на соответствие всем поставленным задачам. При необходимости использования элементов, которые не поддерживаются в HTML форме, используйте для вставки на ваш сайт javascript-код виджета.
Форма геткурса на Тильде
Кейс: Есть курс на GetCourse и необходимо на сайте, который создан на Tilda, предоставить доступ к первому модулю бесплатно.
Содержание
Создание формы на Геткурсе
Для формы необходимо создать виджет:
Переходим Сайт —> Виджеты —> Создать виджет
Выбираем элемент формы для добавления в виджет.
Теперь нужно привести форму к виду похожему на формы сайта.
Изменим заголовок. Для этого нужно навести на заголовок и нажать на шестеренку.
Вводим название формы и нажимаем Сохранить и закрыть.
Изменим цвет и надпись кнопки. Сначала посмотрим цвет на уже существующих формах сайта. Зайдем в редактирование блока и посмотрим настройки кнопки.
Скопируем код цвета.
Затем перейдем обратно к форме на геткурсе, наведем мышь на кнопку и нажмем на шестеренку.
Изменим наименование кнопки и вставим цвет, взятый из настроек кнопки сайта. Также поменяем цвет шрифта, установим белый.
Изменим настройки стиля, наведем на форму и нажмем кнопку Стиль.
Поменяем поля местами, чтобы они соответствовали порядку других форм на сайте, это можно сделать перетащив их мышкой.
Поменяем название полей, уберем подсказки и укажем обязательность заполнения.
Вот что у нас получилось:
Изменим цвет границ полей и увеличим кнопку до размера полей. Для этого нажмем на кнопку Стиль и Подробные настройки.
В обработчик формы добавим действия:
Тильда и Геткурс: настройка интеграции
Встроенный конструктор лендингов на Геткурс имеет весьма простой функционал и требует более сложной работы с ним. Поэтому зачастую лендинги собираются на сторонних платформах-конструкторах. Разберем пример интеграции Тильда Геткурс. Но механика связки с любыми другими сервисами проходит аналогично.
Интеграция Тильда и Геткурс
Для работы с внешними сайтами, находящимися не на платформе Getcourse, имеется такой функционал как виджеты. Это обычные блоки из конструктора платформы, которые имеют свой код. Этот код мы вставляем на любые сайты и «подтягиваем» данные из Геткурса. Рассмотрим два вида вставки на сайтах, а в конце разберем одну распространённую ошибку.
Размещение виджета на странице
В данном варианте мы хотим поставить форму Геткурса прямо на странице, между блоками Тильды. Для этого просто добавляем в нужном месте блок T123:
После этого переходим по красной кнопке «контент».
Откроется поле ввода кода, в которое нужно вставить код формы.
Всё! Сохраняем изменения и нужная форма показывается на странице Тильды.
Размещение виджета во всплывающем окне
Придерживаемся вышеописанной стратегии в пункте 1 с незначительными изменениями.
Теперь мы добавляем блок T868:
Переходим по кнопке «контент» и вставляем код.
Здесь есть один момент — у нас появилось дополнительное поле «ссылка на popup». Я очень рекомендую менять значение, которое там установлено по умолчанию.
Дело в том, что зачастую всплывающих попапов планируется несколько. И у каждого должна быть своя «ссылка». Если забудете и оставите как есть, то всплывающие окна не заработают как надо.
Теперь остается только зайти в настройки кнопки, найти строку для ссылки и вписать значение, которое выбрали на предыдущем шаге.
Всё! Сохраняем изменения и проверяем кнопку.
Распространенная ошибка
У каждого виджета (которые повторяются) на странице должен быть уникальный параметр.
Вставка
В разделе «Вставка» есть следующие элементы:
Обратите внимание: проверять работу сторонних скриптов всегда рекомендуется на отдельной, тестовой странице.
Подробнее об основах CSS для GetCourse — в следующей статье.
В настройках страницы есть возможность удалить блок с добавленным сторонним кодом, если он нарушил работу страницы.
С помощью элемента «Другая страница» можно вставить в выбранное место любую другую страницу. При просмотре она будет отображаться целиком.
С помощью блока «Несколько вложенных страниц» можно вставить в выбранное место несколько страниц.
В настройках вы можете указать фильтр по тегам страниц для вставки:
Вы можете включить функцию «Автоматически дополнять фильтр тегами с просматриваемой страницы». Это позволит к фильтру тегов, добавить теги, указанные у страницы, на которой добавлен блок «Несколько вложенных страниц»:
Настройка «Использование тегов из фильтров» позволяет выбрать:
Также вы можете указать выбор страниц только в конкретной папке:
Далее необходимо указать количество мест для вывода. Блок ищет страницы по параметрам и выводит столько страниц, сколько указано мест:
В поле «Сортировка» выберите способ по которому будут выводиться страницы:
С помощью блока «Несколько вложенных страниц» вы можете создать на вашей странице блок с баннерами, которые в случайном порядке будут отображаться на странице каждый раз, когда пользователь заходит на нее.
Для этого необходимо создать папку с нескольким страницами. Каждая страница будет являться баннером.
В разделе «Страницы» добавьте папку и создайте в ней страницы, на которых будут расположены баннеры.
Затем добавьте блок «Несколько вложенных страниц» на нужную страницу, выберите папку, укажите 1 место и сортировку в случайном порядке:
Когда пользователь зайдет на страницу, будет отображаться одна случайная страница из папки. При повторном посещении страницы будет показана другая случайная страница и так далее: