Вставка видео YouTube с помощью валидного HTML5, без тегов iframe и flash

Плюсануть
Поделиться
Класснуть

 HTML5

Когда я прогонял данный блог (и некоторые другие сайты) через сервис SE Ranking (его обзор позже), то отметил две самых частых проблемы при анализе сайта - flash и iframe. Самое частое применение данных html-тегов - вставка видеоролика с таких сервисов, как YouTube. И теперь, чтобы пройти проверку на валидность кода на сайте, требуется убрать эти теги.

Вставка YouTube с помощью HTML5, без iframe и flash

В этой записи я расскажу как сделать это быстро и безболезненно в WordPress. Кстати, функция доступна начиная с версии 3.6.

Итак, раньше я справлялся со вставкой видео двумя способами:

  • С помощью плагина Enhanced YouTube Shortcode.
  • С помощью вставки специального кода, который можно получить на странице с видео.

Оба варианта дают старый и невалидный код, от которого стоит избавиться. Благо, теперь для этого даже плагины не потребуются. В новых версиях WordPress вставить видео можно встроенным шорткодом video, с прямой ссылкой в параметре src.

Вот пример шорткода (в "video" специально поставил пробел, чтобы замены не произошло):

[vi deo src="https://www.youtube.com/watch?v=NhheiPTdZCw"]

А вот пример использования:

Всё сделано сугубо по канонам HTML5, с валидностью проблем не будет. Только я так и не понял с какими сервисами работает данный тег, но с YouTube проблем не было.

Проблем со сменой плеера на всех страницах сайта быть не должно. Если записей под редактирование мало - всё легко выполняется руками. Если записей много - пройдитесь автозаменой по MySQL базе. Для OS X рекомендую воспользоваться программой Navicat Premium.

Кстати, можно добавлять видео, просто оставив ссылку в строке. Она автоматически будет преобразована в плеер с поддержкой HTML5, без flash и iframe. Но плюс вставки через шорткат - видео будет вставлено со специальным css-классом, что позволяет настраивать размер и прочие свойства вставляемого видео.

В очередной раз убедился, что нужно не забывать читать информацию про обновления. Оказывается давно есть такая полезная фича, а я левые плагины использовал.

Блог чутка подзабросил из за завала на работе, очень большие задачи стоят. Времени совсем нет! :(

Кстати, а если есть желающие самостоятельно научиться продвигать сайты в интернете, то стоит посетить соответствующие лекции. Например вот курсы SEO: http://www.danco.com.ua/seoprof.html. Не обязательно самому продвигать сайт, совсем нет. Ведь можно пройти курсы и контролировать студию, где заказали продвижение, чтобы точно не обманывали.

Последнее изменение записи: 28.12.2015 | Рубрика: Работа | Метки: , , , , ,
Плюсануть
Поделиться
Класснуть