WordPress почав підтримувати oEmbed з версії 2.9, щоб зробити поширення контенту простіше. Тепер користувачі можуть просто вставити URL відео YouTube (або будь-якого іншого сайту, що підтримується) і WordPress автоматично вставить контент.
Як працює oEmbed?
Ідея oEmbed - Надати стандартне рішення для поширення контенту. Так що, коли ви вставляєте посилання на провайдера, що підтримується oEmbed, у WordPress або в будь-яку підтримувану oEmbed платформу, потім він буде шукати заголовок oEmbed в URL провайдера. Знайшовши заголовок oEmbed, він надсилає стандартний запит на цей сайт. Цей запит потім повертає стандартну та структуровану відповідь. Ця відповідь використовується для відображення контенту на вашій платформі.
Приклад:
Ми хочемо вставити це відео на ваш сайт. Він розміщений на YouTube, і, якщо ви подивитеся на вихідний код відео сторінки, ви побачите такі рядки:
<link rel="alternate" type="application/json+oembed" href="http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DpFDoCLf96Kg&format=json" title="Rebecca MacKinnon: Let's take back the Internet!"> <link rel="alternate" type="text/xml+oembed" href="http://www.youtube.com/oembed?url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DpFDoCLf96Kg&format=xml" title="Rebecca MacKinnon: Let's take back the Internet!">
Ці рядки роблять основний вбудований контент на веб-сторінці доступним. Перший рядок надає посилання на JSON відповідь, другий рядок - на XML відповідь.
Якщо ваша платформа підтримує oEmbed, потім він звертається до одного з URL і отримає приблизно таку відповідь від одного з цих посилань:
JSON відповідь:
{
"provider_url": "http://www.youtube.com/",
"thumbnail_url": "http://i1.ytimg.com/vi/pFDoCLf96Kg/hqdefault.jpg",
"title": "Rebecca MacKinnon: Let's take back the Internet!",
"html": "u003ciframe width="480" height="270" src="http://www.youtube.com/embed/pFDoCLf96Kg?fs=1u0026feature=oembed" frameborder="0" allowfullscreenu003eu003c/iframeu003e",
"author_name": "TEDtalksDirector",
"height": 270,
"thumbnail_width": 480,
"width": 480,
"version": "1.0",
"author_url": "http://www.youtube.com/user/TEDtalksDirector",
"provider_name": "YouTube",
"type": "video",
"thumbnail_height": 360
}
XML відповідь:
<oembed> <provider_url>http://www.youtube.com/</provider_url> <thumbnail_url>http://i1.ytimg.com/vi/pFDoCLf96Kg/hqdefault.jpg</thumbnail_url> <title>Rebecca MacKinnon: Let's take back the Internet!</title> <html> <iframe width="480" height="270" src="http://www.youtube.com/embed/pFDoCLf96Kg?fs=1&feature=oembed" frameborder="0" allowfullscreen></iframe> </html> <author_name>TEDtalksDirector</author_name> <height>270</height> <thumbnail_width>480</thumbnail_width> <width>480</width> <version>1.0</version> <author_url>http://www.youtube.com/user/TEDtalksDirector</author_url> <provider_name>YouTube</provider_name> <type>video</type> <thumbnail_height>360</thumbnail_height> </oembed>
Тепер це структуровані дані, які надають всю необхідну інформацію для вставлення контенту на ваш сайт.
oEmbed в WordPress
WordPress підтримує oEmbed, але не всі oEmbed провайдери підтримуються за замовчуванням. Функціональність для цього є, але дозвіл вставки в власні сайти будь-якого oEmbed контенту по oEmbed посиланням було б діркою в безпеці сайту. Щоб захиститися від цього, WordPress має свій внутрішній білий список сайтів, для яких вставка автоматично увімкнена. На момент написання цієї статті за умовчанням підтримувалися такі oEmbed провайдери:
- YouTube
- Vimeo
- DailyMotion
- Flickr
- Hulu
- Viddler
- Scribd
- wordpress.tv
- SmugMug
- FunnyOrDie.com
- Qik
- Перегляд3
- blip.tv
- Photobucket
- PollDaddy
Список зберігається в WP-включає в себе → клас-oembed.php (Не редагуйте цей файл). Тим не менш, ви можете додати більше oEmbed провайдерів, використовуючи функцію wp_oembed_add_provider().
Додавання SlideShare як oEmbed провайдера WordPress
SlideShare - один з популярних сайтів, які підтримують oEmbed та не входять у білий лист oEmbed WordPress. Так що якщо ви додаєте багато SlideShare контенту до вашого сайту, можливо, ви захочете спростити вставку контенту. Щоб це зробити, ми додамо SlideShare як oEmbed провайдера в наш WordPress. Ми будемо використовувати функцію wp_oembed_add_provider(). Ця функція має три аргументи:<?php wp_oembed_add_provider( $format, $provider, $regex ); ?>
- $ формат — обов'язковий аргумент, який повідомляє WordPress, який тип структури URL-провайдера.
- $provider також обов'язковий, це основна URL-провайдера, до якого будуть направлені всі запити.
- $regex — необов'язковий аргумент, який повідомляє WordPress, що формат URL — regex string (True) або загальна схема (False), за промовчанням значення false.
Щоб додати SlideShare як oEmbed провайдера, ми додаємо у файл functions.php нашої теми наступний код:
wp_oembed_add_provider( 'http://www.slideshare.net/*/*', 'http://www.slideshare.net/api/oembed/2' );
Ми отримали формат URL та базовий URL з офіційного сайту oEmbed. Якщо провайдер не перерахований у списку oEmbed провайдерів, це не означає, що він не може скористатися oEmbed. Більшість провайдерів на сайті мають сторінку oEmbed API, яка описує, що вам потрібно знати, щоб скористатися цими можливостями.
Тепер, щоб вставити слайд SlideShare, все, що вам потрібно зробити, це скопіювати URL-адресу з адресного рядка і вставити його при редагуванні запису.
Додавання Instagram як oEmbed провайдера WordPress
Щоб потренуватися, давайте додамо інший популярний провайдер oEmbed на наш WordPress сайт. На цей раз ми додамо Instagram. Ось код:
wp_oembed_add_provider( 'http://instagr.am/*/*', 'http://api.instagram.com/oembed' ); wp_oembed_add_provider( 'http://www.instagram.com/*/*', 'http://api.instagram.com/oembed' );
Зверніть увагу, що ми додаємо instagram.com и instagr.am як різні провайдери, щоб переконатися, що і звичайні, і скорочені URL працюватимуть правильно.
плагін Embedly для вставки контенту з різних джерел
Embedly надає прості рішення для вставки і для провайдерів, і для власників сайтів. У них є безкоштовний WordPress плагін, який дозволяє вставляти контент із більш ніж 200 джерел, просто вставляючи URL-адресу. Він підтримує такі сайти як Tumblr, Wikipedia, deviantart, twitpic і т.п.Мені здається, що використовувати Embedly замість того, щоб додавати вручну oEmbed і не-oEmbed провайдери, — досить безпечно. Я пробував тестувати Embedly зі стандартною темою WordPress TwentlyEleven, вставляючи URL для популярних контент-провайдерів. Результати були задовільні. Думаю, основні переживання власників сайтів будуть про те, щоб вставки відповідали їхньому контенту і не виглядали потворно.
Висновок
Поширення контенту стало важливим аспектом взаємодії людей у мережі. Як власник сайту, я відчуваю себе зобов'язаним забезпечити прості рішення для поширення контенту для відвідувачів мого сайту та авторів. oEmbed спрощує це для мене. Але доки я писав цей пост, я запитував себе, чи знають користувачі WordPress, що їм не потрібний код вставки для деяких провайдерів? Я думаю, крім YouTube, користувачі WordPress не знають, які провайдери підтримуються.
Джерело: WPLift.com
Коментарі до запису: 7
Мені так здалося, що oEmbed дуже непоганий плагін. Потрібно буде випробувати.
oEmbed це сама технологія, формат для відкритого "підтягування" контенту. Плагін називається Embedly.
При спробі лайкнути на ФБ лайкається зовсім інший запис.
Вже займаємося цією проблемою, дякую.
Thank you WPB..your articles have been so helpful!
Для вбудовування Instagram галереї я використовую BadgePLZ.com
Доброго дня! А як зробити щоб у СХОДНІ МАТЕРІАЛИ мініатюри були із закругленими краями як у вас на блозі?