How to Embed Facebook Videos in WordPress Posts and Pages

Embedding a Facebook video in a WordPress post or page means inserting a live, playable video player directly into your content using either a URL-based oEmbed handshake or an iframe snippet — no file uploads required. WordPress handles this natively through its built-in oEmbed provider list, which includes Facebook, meaning a raw video URL pasted into the editor is enough to render a fully functional player on the front end.

This guide covers every available method in technical depth: the Gutenberg block editor, the Classic Editor, Facebook's native embed code, and third-party plugins. It also addresses the authentication changes Facebook introduced in 2018 and 2023 that break naive URL-pasting for many users — a critical detail most tutorials omit entirely.

Why Facebook Video Embedding Is More Complex Than It Looks

Facebook deprecated its anonymous oEmbed endpoint in October 2020. Since then, any oEmbed request to graph.facebook.com/oembed_video requires a valid Facebook App ID and a registered domain. WordPress core still lists Facebook as a supported oEmbed provider, but without a configured App ID, the embed silently fails and renders only a placeholder or a raw URL.

This is the single most common reason WordPress developers find that pasting a Facebook video URL "just doesn't work" on production sites, even though it appears to work in some local or cached environments.

Understanding this constraint determines which method you should use.

Method 1: Gutenberg Block Editor with the Facebook Embed Block

The Gutenberg block editor provides a dedicated Embed block with a Facebook variant. This is the recommended path for most WordPress installations running version 5.0 or later.

Step 1: Copy the Correct Facebook Video URL

Not all Facebook video URLs are equivalent. Use the canonical share URL, not the URL from your browser's address bar while watching a video in full-screen mode.

1. Navigate to the Facebook video in your browser.
2. Click the three-dot menu (...) in the top-right corner of the post.
3. Select Copy link.

The resulting URL should follow one of these formats:

• https://www.facebook.com/username/videos/1234567890/
• https://www.facebook.com/watch/?v=1234567890
• https://fb.watch/xxxxxxxxxx/

Avoid using URLs that contain /reel/ if you intend to embed a standard video — Reels use a different endpoint and may not resolve correctly through the standard oEmbed path.

Step 2: Open Your Post or Page in the Block Editor

In your WordPress dashboard, navigate to Posts or Pages and open the content item you want to edit. Click the + icon to add a new block at the desired position.

Step 3: Insert the Facebook Embed Block

Type Facebook in the block search field or navigate to Embeds in the block panel. Select the Facebook block. A URL input field appears.

Step 4: Paste the Video URL and Embed

Paste the copied URL into the input field and press Enter or click Embed. WordPress sends an oEmbed request to Facebook's API. If a valid App ID is configured (see the App ID section below), the video player renders immediately in the editor preview.

If you see the message *"Sorry, this content could not be embedded"*, the issue is almost certainly the missing App ID — not the URL format.

Step 5: Publish or Update

Click Publish or Update. The embedded player is now live on the front end.

Method 2: Classic Editor (URL on Its Own Line)

For sites still running the Classic Editor plugin or WordPress versions prior to 5.0, the oEmbed mechanism works through a different code path but relies on the same underlying API.

Steps

1. Copy the Facebook video URL using the same process described above.
2. Open your post or page in the Classic Editor.
3. Switch to the Visual tab (not Text/HTML).
4. Paste the URL on its own line, with no surrounding text, no hyperlink markup, and no trailing characters.
5. Click Publish or Preview.

WordPress's WP_oEmbed class intercepts the URL during the_content filter processing and replaces it with the iframe markup returned by Facebook's oEmbed endpoint.

Critical pitfall: If you paste the URL inside a paragraph with other text, WordPress will not trigger oEmbed resolution. The URL must occupy a standalone paragraph node in the post content.

Method 3: Facebook's Native Embed Code (iframe)

This method bypasses WordPress's oEmbed system entirely and works regardless of App ID configuration. It is the most reliable option for public videos.

How to Get the Embed Code

1. Navigate to the Facebook video.
2. Click the three-dot menu (...) and select Embed.
3. Facebook generates an <iframe> snippet. Copy the full snippet.

A typical Facebook video embed snippet looks like this:

<iframe
  src="https://www.facebook.com/plugins/video.php?height=314&href=https%3A%2F%2Fwww.facebook.com%2Fusername%2Fvideos%2F1234567890%2F&show_text=false&width=560&t=0"
  width="560"
  height="314"
 
  scrolling="no"
  frameborder="0"
  allowfullscreen="true"
  allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share">
</iframe>

Inserting the iframe in WordPress

In Gutenberg: Add a Custom HTML block and paste the iframe code directly.

In the Classic Editor: Switch to the Text tab (HTML view) and paste the iframe at the desired position. Do not paste it in the Visual tab — WordPress will strip or escape the HTML.

Making the iframe Responsive

Facebook's default iframe uses fixed pixel dimensions, which breaks on mobile viewports. Wrap it in a responsive container:

<div>
  <iframe
    src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fusername%2Fvideos%2F1234567890%2F&show_text=false&width=560"
   
    scrolling="no"
    frameborder="0"
    allowfullscreen="true"
    allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share">
  </iframe>
</div>

The padding-bottom: 56.25% value maintains a 16:9 aspect ratio. Adjust to 75% for 4:3 content.

Fixing the Facebook App ID Requirement

If you want WordPress's native oEmbed method (Methods 1 and 2) to work reliably, you must register a Facebook App and provide its ID to WordPress.

Step 1: Create a Facebook App

1. Go to developers.facebook.com and log in.
2. Click My Apps > Create App.
3. Select the Consumer app type.
4. Complete the setup wizard. You do not need to submit the app for review for basic oEmbed usage.
5. From the app dashboard, copy your App ID.

Step 2: Add the App ID to WordPress

The cleanest approach is to add the App ID via your theme's functions.php or a site-specific plugin:

add_filter( 'oembed_fetch_url', function( $provider, $url, $args ) {
    if ( strpos( $provider, 'facebook.com' ) !== false ) {
        $provider = add_query_arg( 'access_token', 'YOUR_APP_ID|YOUR_CLIENT_TOKEN', $provider );
    }
    return $provider;
}, 10, 3 );

Replace YOUR_APP_ID and YOUR_CLIENT_TOKEN with the values from your Facebook App dashboard under Settings > Advanced > Client Token.

Alternatively, several plugins handle this automatically — notably Embed Plus for Facebook and WP Facebook oEmbed Fix.

Method 4: Third-Party Plugins for Advanced Control

Plugins are the right choice when you need features beyond basic playback: custom player dimensions, lazy loading, GDPR consent gates, or feed-based embedding.

Smash Balloon Social Post Feed is the most widely deployed option. After installation and Facebook account authorization, it provides a shortcode and a Gutenberg block with granular controls over player width, autoplay behavior, and caption display.

Embed Plus for Facebook focuses specifically on oEmbed authentication and is a lightweight solution if your only goal is fixing the App ID problem without adding a full social feed plugin.

WP YouTube Lyte / Embed Optimizer (from the WordPress Performance team) can lazy-load Facebook embeds to prevent the iframe from blocking page rendering — a meaningful Core Web Vitals improvement on content-heavy pages.

Method Comparison

Performance and Core Web Vitals Considerations

Facebook's embed iframe loads multiple third-party scripts from connect.facebook.net, which can add 200–600ms of render-blocking latency and negatively affect Largest Contentful Paint (LCP) and Total Blocking Time (TBT) scores.

Practical mitigations:

• Facade pattern: Replace the iframe with a static thumbnail and load the real player only on user click. The Lite YouTube Embed approach can be adapted for Facebook using a custom facade.
• loading="lazy" attribute: Add loading="lazy" to the iframe tag to defer loading until the element enters the viewport.
• Self-hosted video alternative: If the video is your own content, consider uploading it directly to WordPress media or hosting it on a VPS with a video streaming configuration. This eliminates third-party script dependency entirely.

For high-traffic WordPress sites where page speed directly affects conversion, running your own server infrastructure on a Dedicated Server gives you full control over caching headers, CDN integration, and script loading order — none of which are available on shared environments.

Privacy, GDPR, and Cookie Consent

When a visitor loads a page containing a Facebook embed, Facebook's scripts set third-party cookies and may collect behavioral data — even if the visitor has no Facebook account. Under GDPR (EU), LGPD (Brazil), and CCPA (California), this constitutes third-party data processing that requires explicit user consent before the iframe loads.

Implement a consent gate using a plugin like Complianz or Cookiebot, which replaces the iframe with a placeholder until the user accepts the relevant cookie category. This is not optional for sites with EU traffic — it is a legal requirement.

Troubleshooting Common Embedding Failures

Video shows a placeholder or broken embed in the editor but works on the front end: This is a known Gutenberg rendering issue. The editor preview uses the admin user's session, which may not have the correct oEmbed cache. Clear the oEmbed cache by deleting the _oembed_* post meta entries for the affected post, or use the WP-CLI command:

wp post meta delete <post_id> --match-prefix=_oembed_

"Sorry, this content could not be embedded" on the front end: Almost always caused by the missing App ID. Follow the App ID configuration steps above.

Video embeds correctly but disappears after a WordPress update: WordPress periodically updates its oEmbed provider list. A Facebook API endpoint change can break existing embeds. Check the wp-includes/class-oembed.php provider list and compare against Facebook's current documented endpoint.

Embed works in staging but not in production: Facebook's oEmbed API validates the requesting domain against the App's allowed domains list. Add your production domain to the Facebook App's App Domains field under Settings > Basic.

Private or group videos cannot be embedded: Facebook's oEmbed API only serves publicly accessible videos. There is no supported workaround for private content — the only option is to download the video and host it independently, for example on a VPS with cPanel with a media directory configured for direct streaming.

Hosting Considerations for WordPress Sites Embedding Rich Media

Pages with embedded video iframes are significantly heavier than standard content pages. Each Facebook embed triggers DNS lookups, TCP handshakes, and script downloads from Facebook's CDN on every uncached page load.

If your WordPress site runs on Shared Web Hosting, server-side processing time is not the bottleneck — the client-side third-party requests are. However, if you also self-host video files or run a media-heavy site, shared hosting's bandwidth and I/O limits become relevant constraints.

For sites that combine embedded social video with original media content, a VPS Hosting environment with object caching (Redis or Memcached), a full-page cache (Nginx FastCGI cache or Varnish), and a properly configured CDN will deliver measurably better Core Web Vitals scores than any shared environment.

Securing your WordPress admin and embed endpoints with a valid SSL certificate is also non-negotiable — Facebook's API will refuse to serve oEmbed responses to non-HTTPS origins. If your site is not yet on HTTPS, start with an SSL Certificate before troubleshooting any embed issues.

Key Technical Takeaways

• Facebook's oEmbed endpoint has required an App ID since October 2020. Any tutorial that does not mention this is outdated.
• The Gutenberg Embed block and Classic Editor URL method both depend on the same WP_oEmbed class and the same App ID requirement.
• The Facebook native iframe method is the most reliable fallback for public videos and requires no API credentials.
• Fixed-dimension iframes must be wrapped in a responsive CSS container for correct mobile rendering.
• Facebook embeds load third-party scripts that affect Core Web Vitals. Implement lazy loading or a facade pattern on performance-sensitive pages.
• GDPR compliance requires a consent gate before the iframe loads — not just a cookie banner.
• Private Facebook videos cannot be embedded on external sites through any supported method.
• Always verify your production domain is listed in the Facebook App's allowed domains to prevent staging-to-production breakage.

Frequently Asked Questions

Why does my Facebook video embed show a broken placeholder instead of the video?

The most likely cause is a missing or misconfigured Facebook App ID. Since October 2020, Facebook's oEmbed API requires a registered App ID with your domain listed under allowed domains. Configure the App ID in WordPress using the oembed_fetch_url filter or install a plugin that handles this automatically.

Can I embed a private Facebook video in WordPress?

No. Facebook's oEmbed API only resolves publicly accessible video URLs. Videos restricted to friends, groups, or specific audiences cannot be embedded on external websites through any supported method. The only alternative is to download the video and host it on your own server.

Does embedding Facebook videos slow down my WordPress site?

Yes, measurably. Each Facebook embed loads scripts from connect.facebook.net that add render-blocking latency. Mitigate this by adding loading="lazy" to the iframe, implementing a click-to-load facade, or using a plugin like Embed Optimizer to defer script execution.

Do I need a plugin to embed Facebook videos in WordPress?

Not necessarily. WordPress supports Facebook oEmbed natively, but you must have a valid App ID configured for it to work post-2020. If you use the native iframe embed code from Facebook directly, no plugin is required at all.

Is it legal to embed Facebook videos on my website?

Embedding publicly shared Facebook videos using Facebook's official embed mechanism is generally permitted under Facebook's Terms of Service, provided the original video does not infringe copyright. However, embedding triggers Facebook's tracking scripts, which creates GDPR obligations for sites with EU visitors. Always implement a cookie consent gate before loading the iframe.