Wordpress Embed Youtube In Template
Topics
- Block Editor
- Okay, So What Sites Can I Embed From?
- Usage
- oEmbed
- Does This Work With Any URL?
- How Can I Add or Change Support For Websites?
- Adding Support For An oEmbed-Enabled Site
- Adding Support For A Non-oEmbed Site
- Removing Support for An oEmbed-Enabled Site
- What About oEmbed Discovery?
- External Resources
- Embeds Changelog
It's super easy to embed videos, images, tweets, audio, and other content into your WordPress site.
Block Editor Block Editor
Since WordPress 5.0, the Block Editor has created a simpler way to embed content on our WordPress site. With an Embed Block, simply copy the URL and paste into the block.
For each specific block, there are a number of customization options. You can find instructions for each Block in the table below or via the list of all core Blocks.
Top ↑
Okay, So What Sites Can I Embed From? Okay, So What Sites Can I Embed From?
You can use all of these:
| Service | Block | Embed Type | Since |
|---|---|---|---|
| Amazon Kindle instant previews | Amazon Kindle Block | Videos | WordPress 4.9 |
| Animoto | Animato Block | Videos | WordPress 4.0 |
| Cloudup | Cloudup Block | Videos, Galleries, Images | WordPress 4.4 |
| Crowdsignal | Crowdsignal Block | Polls & Surveys | WordPress 3.0 |
| DailyMotion | DailyMotion Block | Videos | WordPress 2.9 |
| Facebook decided to close the oEmbed end point. | post, activity, photo, video, media, question, note | WordPress 4.7 | |
| Flickr | Flickr Block | Videos & Images | WordPress 2.9 |
| Giphy | Animated GIFs | WordPress 4.7 | |
| Imgur | Imgur Block | Images | WordPress 3.9 |
| Facebook decided to close the oEmbed end point. | Images | WordPress 3.5 | |
| Issuu | Issuu Block | Documents | WordPress 4.0 |
| Kickstarter | Kickstarter Block | Projects | WordPress 4.2 |
| Meetup.com | Meetup.com Block | Various | WordPress 3.9 |
| Mixcloud | Mixcloud Block | Music | WordPress 4.0 |
| Photobucket | Images | WordPress 2.9 | |
| Reddit Block | Posts & Comments | WordPress 4.4 | |
| ReverbNation | ReverbNation Block | Music | WordPress 4.4 |
| Scribd | Scribd Block | Documents | WordPress 2.9 |
| SlideShare | SlideShare Block | Presentation slideshows | WordPress 3.5 |
| SmugMug | SmugMug Block | Various | WordPress 3.0 |
| SoundCloud | SoundCloud Block | Music | WordPress 3.5 |
| Speaker Deck | Speaker Deck Block | Presentation slideshows | WordPress 4.4 |
| Spotify | Spotify Block | Music | WordPress 3.6 |
| TED | TED Block | Videos | WordPress 4.0 |
| TikTok | TikTok Block | Videos | WordPress 5.4 |
| Tumblr | Tumblr Block | Various | WordPress 4.2 |
| Twitter Block | Tweet, profile, list, collection, likes, Moment | WordPress 3.4 | |
| VideoPress | VideoPress Block | Videos | WordPress 4.4 |
| Vimeo | Videos | WordPress 2.9 | |
| WordPress plugin directory | Plugins | WordPress 4.4 | |
| WordPress.tv | WordPress.tv Block | Videos | WordPress 2.9 |
| YouTube | YouTube Block | Videos | WordPress 2.9 |
Notes
- Twitter – older versions of WordPress have issues with https embeds, just remove the s from the https to fix.
- YouTube – only public and "unlisted" videos and playlists – "private" videos will not embed.
- Tumblr – only posts (name.tumblr.com/post/etc) are recognized, not standalone images (name.tumblr.com/image)
Due to Facebook's decision to close the oEmbed end point for embedding Facebook and Instagram links, the block will not work anymore after October 24, 2020. Publishers who want to embed Facebook and Instagram links into their sites will require a developer account and an appid, and provide an authenication token with their call to the endpoint. Facebook Documentation: create an app
Top ↑
Usage Usage
To embed a video or another object into a post or page, place its URL into the content area. Make sure the URL is on its own line and not hyperlinked (clickable when viewing the post).
For example:
Check out this cool video:
http://www.youtube.com/watch?v=dQw4w9WgXcQ
That was a cool video.
WordPress will automatically turn the URL into a YouTube embed and provide a live preview in the visual editor.
Another option is to wrap the URL in the "embed" Shortcode.
// NOTE: Remove space between '[' and 'embed' when you try.
[ embed width="123" height="456"]http://www.youtube.com/watch?v=dQw4w9WgXcQ[/embed]
If WordPress fails to embed the URL, the post will contain a hyperlink to the URL.
Top ↑
oEmbed oEmbed
The easy embedding feature is mostly powered by oEmbed, a protocol for site A (such as your blog) to ask site B (such as YouTube) for the HTML needed to embed content from site B.
oEmbed was designed to avoid the need to copy and paste HTML from the site hosting the media you wish to embed. It supports videos, images, text, and more.
Top ↑
Does This Work With Any URL? Does This Work With Any URL?
No, not by default. WordPress will only embed URLs matching an internal whitelist. This is for security purposes.
Top ↑
How Can I Add or Change Support For Websites? How Can I Add or Change Support For Websites?
Adding support for an additional website depends on whether the site supports oEmbed.
Adding Support For An oEmbed-Enabled Site Adding Support For An oEmbed-Enabled Site
If a site supports oEmbed, you'll want to call wp_oembed_add_provider() to add the site and URL format to the internal whitelist.
Top ↑
Adding Support For A Non-oEmbed Site Adding Support For A Non-oEmbed Site
You'll need to register a handler using wp_embed_register_handler() and provide a callback function that generates the HTML.
Top ↑
Removing Support for An oEmbed-Enabled Site Removing Support for An oEmbed-Enabled Site
If you wish to remove an oEmbed-enabled provider, you'll want to call wp_oembed_remove_provider.
Top ↑
What About oEmbed Discovery? What About oEmbed Discovery?
As of version 4.4, WordPress supports oEmbed discovery, but has severe limitations on what type of content can be embedded via non-whitelisted sites.
Specifically, the HTML and Video content is filtered to only allow links, blockquotes, and iframes, and these are additionally filtered to prevent insertion of malicious content. The HTML is then modified to be sandboxed and to have additional security restrictions placed on them as well.
However, if you feel you are knowledgeable enough to not require this level of safety, you can give unfiltered_html users (Administrators and Editors) the ability to embed from websites that have oEmbed discovery tags in their <head>.
The oEmbed discovery content for "link" and "photo" types is not quite so heavily filtered in this manner, however it is properly escaped for security and to prevent any malicious content from being displayed on the site.
Top ↑
External Resources External Resources
- oEmbed.com – Official oEmbed website with technical details of the spec
Top ↑
Embeds Changelog Embeds Changelog
- 2.9 :
- Introduction of the builtin Embeds support.
- 3.0 :
- Added: SmugMug, FunnyOrDie
- 3.4 :
- Added: Twitter
- 3.5 :
- Embed options were removed from the Settings Media Screen.
- Added: Instagram, SoundCloud, SlideShare
- 3.6 :
- Added: Rdio, Spotify
- 3.9 :
- Removed: Qik (the service shutting down in April 2014)
- 4.0 :
- Major reworking of the preview code showing embeds within the editor wp.mce.views.
- Added: CollegeHumor, Issuu, Mixcloud, YouTube playlists, TED talks
- Removed: Viddler (removed due to the service shutting down their oEmbed endpoint)
- 4.1 :
- Added: Vine
- 4.2 :
- Added: Kickstarter, Tumblr
- Removed: Revision3
- 4.4 :
- Added: ReverbNation, Cloudup, Reddit, SpeakerDeck, VideoPress
- Removed: Blip
- 4.4.1 :
- Removed: Rdio (Service shut down)
- 4.5 :
- Added: Twitter Moment, collection
- 4.7 :
- Added: Twitter profile, list, likes
- Added: Facebook post, activity, photo, video, media, question, note
- 5.1 :
- Renamed: PollDaddy service has been renamed to Crowdsignal
- 5.6 :
- Added section about the Block Editor for embeds, created a new column for Block Editor documentation links, note about Facebook and Instagram ending OAuth, updated Codex links, added a new changelog and reordered page.
- Added: TikTok
- Removed: Blip, Hulu, CollegeHumor, FunnyOrDie.com and Vine
Changelog
- Updated 2020-12-08
- Added section about the Block Editor for embeds, created a new column for Block Editor documentation links, note about Facebook and Instagram ending OAuth, added new Changelog, updated Codex links and reordered page.
- Added: TikTok
- Removed: Blip, Hulu, CollegeHumor, FunnyOrDie.com and Vine; Some external links that violated our external linking policy or were out-of-date.
Wordpress Embed Youtube In Template
Source: https://wordpress.org/support/article/embeds/
0 Komentar