[архив] Anki: видео Youtube в карточку по videoId

Привет всем! Сегодня я отвечу на интересный вопрос о том, как встроить видео с YouTube прямо в карточки Anki. Господин Джоли Компьютер оставил четыре одинаковых комментария под разными видео, прося рассказать, как это сделать. Он хотел бы иметь возможность вставлять видео в карточки Anki, чтобы не делать это вручную для каждой карточки.

Итак, давайте разберемся, как встроить видео в карточку Anki:

1. Создание нового типа карточки:
   • Открываем Anki и нажимаем "Добавить".
   • Переходим в "Управление типами карточек" и нажимаем "Добавить".
   • Назовем новый тип карточки "YouTube" и нажмем "ОК".
2. Добавление новых полей:
   • В новом типе карточки добавляем два поля: "Видео ID" и "Описание".
   • Сохраняем изменения.
3. Редактирование шаблона карточки:
   • Переходим в "Шаблоны карточек" для типа карточки "YouTube".
   • В шаблоне лицевой стороны оставляем только {{ Front }}, а в шаблоне оборотной стороны добавляем HTML-код для встраивания видео:
<div class="video-responsive"> <iframe width="560" height="315" src="https://www.youtube.com/embed/{{Видео ID}}" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> <p>{{Back}}</p>
4. Добавление стилей для адаптивного видео:
   • Переходим в таблицу стилей (CSS) и добавляем следующий код:
   .video-responsive { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; overflow: hidden; max-width: 100%; background: #000; } .video-responsive iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
5. Добавление карточек:
   • Создаем новую карточку, заполняя поля "Видео ID" и "Описание".
   • В поле "Видео ID" вставляем идентификатор видео с YouTube (например, для видео с URL https://www.youtube.com/watch?v=dQw4w9WgXcQ, идентификатор будет dQw4w9WgXcQ).
6. Просмотр карточек:
   • Теперь, при просмотре карточки, на лицевой стороне будет отображаться описание, а на оборотной — встроенное видео.

Теперь ваши карточки будут автоматически подстраивать размер видео под размер окна, что сделает просмотр удобным на любых устройствах. Надеюсь, это видео было полезным. Если понравилось, ставьте палец вверх, если нет — палец вниз. Оставляйте комментарии, мне интересно их читать. Если хотите поддержать проект, ссылка в описании.

Всем спасибо за просмотр и до следующего раза! Всем пока!