fb:like-box, custom css?

C

5

19

Is it possible to add a custom css file to a fb:like-box? For example, I would like to remove the borders around the iframe. Thanks

Clariceclarie answered 2/2, 2011 at 13:1 Comment(0)

F

26

The new like-box does not accept the "css" attribute. You have to use the old fb:fan plugin to achieve it.

For example:

<fb:fan profile_id='[PAGE_ID]' width='300' height='256' show_faces='true' stream='false' header='false' css='[CSS_URL]'></fb:fan>

Remember to add the "all.js".

Flagging answered 6/4, 2011 at 11:19 Comment(4)

More info: #4518524 – Flagging 11/5, 2011 at 18:26

This method appears to have stopped working a few days ago. Here's an alternative, very similar approach: pixabay.com/de/blog/posts/… – Concrescence 27/1, 2013 at 9:44

And now a month later, their next approach is also broken. It's safe to say the custom css thing is dead for good. – Magnanimity 4/3, 2013 at 20:5

This approach for customizing the Facebook Like Box fails. Facebook aims at providing a consistent user experience and has removed all available options for injecting a custom CSS stylesheet into this widget. – Flagging 4/6, 2013 at 14:55

S

2

<div id="fb-root"></div>

<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>

<script type="text/javascript">FB.init("Your-App-ID");</script>

<fb:fan profile_id="Your-Page-Profile-ID" connections="20" width="300" height="300" css="http://example.com/likebox-style.css?1"></fb:fan>

Don't use live stream for pages with low post rate, the stream will be empty if there are only posts older than 6 weeks.

Sesquicarbonate answered 7/9, 2012 at 9:38 Comment(0)

C

1

You can add a css attribute to the <fb:like-box> tag with a href to your custom CSS stylesheet. This will allow you to manipulate the existing styles.

A good article on this subject: http://line25.com/tutorials/how-to-add-a-custom-facebook-like-box-to-your-site

Croner answered 2/2, 2011 at 13:9 Comment(1)

Ive tried that, but when i change <fb:like-box> to <fb:fan>, the box disappears. – Clariceclarie 2/2, 2011 at 13:17

P

1

Facebook like box no longer supports css. Facebook reports: Support for custom CSS has been removed due to security implications. We now allow the likebox plugin to be rendered without a border via the show_border=false argument. However, if you like to make your like box colorful you can use the svg gradient trick. Read - Styling Facebook Like Box With SVG

Phantom answered 11/8, 2013 at 18:14 Comment(0)

K

0

Recommended topics

Hot tags