Changing text color in facebook comments and like (content plugin)

To start, if you're subscription expires tomorrow, don't worry, we'll help you with this issue as necessary.

There's a few solutions for this in the current release.. and yes, we're working to make it better in the future. The Like and Comment boxes can actually include local CSS, but you need to actually tell Facebook to use your local CSS file. Since we have quite a few ways to load the Like and Comment boxes (modules, {} tags, and the JFBCContent plugin), can you tell me which way you're using? That way, we can get you a more specific answer.

Thanks!

The solution's actually pretty easy in both cases then.. though maybe a little confusing. We already have a CSS file defined for the Comment/Like button combo. What we use it for is hiding the Like button in the combo, however, you can use it to style things however you want.. as well as leaving the Like button visible.

You can see/modify the CSS file at /plugins/system/jfbcsocial/fb_comments.css

To use with the JFBCContent plugin, you'll need to enable the "Hide Like Button" option... even if you don't want to hide it. That's just our way of including the CSS file, which hides it.

For the { JFBCComments tag.. you'll want to use the hideLikeButton=1 tag.. this will, also include the CSS file.

From there, hopefully, you can do what you want. The Comment box is loaded in an iFrame, so things like 'body {background: #FF0000;}' should make the background red, for instance.

Good luck, and let us know. We'll try to make including the CSS a little more straightforward in the next release.. cause I'm already a little confused

Hey! You don't have a subscription!

I went to the page, but couldn't find the plugin enabled anywhere. Can you enable it, and let us know what page we can see it on? That will help us. Basically, using Firebug, if you look at the iFrame code itself, there should be an inclusion of the /plugins/content/jfbccontent/fbcomments.css file in the head section. That should also be where the style you mention above should be. Hopefully, that helps debug a little.. but if not, post where it is, and we'll do what we can to help.

Thanks!

Noa,
Very sorry about the delay. To start, feel free to pass our email along to EasyBlog (This email address is being protected from spambots. You need JavaScript enabled to view it.). We love hearing from other developers.

As for the comment box, I just looked at the page you linked. If you look at the HTML on the page, you'll see the <fb:comments statement and in there, it loads:
www.geoparadise.org//plugins/system/jfbcsocial/fb_comments.css

In that file, you should put the code I pasted above. That file is actually loaded first by Facebook, and then it's included in the iFrame. You can't modify how the comment box looks using the CSS in your template.

Now, for the bad news, and part of the reason why we took so long to respond. Facebook recently updated it's Comment module. This update does not allow for styling overrides, so the fix detailed above may not work for long. What we use is now the "legacy" version. In 3.2 (coming out in the next few weeks) will use the 'updated' version, which will prevent extra styles.

We're looking into a lot of options to allow for basic styling like you need, as others have non-white backgrounds on their site. If there isn't a solution we can find, we will submit it as a bug to Facebook so that hopefully they add some way to set the background color (at least) for the comments box.

Hope this all helps, and if not, let us know. Again, sorry for the delay, and good luck!