facebook likebox Css edit

[aquilawebs]

Hello friends,

I am Trying to put a likebox for my facebook fanpage ie:
http://www.facebook.com/pages/Magento-Developer/162785273742658?v=app_4949752878

on my website page ie:
http://www.aquilawebs.com/shopping-cart-development/magento-ecommerce-development.php

can anyone tell me how do i edit the default css of the likebox, I have the API key for my Facebook developer account

thanks in advance

[aquilawebs]

anyone ????

[aquilawebs]

I am Still looking for an answer :(

[TheDoc]

Are you talking about the banner with the ‘Recommend’ button?

Why can’t you just target it in your own CSS file? I don’t understand the problem.

[aquilawebs]

Thanks for the reply my concern is
A default light theme like-box of FB plugin looks like this:

http://www.daddydesign.com/wordpress/wp-content/uploads/2010/03/fb_fanbox_default1.jpg

Is there any easy way that I can change the look of the LikeBox by background color or no border at all

[Moofin]

Do you have firebug in firefox? If you do, inspect the element to find out the different class names of the like button. Then when you have the class name you want to style go to your css stylesheet and do as you would normally but at the end of your styles make sure to add an !important. For example:

.connect_widget_like_button { border:1px solid #000000!important; }

!important ignores any other styles set to that element and uses the one you’ve set.
Hope that helps :)

[jamygolden]

Are you guys sure he can do that? I don’t think it’s possible to edit content within an iframe since that would be editing another website’s CSS. You can do it with firebug, but I’m pretty sure HTML doesn’t allow that.

[TT_Mark]

@jamy_za is right.

You cannot override the styles inside an iframe.

However, the Facebook API may allow for some CSS customisation before it loads the iFrame? Not sure if it does though. I’ve never seen on looking different from the standard one you have

[TheDoc]

Ah – didn’t see that it was an iframe. Thought he was talking about the banner – don’t mind me!

[aquilawebs]

Hey guys just check out this link:
http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/

this guy says if I do as below it should work.

can anyone please verify that because it didnt worked for me

Please check

[aquilawebs]

does that wrk for anyone please verify

[aquilawebs]

oops my content is been suppressed..
Please check the above link and check out the trick this guy gave a Css path in the script

[jamygolden]

“does that wrk for anyone please verify”

Why don’t you try it yourself?

[mark90125]

.w2bslikebox div {
background: #cfe2f3;
border: medium none;
display: block;
position: relative;
}

this css work for me in my fb like box
check it here http://www.markleuterio.com/

[mark90125]

.w2bslikebox div { background: #cfe2f3; border: medium none; display: block; position: relative; }

Add this code to your blogger custom css (work only for fb like-box)
to get the code for like box go to [Facebook Developer](http://developers.facebook.com/docs/reference/plugins/like-box/ “”)
Default background is transparent.

[Author]

Posts