Format Facebook Comments Box

Hi Gurus,

I'd like to apply some different styles to the Facebook comments. See attached image.
1) Add padding to entire facebook comment module
2) Round avatar image corners
3) round comment textbox corners

Thank you kindly,

  • Adam Czajczyk

    Hello emilio_gagliardi,

    I hope you're having a nice day and thank you for your question!

    Facebook Comments are not "real" part of your site. The FB API dynamically creates an "iframe" element in your site's source code and the comments form/list is loaded into this iframe from external (facebook's) domain.

    A content inside an iframe cannot be CSS-styled unless you have a direct access to the source site (Facebook in this case).

    With the Ultimate Facebook plugin you can choose from default FB comments styles ("light" and "dark") but not much more can be done here.

    That being said, the 2nd and 3rd points wouldn't be possible. As for paddings: do you mean entire FB comments "section" or paddings for single comments and/or "Add a comment" box? In case of latter one, the same rule applies as explained. If this is about the entire section, you could use this CSS rule:

    .wdfb-fb_comments {padding: 50px 40px 30px 20px;}

    You would want to change the values that I used. They are (respectively) for: top, right, bottom and left padding.

    Best regards,

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.