Embedding a Facebook video using Embedded Video Player Configurator will not make any problem when viewed using your laptop, pc, mobile, tablet, etc. But embedding a Facebook live video is a little different when viewed using mobile phone.


You see, when you embed a live video using Facebook's Embedded Video Player Configurator, the stream will play smoothly on computer, but not on mobile devices.

Today, you will be able to play a Facebook live video using your mobile phone. See tutorial below.

NOTE: I will be using Google Chrome browser for this tutorial.

1. First, you need to find a live video on Facebook. Using your FB account, go to the Search box and type "live now". And then press the search logo or the "live now" keyword suggestion that will appear.

2. Just scroll down and find a video with the red 'LIVE' tag. See image below.

3. After finding one, click the video and play it. While the video is playing, right click near the Share link found on the bottom of the video and click "Inspect". The developer tools will then appear.

4. Inside the developer tools, click "Network" tab. Using the search box type "mpd" to filter the requests appearing. When done searching, there are multiple mpd's that will appear (they are all the same), just select any of these. Another tab will appear, select the whole URL and copy it. Paste the mpd link in a Notepad for now.

5. Close your video to save data. We are now going to put that live URL inside your website. Open a new page and copy the code below in the HTML of your page.

<script src="//jwpsrv.com/library/O4mPlqeTEeK_viIACpYGxA.js"></script>
<div id="fb-live"></div>
<script>// <![CDATA[
jwplayer('fb-live').setup({         file: 'PASTE-HERE-YOUR-MPD-LINK',         width: '100%',         height: '450',         autostart: 'false',    image: 'PASTE-HERE-YOUR-LIVE-THUMBNAIL'     ,   primary: 'html5', hlshtml: 'true'     });
// ]]></script>
PLAYER SETTINGS:
a. Just change the file link with the Facebook live link that we extracted using this tutorial.
b. If you want a thumbnail to appear for your live video, just replace the image link with yours. If you do not want, just remove the PASTE-HERE-YOUR-LIVE-THUMBNAIL.
c. Change the width as well as the height to if you want to.
d. If you want your live to autostart, change false to true.

6. Done! See a live demo below.



Note: This live sample may not play anymore because the live video link already expired.