search

Встроенный код

элемент встроенный код позволяет встраивать веб-страницы, видео, аудио или другой интерактивный контент из внешних источников, также имеется возможность вставки скорм-пакетов и исполняемого кода (например, Яндекс карт).

Кликните по элементу чтобы увидеть его настройки в правом боковом меню.

circle-info

Встроенный код может работать с тремя типами данных: HTML-кодом, ссылкой на веб-сайт или zip-файлом (например, пакетом SCORM)

hashtag
1. HTML-код

Чтобы добавить HTML-код, выберите опцию «HTML» в настройках элемента, нажмите "Редактировать HTML" и вставьте встроенный HTML-код в появившемся окне.

hashtag
2. Ссылка

Чтобы добавить ссылку, выберите опцию «Ссылка» в настройках элемента и вставьте ссылку.

hashtag
Поддерживаемые ссылки:

  1. Youtube (Только embed-ссылки)

  2. Vimeo

  3. Google Docs / Slides / Sheets

  4. Google Maps

  5. Miro, Figma (Только embed-ссылки)

  6. JSFiddle, CodePen (Через специальный embed)

  7. Ваши собственные сайты, если они поддерживают iframe

circle-info

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

circle-check

Примеры ссылок: https://www.youtube.com/embed/VIDEO_IDarrow-up-right https://player.vimeo.com/video/VIDEO_IDarrow-up-right https://www.google.com/maps/embed?...arrow-up-right

hashtag
Неподдерживаемые ссылки:

  1. Обычные YouTube ссылки

  2. Vimeo-ссылки с приватными настройками

  3. Ссылки на сайты, запрещающие встраивание (Facebook, Instagram, GitHub)

  4. HTTP-сайты (без HTTPS), если страница работает по HTTPS

  5. Ссылки, требующие входа в аккаунт

triangle-exclamation

Если вставленная ссылка делает перенаправление на авторизацию или другой сайт, то внутри встроенного кода она может не отобразиться или зависнуть на переадресации. То же самое произойдет если сайт требует чтобы у пользователя была сессия (например, авторизация в Google Docs).

circle-exclamation

Многие сайты запрещают показ в iframe 1. Если у сайта выставлен заголовок:

"X-Frame-Options: DENY" или "X-Frame-Options: SAMEORIGIN" вставка в iframe с другого домена не сработает — браузер заблокирует загрузку. 2. Если сайт выставил CSP-заголовок, ограничивающий встраивание, например:

"Content-Security-Policy: frame-ancestors 'none';" или "Content-Security-Policy: frame-ancestors 'self';" то он не загрузится внутри iframe.

circle-info

Если сайт работает по https://, а во встроенный код вставлена http:// ссылка, браузер может заблокировать это как смешанный контент (mixed content).

hashtag
3. Архив

В настройках элемента выберите «Архив» и загрузите SCORM-пакет.

Подробнее о том, как прикрепить SCORM-пакет читайте тут.

circle-info

С обновлением 2.56 в элементе «Встроенный код» теперь тоже есть настройки условий прохождения.

Мы добавили три варианта отслеживания в зависимости от условий прохождения:

  1. «Нет» – не отслеживать (то есть без условий прохождения).

  2. «Скорм пройден» – отслеживать статус Complete, который передает SCORM-пакет или встроенный элемент.

  3. «Клик на элемент» – отслеживать, чтобы студент сделал хотя бы один клик в элементе «Встроенный код».

chevron-rightКак работает отслеживание HTML и ссылокhashtag

Чтобы настроить отслеживание, нужно в файл или в элемент, открывающийся по ссылке, вставить код:

window.parent.postMessage({ type: 'complete' }, '*');

Например, вы можете создать элемент для проверки знаний при помощи ИИ и попросить его передавать статус Complete. Так, когда файл или элемент завершится, он будет пройден и на платформе Линда.

PreviousФигураNextКод

Last updated