Facebook LikeBox

Integrating your website with social network services is essential to amplify the number of exposes to people. You may have a fan page of your website on Facebook, and want to tell your friends on Facebook about your website. With the help of several social plug-ins Facebook provides, even someone who is not your friend, can become a fan or your friend via your website not Facebook. It is totally free, and also you can get more chances to let people know your business. More fans, more opportunities, more revenues, and more satisfactions.

Instruction

You need to have a fan page for your website. You can create your own fan page here, then you might need to customize it as your own style such as information, logo, and etc. The most important thing is you have to copy your Fan page's full URL. For example, PLUG creative's url is http://www.facebook.com/pages/PLUG-creative/156603397688297. If you don't know a Fan page's URL, you can grab it by "Account > Manage Pages" on Facebook, then select a page you want to go.

You can see your fanpage URL from the address field of the web browser. Please copy the URL into clipboard.
If you are ready to embed Like Button of your fan page, please go to this page: http://developers.facebook.com/docs/reference/plugins/like-box.
You can see a page like below. The light gray box will provide several options you can customize. Here the most important thing is paste your Fan page's URL which you just copied, into the first text box.
If you input the correct URL, you can see "Preview" of your Fan page's Like box. As you can see, it is really easy to customize because it immediately reflects the result once you changed any options.
Select and input options as you desire. You can decide whether your Fans who like your page, streams of your page, and Blue Header show up, or not. Everything is up to you.
This example image is generated by "Show Header", "Connections: 10", "Color Scheme: light", and "Width: 291". You can test by modifying options as you want. You would need to consider the size of this Like button to match it with your web page.
Once you have done to customize it, please press "Get Code" button on the bottom. You can see a window which has two different HTML codes to be embedded into your website. Here, I would recommend to grab the first one (iFrame). Please copy it into clipboard.
You are ready to embed it to your website. please go back to iWeb.
Insert a HTML snippet. Then paste the code into HTML snippet box.


	<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FPLUG-creative%2F156603397688297&width=292
&colorscheme=light&connections=0&stream=false&header=false&height=62" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px;
height:62px;" allowTransparency="true"></iframe>

The code would look like above but it is different from yours.
You can replace the values highlighted in RED. The only thing you have to concern is that height doesn't mean the entire profile widget's height. It is to exclude Top and bottom bar. Thus your full profile widget's height should be summed with 87px. For example, if you typed 120px as the height on the code, the profile widget's full height will be 207px.
Click "Apply" button on the HTML snippet box, and see if your twitter profile widget works correctly.