Здравствуйте!
На самом деле это можно реализовать и без плагина. Но и плагин также имеется. Готовый плагин (возможно, вам придется чуть покопаться в документации плагина, так как там подробно написано, как исопльзовать аякс и т.д.)
Плагин - Essential Grid
https://codecanyon.net/item/essential-grid-wordpre...
Если вы планируете реализовать это "без готового плагина", то можно сделать следующим образом:
- создайте кастомный тип записи для добавления видео.
Пример -
//Видео
add_action('init', 'register_post_types');
function register_post_types(){
register_post_type('video', array(
'label' => 'Видео',
'labels' => array(
'name' => 'Видео',
'singular_name' => 'Видео',
'add_new' => 'Добавить новое',
'add_new_item' => 'Введите заголовок',
'edit_item' => 'Редактирование видео',
'new_item' => 'Новое видео',
'view_item' => 'Посмотреть видео',
'search_items' => 'Искать видео',
'not_found' => 'Видео не найдено',
'not_found_in_trash' => 'В корзине видео не найдено',
'parent_item_colon' => '',
'menu_name' => 'Видео',
),
'description' => 'Видео для сайта',
'public' => true,
'publicly_queryable' => true,
'exclude_from_search' => false,
'show_ui' => true,
'show_in_menu' => true,
'show_in_admin_bar' => true,
'menu_position' => 24,
'menu_icon' => 'dashicons-format-video',
'capability_type' => 'post',
'map_meta_cap' => true,
'hierarchical' => false,
'supports' => array('title','editor','author','thumbnail'),
'taxonomies' => array('videocat'),
'has_archive' => true,
'rewrite' => array('slug' => 'videos', 'with_front' => false),
'query_var' => true,
) );
}
- установите ACF, исопльзуйте тип поля oembed для добавления видео.
https://www.advancedcustomfields.com/resources/oembed/
Код для парсинга картинки видео из агрегаторов.
// Grab video thumbnail from oembed
function get_video_thumbnail_uri( $video_uri ) {
$thumbnail_uri = '';
// determine the type of video and the video id
$video = parse_video_uri( $video_uri );
// get youtube thumbnail
if ( $video['type'] == 'youtube' )
$thumbnail_uri = 'https://img.youtube.com/vi/' . $video['id'] . '/mqdefault.jpg';
// get vimeo thumbnail
if( $video['type'] == 'vimeo' )
$thumbnail_uri = get_vimeo_thumbnail_uri( $video['id'] );
// get wistia thumbnail
if( $video['type'] == 'wistia' )
$thumbnail_uri = get_wistia_thumbnail_uri( $video_uri );
// get default/placeholder thumbnail
if( empty( $thumbnail_uri ) || is_wp_error( $thumbnail_uri ) )
$thumbnail_uri = '';
//return thumbnail uri
return $thumbnail_uri;
}
// Parse the video uri/url to determine the video type/source and the video id
function parse_video_uri( $url ) {
// Parse the url
$parse = parse_url( $url );
// Set blank variables
$video_type = '';
$video_id = '';
// Url is http://youtu.be/xxxx
if ( $parse['host'] == 'youtu.be' ) {
$video_type = 'youtube';
$video_id = ltrim( $parse['path'],'/' );
}
// Url is http://www.youtube.com/watch?v=xxxx
// or http://www.youtube.com/watch?feature=player_embedded&v=xxx
// or http://www.youtube.com/embed/xxxx
if ( ( $parse['host'] == 'youtube.com' ) || ( $parse['host'] == 'www.youtube.com' ) ) {
$video_type = 'youtube';
parse_str( $parse['query'] );
$video_id = $v;
if ( !empty( $feature ) )
$video_id = end( explode( 'v=', $parse['query'] ) );
if ( strpos( $parse['path'], 'embed' ) == 1 )
$video_id = end( explode( '/', $parse['path'] ) );
}
// Url is http://www.vimeo.com
if ( ( $parse['host'] == 'vimeo.com' ) || ( $parse['host'] == 'www.vimeo.com' ) ) {
$video_type = 'vimeo';
$video_id = ltrim( $parse['path'],'/' );
}
$host_names = explode(".", $parse['host'] );
$rebuild = ( ! empty( $host_names[1] ) ? $host_names[1] : '') . '.' . ( ! empty($host_names[2] ) ? $host_names[2] : '');
// Url is an oembed url wistia.com
if ( ( $rebuild == 'wistia.com' ) || ( $rebuild == 'wi.st.com' ) ) {
$video_type = 'wistia';
if ( strpos( $parse['path'], 'medias' ) == 1 )
$video_id = end( explode( '/', $parse['path'] ) );
}
// If recognised type return video array
if ( !empty( $video_type ) ) {
$video_array = array('type' => $video_type, 'id' => $video_id);
return $video_array;
} else {
return false;
}
}
//Takes a Vimeo video/clip ID and calls the Vimeo API v2 to get the large thumbnail URL.
function get_vimeo_thumbnail_uri( $clip_id ) {
$vimeo_api_uri = 'http://vimeo.com/api/v2/video/' . $clip_id . '.php';
$vimeo_response = wp_remote_get( $vimeo_api_uri );
if( is_wp_error( $vimeo_response ) ) {
return $vimeo_response;
} else {
$vimeo_response = unserialize( $vimeo_response['body'] );
return $vimeo_response[0]['thumbnail_large'];
}
}
//Takes a wistia oembed url and gets the video thumbnail url.
function get_wistia_thumbnail_uri( $video_uri ) {
if ( empty($video_uri) )
return false;
$wistia_api_uri = 'http://fast.wistia.com/oembed?url=' . $video_uri;
$wistia_response = wp_remote_get( $wistia_api_uri );
if( is_wp_error( $wistia_response ) ) {
return $wistia_response;
} else {
$wistia_response = json_decode( $wistia_response['body'], true );
return $wistia_response['thumbnail_url'];
}
}
- Подключите необходимые скрипты. Например, magnific popup для открытия видео при клике в попапе.
dimsemenov.com/plugins/magnific-popup
Пример реализации видео с катомным типом записи, с кастомным полем и парсером миниатюры -
https://md7.info/video
Останется только добавить необходимый код для ajax подгрузки / сортировки видео.
