Печатать книгуПечатать книгу

Ленты времени (примеры и инструкции)

Сайт: Виртуальный класс
Курс: Акция "ЛЕНТА ПАМЯТИ", посвященная годовщине Победы в Великой Отечественной войне (75-летию, 79-летию)
Книга: Ленты времени (примеры и инструкции)
Напечатано:: Гость
Дата: Среда, 24 апреля 2024, 12:27

Понятие

Примеры и сервисы


ПРИМЕР ЛЕНТЫ ВРЕМЕНИ, СОЗДАННОЙ СЕРВИСОМ Timeline JS


С Днем космонавтики!



Timeline JS (видео)



как скопировать ссылки на медиа:

Timeline JS (пошаговая инструкция)

С помощью сервиса Timeline JS можно создать мультимедийную интерактивную ленту времени.
Для создания ленты времени необходимо создать google-таблицу по определенному шаблону, настроить доступ по ссылке для просмотра (опубликовать для просмотра).
Для полученной ссылки на таблицу данных сервис позволяет сгенерировать:
- URL-ссылку на ленту времени
- HTML-код для встраивания на сайт ленты времени.

План работы над созданием ленты времени:
Для выбранной темы подобрать события, например:

2) Для каждого события подобрать материал, опубликованный в открытом доступе в Интернет, например:

3) Один участник мини-группы создает шаблон google-таблицы на своем google-диске
Для этого на странице сервиса https://timeline.knightlab.com/
кликаем по кнопке : 





Настраиваем доступ к файлу по ссылке для редактирования. 

на первом шаге  - кликаем по кнопке и создаем файл шаблона на своем гугл-диске

заполняем таблицу, не портим структура шаблона



на втором шаге - настраиваем доступ к файлу таблицы для редактирования (доступ нужен сервису для обработки и создания по вашей информации ленты времени)



на третьем шаге - вставляем скопированную ссылку на таблицу (с доступом для редактирования)



на четвертом шаге забираем ссылки:

- на ленту времени для просмотра в браузере

- на ленту времени для встраивания в форме фрейма на своем сайте

ниже сразу отображается встроенная в виде фрейма лента времени



В окне с заголовком "Share Link" - ссылка для просмотра в браузере;
в окне с заголовком "Embed" - html-код для вставки на свой сайт или страницу электронной образовательной среды дисциплины.

Просматривая ссылку, скопированную в окне с заголовком "Share Link"  можно каждому смотреть как будет выглядеть лента времени.

дополнительно как на шаге 2 копировать ссылку

правильно делайте доступ к гугл-таблице и копируйте ссылку:

1) публикуем гугл-таблицу в интернет:


кликаем опубликовать:



2) кликаем по кнопке  "настройки доступа" в правом верхнем углу окна:




кликаем по "копировать ссылку", именно эту ссылку используйте далее в сервисе  TimelineJS3 для создания ленты времени


еще видео-объяснения

Предлагаем подборку видео-уроков по созданию ленты времени с помощью сервиса timeline


Павел Калинников. Сервис TimeLineJS: 2. Создаем ось времени за четыре шага (10,5 минут)

Создание таймлайн онлайн и бесплатно. Timeline JS (7 минут)

Комментарии по заполнению таблицы



Timeline JS удобный сервис для визуализации хронологический событий (20 минут)

Дополнительный материал - тонкости данных в таблице