Adding YouTube video for company profile, product features, services information etc. is an essential step for customizing any company’s Facebook fan page. This Facebook FBML tutorial will guide you through step-by-step procedure for adding YouTube videos or Flash objects into any Static Facebook fan page. You have to enter the following lines of code on your Static FBML pages -
<fb:swf
swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;”
swfsrc=’http://www.youtube.com/v/xxxxxxxxxx’
imgsrc=’http://img.youtube.com/vi/xxxxxxxxxx/2.jpg’ width=’340′ height=’270′ />
Replace the string of characters “xxxxxxxxxx” after the “v=” in the URL of your browser’s address bar of any YouTube video ID up to the “&”. For example the below is a YouTube video URL
Then replacing “xxxxxxxxxx” with CX8NfOYjl30 in the codes will result –
<fb:swf
swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;”
swfsrc=’http://www.youtube.com/v/ CX8NfOYjl30
imgsrc=’http://img.youtube.com/vi/ CX8NfOYjl30/2.jpg’ width=’340′ height=’270′ />
You are also able to customize the values for “swfbgcolor” and “imgstyle” to your preferences. The value “swfsrc” is the absolute URL to the Flash file you want to embed.
The preview or activation image through imgsrc
Facebook requires a user action like a click for running Flash or JavaScript. There is no alternative for triggering Flash or JavaScript in Facebook. The “imgsrc” contains the location of a image that you will see in place of your video. When a user clicks the image the video starts loading. To eliminate the necessity of second click to start the video, you can set your video to autoplay so that it plays immediately when the user clicks the activation image. You can able to do this by appending “&autoplay=1″ to the swfsrc URL:
swfsrc = ‘http://www.youtube.com/v/ CX8NfOYjl30&autoplay=1′
The YouTube default thumbnails are small, usually 120×90 pixels, so the default image are not very effective for your activation image. You can insert your own image at a higher dimension like 340×270 pixels through imgsrc value. The image has to be hosted in your own server or any third party image hosting services.
Now on your fan page any user can see an image, when the user clicks the image, it starts the loading of Flash object.
You might be interested in:
- Facebook FBML Tutorial: FBML Basics
- How to Use External CSS Styles into Facebook Static FBML
- Add a Share Button to Facebook Fan Page Using Facebook FBML
- Facebook Fan Page Promotion and Optimization Tips
- Facebook Fan Page Managing Tips
Comments