13

I am having the following problems; the height is not scaling correctly, the background is no longer transparent, the border is the wrong color, the bottom of the box is cut off, the text and background is the same color on the 'Dark' setting. This is occurring on every site that I have the 'Like Box' implemented on.

These can all be reproduced on the Like Box - Developers Page https://developers.facebook.com/docs/reference/plugins/like-box/ Try the following settings:

Width 400

Height 600 (the box will not scale) (if you leave it at default and turn of Show Faces the bottom is cut off)

Show Faces: On

Color Scheme: Dark

Show Stream: On

Border Color: #000 (the border will not change colors)

Show Faces: Off

(You will notice the text and background is the same color (the background is no longer transparent)) This all seems to have begun at midnight Wednesday EST following updates and I believe is a result of them trying to fix the issue of images being stretched in the feed.

slugster
  • 49,403
  • 14
  • 95
  • 145
Robert Mroczka
  • 131
  • 1
  • 4
  • https://developers.facebook.com/bugs/128437833979988 describes one issue, have you subscribed to that bug? – Igy Dec 09 '12 at 18:09
  • These steps did not replicate the problem for me – Tommy Crush Dec 10 '12 at 01:28
  • @Igy, I have no subscribe button appearing, nor can I follow or create a new bug report from my end. I am aware of this existing bug report and can emulate the posters results on my end. – Robert Mroczka Dec 10 '12 at 17:49
  • Update... If I log out of facebook and clear my cookies, the like box renders properly. The minute I log into Facebook ALL current browsers stop rendering the Like Box properly. – Robert Mroczka Dec 10 '12 at 18:08
  • @RobertMroczka I have an FB like box on my site and I am facing exactly the same issue. When I open my site in incognito mode in Chrome it renders perfectly but when I am logged in to FB, it breaks. – Irfanullah Jan Dec 11 '12 at 07:01
  • I still cant seem to get any support on this issue. I see that someone is has reported a similar issue on the developers bug page, but can't post my own report, follow the existing report or show that I can reproduce the issue... I'm trying everything I can to make this known, but Facebook is making it almost impossible to do. This is occurring on 5 of the websites I support and two other websites that weren't built by me, but another web design company. – Robert Mroczka Dec 12 '12 at 18:23
  • @RobertMroczka, can you paste the code you are using? The demo on the FB Developers page is adding its own background to the plug-in container (via the class `dark_background`), but if you copy the code as given in the "Get Code" box, you should be fine. I suspect you may have copied the source from the page directly, instead of from the code they give you in the modal popup window.. – Noyo Mar 11 '13 at 09:11
  • Can you post fiddle on this.. ?? I believe in practical :) – MarmiK Mar 13 '13 at 12:30

1 Answers1

2

This worked for me:

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=400&amp;height=558&amp;show_faces=true&amp;colorscheme=dark&amp;stream=true&amp;border_color=%23000000&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:400px; height:558px;" allowTransparency="true"></iframe>

Just keep in mind you need to add few lines in <head> tag, else you will not see proper results

<link rel="alternate" media="handheld" href="https://developers.facebook.com/docs/reference/plugins/like-box/" />

<link rel="canonical" href="https://developers.facebook.com/docs/reference/plugins/like-box/" />

<meta property="og:url" content="http://developers.facebook.com/docs/reference/plugins/like-box/" />

You may tweak with the values after reading FB API documentation.

MarmiK
  • 5,639
  • 6
  • 40
  • 49