oembed_dataparse
Дозволяє змінити контент (HTML), що створюється при вбудовуванні URL, що підтримуються oEmbed форматом WordPress. Зміна відбувається перед кешуванням.
Що таке oEmbed читайте тут: oEmbed у WordPress
За обробку oEmbed URL відповідає метод WP_Embed::shortcode() .
Використання
add_filter( 'oembed_dataparse', 'wp_kama_oembed_dataparse_filter', 10, 3); /** * Function for `oembed_dataparse` filter-hook. * * @param string $return Returned oEmbed HTML. * @param object $data A data object result from an oEmbed provider. * @param string $url URL-адреса вмісту, щоб бути embedded. * * @return string */ function wp_kama_oembed_dataparse_filter( $return, $data, $url ){ // Filter... return $return; }
-
$return
(рядок) oEmbed HTML код.
Допустимо, ми вставили в контент посилання на YouTube ролик:
https://www.youtube.com/watch?v=RNFRCz0whuw
WordPress при відображенні контенту запису зробить такий http запит і збереже його:
https://www.youtube.com/oembed ?maxwidth=840 &maxheight=1000 &url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DRNFRCz0whuw &dnt=1 &format=json
Тепер відповідь на запит можна буде відфільтрувати. Фільтр отримає такий рядок у цьому параметрі:
<iframe width="200" height="113" src="https://www.youtube.com/embed/RNFRCz0whuw?feature=oembed" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
-
$data
(об’єкт) Об’єкт oEmbed.
stdClass Object( [html] => <iframe width="200" height="113" src="https://www.youtube.com/embed/RNFRCz0whuw?feature=oembed" frameborder="0" allow="autoplay; encrypted- media" allowfullscreen></iframe> [thumbnail_height] => 360 [author_url] => https://www.youtube.com/channel/UC4mPz031whiFiY5ZSuXoYGg [provider_name] => YouTube [provider_url] => https://www.youtube.com/ [thumbnail_url] => https://i.ytimg.com/vi/RNFRCz0whuw/hqdefault.jpg [author_name] => wp-plus [type] => video [thumbnail_width] => 480 [width] => 200 [version] => 1.0 [height] => 113 [title] => Як створити шаблон сторінки WordPress, запису або іншого типу посту - уроки та розробка WP )
-
$url
(рядок) Оригінальний URL за яким спрацювало вбудовування.
https://www.youtube.com/watch?v=RNFRCz0whuw
Приклади
#1 Адаптивний (гумовий) плеєр YouTube
Часто можна побачити, як плеєр YouTube намагаються зробити адаптивним за допомогою JavaScript, але це краще робити на чистому CSS. Співвідношення сторін (пропорції) плеєра буде дотримано.
Додаємо обгортку для плеєра YouTube, наприклад у functions.php теми:
# Адаптивний (гумовий) плеєр YouTube add_filter( 'oembed_dataparse', 'adaptive_youtube_iframe', 10, 2); function adaptive_youtube_iframe( $return, $data ) { if ( 'YouTube' === $data->provider_name ) $return = "<div class='youtube-container'>{$return}</div>"; return $return; }
Тепер додаємо стилі, наприклад, у style.css теми:
.youtube-container { position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden; } .youtube-container iframe, .youtube-container object, .youtube-container embed { position:absolute; top:0; left:0; width:100%; height:100%; }
#2 Кастомне виведення плеєра YouTube
Нехай за завданням виведення плеєра YouTube має відповідати наступній верстці:
<div class="basePage__video"> <div class="basePage__player"> iframe YouTube </div> <div class="basePage__caption">Назва ролика</div> </div>
Модифікуємо код для YouTube:
add_filter( 'oembed_dataparse', function ( $return, $data ) { if ( 'YouTube' !== $data->provider_name ) { return $return; } return str_replace( "t", '', sprintf( ' <div class="basePage__video"> <div class="basePage__player">%s</div> <div class="basePage__caption">%s</div> </div> ', $ return, $ data->title )); }, 10, 2);
Довелося застосувати str_replace(), щоб видалити таби з коду (генеруються під час форматування в редакторі коду), оскільки після обробки іншими функціями з’являється тег </p> у коді, що потенційно може зламати верстку сторінки.
Отримаємо:
Згенерований код:
<div class="basePage__video"> <div class="basePage__player"> <iframe title="Відкриття сезону. Шостакович. Симфонія №1" width="500" height="281" src="https://www.youtube.com/embed/FCP4FtWRkPw?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> <div class="basePage__caption">Відкриття сезону. Шостакович. Симфонія №1</div> </div>
список змін
З версії 2.9.0 | Введено. |
Де викликається хук
return apply_filters( 'oembed_dataparse', $return, $data, $url );
Де використовується хук у WordPress
add_filter( 'oembed_dataparse', 'wp_filter_oembed_iframe_title_attribute', 5, 3);
add_filter( 'oembed_dataparse', 'wp_filter_oembed_result', 10, 3);