Встраивание Stepik через iframe

iframe — это стандартный способ отображать один сайт внутри другого. С его помощью вы можете встроить Stepik в вашу платформу и наоборот.

Пример фрейма Stepik, встроенного в другой сайт:

Обратите внимание, что вы просто встраиваете вид Stepik на свой сайт, для решения заданий в открытом курсе необязательно будет логиниться в stepik.org, но, чтобы сохранять прогресс, авторизация всё-таки нужна. Но мы не рекомендуем встраивать по iframe приватный курс, если учащиеся не авторизуются на Stepik до просмотра страницы с таким курсом, они увидят 403 ошибку и могут посчитать это ошибкой системы.

Для встраивания любого курса или отдельного урока, размещенного на Stepik, скопируйте прямую ссылку на него из браузерной строки и добавьте ее в HTML-редактор другого сайта.

Код для встраивания iframe будет выглядеть так:

<span class="tagnamecolor"><span class="tagcolor"><</span>iframe<span class="attributecolor"> src<span class="attributevaluecolor">="<a href="https://stepik.org/course/67/syllabus">https://stepik.org/course<strong>/67</strong></a>"</span></span><span class="tagcolor">></span></span><span class="tagnamecolor"><span class="tagcolor"><</span>/iframe<span class="tagcolor">></span></span>

Увидеть, как сейчас выглядит курс Stepik в iframe, можно на тестовой странице: https://stepik.org/embed-test. В поле ввода введите: /ID курса (например, /67) и нажмите кнопку справа Test. ID курса вы можете взять из URL курса: https://stepik.org/course/67/syllabus.