Шорткод для вывода миниатюры видео из Vimeo

Шорткод для вывода миниатюры видео из Vimeo | n-wp.ru

Видеохостинг Vimeo является вторым по популярности после YouTube, и широкая известность вполне объяснима – сервис предоставляет хорошие возможности для популяризации своего видео, давая пользователям средства для легкого распространения видео в социальных сетях, голосования за понравившиеся ролики, коды для интеграции в любую страницу сайта. Кстати, хочу отметить, что качество воспроизведения видео в Vimeo лучше, чем в YouTube. Для каждого ролика сервис создает несколько скриншотов. Мне понадобилось не просто вставлять видео из Vimeo в блог, но и делать это в виде миниатюры, а не внедренного объекта. Такой подход иногда бывает удобнее традиционного – миниатюру можно использовать в анонсах, можно поверх нее выводить определенный текст, миниатюры, в отличие от вставленного видео, попадают в RSS, да и блог с картинками грузится быстрее, чем блог с видео. Изучив этот вопрос, я сделал шорткод, который выводит миниатюру видео из Vimeo, которая является ссылкой-картинкой, ведущей на страницу с видео.

Шорткод для вывода миниатюры видео из Vimeo

Сначала нужно получить прямую ссылку на миниатюру. В Vimeo не все так просто, как в YouTube, и чтобы получить миниатюру, нужно расковырять конфигурационный файл, соответствующий ID ролика, и извлечь из него необходимые данные. Для этого я создал в файле functions.php специальную функцию (помог мне в этом вот этот материал), возвращающую ссылку на миниатюру, используя ID ролика.

function getVimeoInfoThumb($id, $info = 'thumbnail_large') {
	if (!function_exists('curl_init')) die('CURL не установлен!');
	$ch = curl_init();
	curl_setopt($ch, CURLOPT_URL, "http://vimeo.com/api/v2/video/$id.php");
	curl_setopt($ch, CURLOPT_HEADER, 0);
	curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
	curl_setopt($ch, CURLOPT_TIMEOUT, 10);
	$output = unserialize(curl_exec($ch));
	$output = $output[0][$info];
	curl_close($ch);
	return $output;
}

Функция возвращает ссылку на миниатюру хорошего качества – thumbnail_large, которая обычно по ширине где-то 480 точек, но можно использовать и меньшие варианты – thumbnail_medium и thumbnail_small. Теперь осталось воспользоваться этой функцией, и сделать ссылку-картинку, которую можно вывести в посте с помощью шорткода. Для этого нужно вставить в файл functions.php следующий код:

function wp_vimeo_video_thumbnail($atts) {
     extract(shortcode_atts(array(
          'id' => ''
     ), $atts));
    
    return '

    ';
}
add_shortcode('vm', 'wp_vimeo_video_thumbnail');

Этот шорткод выводит миниатюру видео из Vimeo, делая ее ссылкой на ролик. Чтобы придать этой миниатюре индивидуальный вид, можно добавить в файл style.css используемой вами темы оформление:

.vm-main-div     {...} /* оформление всего элемента, включающего в себя ссылку-картинку */
.vm-link         {...} /* оформление для ссылки-картинки - можно добавить или убрать подчеркивание, рамку */
.vm-main-div-img {...} /* оформление картинки - можно добавить отступы, рамку, прозрачность */

Шорткод используется так:

[vm id="ID"]

ID – это ID ролика, который можно узнать из его адреса.

Шорткод для вывода миниатюры видео из Vimeo

В код я добавил rel=”lightbox[vimeo]”. Есть плагины, которые открывают видео в отдельном модальном окне, не переходя на страницу с видео (например, Orange Box) – эта добавка специально для них. Если же она мешает, то lightbox[vimeo] из rel можно убрать (или заменить rel=”lightbox[vimeo]” на class=”lightbox”).

Пользуйтесь!

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

Автор tiaurus 2182 Articles
Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

Оставьте первый комментарий

Оставить комментарий

Ваш электронный адрес не будет опубликован.


*