Manually tweeking your Facebook Like Box
This evening I had a particular little bug come up with the normally simple task of creating and embedding a “Facebook Like Box” and thought I’d jot down a few words on it.
I was using Facebook’s options to customize a “Like Box” for a Facebook Page that I was then going to embed into a new website. All was well, I’d change the options and the preview would change accordingly.
However, when I copied the code FB was giving me, some of the options I had chosen were stripped. Like, I didn’t want the Stream or the Header but it would display after I pasted the code.
Now being a tad bit lazy…. I thought “Maybe I should just do it again with Facebook’s custom form”…. and I tried 3 times (Yeah, I was being lazy). I then decided I should just look in the embed code and manually change some options.
So the FB code came out to:
<iframe src=”http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&width=292&colorscheme=light&connections=10&stream=true&header=true&height=587″ scrolling=”no” frameborder=”0″ style=”border:none; overflow:hidden; width:292px; height:587px;” allowTransparency=”true”></iframe>
I just had to adjust the height of the box, so obviously in the code, I adjusted the height in both places to the pixels width dimension that seemed appropriate to the layout. I wanted the dark color, so I change the “colorscheme=light” to “colorscheme=dark“.
I wanted a border, and since it was a dark background on the site, I changed “border:none;” to “border:1px solid #FFFFFF;” to give it a thin white border.
Changed “header=true” to “header=false” to remove the box header, changed “stream=true” to “stream=false” to remove the page’s stream and changed the “connections=10” to “connections=5” (which changes the number of profile pics in the “like box”).
Very easy process overall. Thought I’d post for those who may be looking for some help with this.
[ad code=1 align=center]