KWIGA справочный центр LMS (обучение) Подключение LMS на свой сайт Отображение программы курса на вашем сайте

Отображение программы курса на вашем сайте

Статьи:

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


В этой статье:


Как встроенная программа помогает продавать курс

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

  • Увеличить вовлечённость пользователей на вашем сайте.

  • Улучшить SEO — поисковые системы индексируют страницу с полезным контентом.

  • Создать целостное впечатление о вашем бренде без перехода на сторонние платформы.

Инструкция по добавлению программы курса на сайт

Шаг 1: Возьмите основную ссылку на курс, например:

https://sampleschool.kwiga.com/courses/Culinary-recipes-1-X1t

И добавьте в конец /program. Получится полная ссылка на программу курса:

https://sampleschool.kwiga.com/courses/Culinary-recipes-1-X1t/program

Шаг 2: Вставьте код iframe на свой сайт: 

<iframe id="course-program-frame" width="100%" src="ссылка на программу курса" style="border: none;"></iframe>

Параметр width можно настроить самостоятельно (например, 100% или 800px — в зависимости от дизайна сайта). 

Для примера выше (ссылка на программу курса https://sampleschool.kwiga.com/courses/Culinary-recipes-1-X1t/program):

<iframe id="course-program-frame" width="100%" src="https://sampleschool.kwiga.com/courses/Culinary-recipes-1-X1t/program" style="border: none;"></iframe>

Шаг 3: Добавьте следующий скрипт на страницу, где будет отображаться программа курса

Никаких изменений в скрипт вносить не нужно. 

<script>

    window.addEventListener("message", function(event) {

        if (event.data.type === "resize-iframe") {

            document.getElementById("course-program-frame").style.height = event.data.height + "px";

        }

    });

</script>

Скрипт обрабатывает сообщение от iframe и автоматически задаёт нужную высоту, соответствующую содержимому.

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