April 27, 2017

Add Facebook Embedded Videos Social Plugin to Blogspot Blog


Embedded videos is a new method to embed public videos posted in Facebook to the content of your website or webpage or blogger site. These videos can be posted by a Facebook page or a person. Facebook Embedded videos Social Plugin is used to embed posts on a specific topic or a page.

How to Get URL of Video from Facebook

Go to the video which you want to embed.
Move your mouse pointer towards right and a small down arrow option will appear.
Select the down arrowand select"Get Link".

Facebook for embedded video get link
Get link
A pop up window will appear.

Facebook for embedded video Share code
Facebook for embedded video Share code
You will get a URL like:https://www.facebook.com/akhils783/videos/577843548966344/?l=1147996881095844496

Copy the URL of the video.

First Method: How To Get Embedded Videos Social Plugin Code from Facebook

Go toAll 11 Facebook Social Share Plugins For Blogspot Blogand follow the steps correctly. After that do the following steps.

Go toFB developers Embedded Videos Social Plugin page.

Provide theURL of Video which you want to Embed that you have copied earlier.

Select Get Code and you will get HTML code like the one below;

<div class="fb-video" data-href="https://www.facebook.com/akhils783/videos/577843548966344/?l=1147996881095844496" data-width="500" data-show-text="false"><blockquote cite="https://www.facebook.com/akhils783/videos/577843548966344/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/akhils783/videos/577843548966344/"></a><p>Here’s my Facebook movie. Find yours at https://facebook.com/lookback/ #FacebookIs10</p>Posted by <a href="https://www.facebook.com/akhils783">Akhil S Kumar</a> on Monday, February 10, 2014</blockquote></div>

Copy the HTML tag and not the JavaScript.

Second Method: How to Install Facebook Embedded Videos Social PluginCorrectly To Blogger Template

Go toAll 11 Facebook Social Share Plugins For Blogspot Blogand follow the steps correctly. After that do the following steps.

  1. Go to Blogger
  2. Go to Theme
  3. Select Edit HTML

CSS code to copy

/*---Name:Ship Me This Url: http://www.shipmethis.com/2017/04/all-social-plugins-blogger.html --- */.shipmethis {font-size: 12px;}

Where to Paste the Copied Code

Paste the below CSS before skin code ]]></b:skin>
You can use CTRL+F to find the code.

HTML code to copy

<div class="fb-video" data-href="post your FB video URL here" data-width="500" data-show-text="false"><blockquote cite="post your FB video URL here" class="fb-xfbml-parse-ignore"><a href="post your FB video URL here">post your FB video Title here</a><p>post your FB video Title here</p>Posted by <a href="post your FB Profile URL here">post your FB name here</a> onpost video date here</blockquote></div><div class="shipmethis"><a href="http://www.shipmethis.com/2017/04/all-social-plugins-blogger.html">Get Widget</a></div></div>

Where to Paste the Copied Code

You can add a Gadget to show the embedded video. You can get a new HTML gadget by going to Blogger > Layout > Add a Gadget > HTML/JavaScript

HTML add a gadget in layout of blogger
Click the plus button
Save the Layout.

Where else you can Paste the Copied Code

You can post this code anywhere on the post page.
For that Go to blogger
Select New post
Go to HTML section
Paste anywhere you want
Publish to see the embed FB video.

Hope this post helps. Please Subscribe to the Ship Me This.

Kindly spend 5 seconds to share this post

Search Here

Whats Hot

About Author