Видео - помощь Webflow
Узнайте, как добавить видео на ваш сайт Webflow.
Используйте видеоэлемент для встраивания видео, размещенных на сторонних сайтах, таких как YouTube или Vimeo.
Видеоэлемент позволяет встраивать видео, размещенные на сторонних сайтах, таких как YouTube или Vimeo, в любом месте вашего сайта.
Как добавить видео
Есть два способа добавить видеоэлемент на ваш сайт:
- Откройте панель добавления и перетащите элемент видео на ваш холст Webflow
- Нажмите Command + E (на Mac) или Control + E (на Windows), чтобы открыть быстрый поиск и найдите элемент видео
Как настроить параметры видео
После размещения видеоэлемента на холсте у вас будет доступ к настройкам видео, где вы можете добавить URL и заголовок. Чтобы быстро получить доступ к настройкам видео:
- Дважды щелкните элемент видео
- Выберите элемент видео и перейдите в панель настроек элемента (D)
Вставьте ваш URL видео, добавьте заголовок, если хотите, и нажмите Enter / Return. Миниатюра вашего видео появится в видеоэлементе.
Поддерживаемые источники видео
- YouTube (если вы хотите больше контроля над вашим видео на YouTube, попробуйте использовать элемент видео YouTube)
- Vimeo
- DailyMotion
- KickStarter (все, что вам нужно сделать, это вставить основной URL кампании, и Webflow захватит основное видео кампании)
- TED (поддержка нескольких языков)
- Wistia
- Ustream
- Livestream
- Twitch
- Tudou
- Hulu
- SproutVideo
- Vidzflow
В настоящее время мы не поддерживаем загрузку видеофайлов в панель ресурсов и их использование в видеоэлементе. Однако вы можете загружать видео как беззвучные фоновые видео.
Как установить размеры видео
Элемент видео учитывает размеры родительского контейнера (например, если вы поместите его в блок div, он займет всю ширину этого блока div). Если вы хотите задать видео пользовательскую ширину и высоту, вы можете создать пользовательский блок div. Для этого перетащите блок div из панели добавления и задайте блоку div значение ширины и значение высоты. Теперь, если вы перетащите ваше видео в этот пользовательский блок div, оно будет соответствовать этому размеру.
Другие способы добавления видео на ваш сайт
Вы также можете добавить видео на ваш сайт, используя другие элементы, включая:
- Видео YouTube
- Фоновое видео
- Лайтбокс
- Богатый текст
- Встраивание пользовательского кода
Элемент видео YouTube
Элемент видео YouTube позволяет встроить видео из URL YouTube. Этот элемент предоставляет все параметры отображения, предлагаемые функцией встраивания YouTube, включая возможность показывать связанные видео с канала, задавать конкретное время начала, показывать или скрывать элементы управления видео и многое другое. Узнайте больше об элементе видео YouTube.
Элемент фонового видео
Элемент фонового видео позволяет добавлять движущиеся фоны без звука. В отличие от элемента видео, который поддерживает только ссылки YouTube и Vimeo, элемент фонового видео может принимать любой видеофайл, который вы загружаете. Элементы фонового видео также имеют встроенный переключатель воспроизведения/паузы, чтобы посетители сайта могли воспроизводить или приостанавливать фоновое видео по своему желанию. Узнайте больше об элементе фонового видео.
Элемент лайтбокса
Элемент lightbox позволяет посетителям сайта открывать видео в модальном окне. Подобно видеоэлементу, lightbox поддерживает ссылки на YouTube и Vimeo. Узнать больше об элементе lightbox.
Элемент и поле форматированного текста
Элемент форматированного текста также позволяет добавлять видео. Это становится еще более мощным, когда вы используете его для извлечения данных из поля форматированного текста в Коллекции CMS. В качестве альтернативы, вы также можете использовать элемент видео для динамического извлечения данных из видео поля Коллекции. Узнать больше о видео полях Коллекции.
Как встроить видео с помощью пользовательского кода
Вы также можете добавить HTML видео, используя элемент вставки:
- Перейдите в Панель добавления
- Перетащите элемент вставки на холст
- Вставьте ваш видеокод (Узнать больше о видеоэлементах в HTML)
- Нажмите Сохранить и закрыть