5

Currently I have 3 comment boxes on a single page. The page has three tabs that display different content, and each tab content has its own comment section, differing from the other two.

To make sure unique comments are loading for each tab, I am currently using something similar to:

<div class="fb-comments" data-href="http://webpage.com/index.html#tab1" 
     data-num-posts="2" data-width="470"></div>
<div class="fb-comments" data-href="http://webpage.com/index.html#tab2" ...
<div class="fb-comments" data-href="http://webpage.com/index.html#tab3" ...

This works in displaying the relevant content. However, when someone replies to one of these comments, the original commentor receives a link on their fb profile that appears as:

http://webpage.com/index.html?fb_comment_id=fbc_26547577547547_477747457_3745757457435737#4574575475

The problem is that this link the user is given does not show the relevant comment thread, or even the anchor based data-href comment box. Perhaps the end anchor is tripping up the display? If so, is there a paradigm for having different facebook comment boxes on a single page?

Thanks for any help solving this annoying issue.

2
  • Did you ever find an answer to this? I am having the same issue.
    – BostonBB
    Jul 30, 2012 at 15:25
  • BostonBB, not for this particular issue. We just did the quick fix and changed the layout to make it work. Unique comment boxes seem to hate anchors in the URL. Let me know if you do find a solution though please, as I'm sure I'll come across this again. Jul 30, 2012 at 20:42

1 Answer 1

1

I implemented something similar using this code

<div class="fb-comments" data-href="http://stabmail.com/study-groups-tutoring/#comm-enl" data-width="880" data-num-posts="20"></div>


<div class="fb-comments" data-href="http://stabmail.com/study-groups-tutoring/#comm-esl" data-width="880" data-num-posts="20"></div>


<div class="fb-comments" data-href="http://stabmail.com/study-groups-tutoring/#psyc" data-width="880" data-num-posts="20"></div>

Perhaps your issue could be solved by simply removing 'index.html', as Facebook would then treat the '#tab' as the page, and not a link to a different part of the page

My solution can be seen working here http://stabmail.com/study-groups-tutoring/

1
  • I had just redesigned the project to work in the default fashion, but I like what you have here and I'm sure it would have done the trick. Thanks for sharing, and including an example. I hope someone in the future will be able to cite this thread. Jul 10, 2013 at 3:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.