In my page i will be loading images one below other. I need to show comments and likes below each image. But if there are too many comments then the images will move down.

Is there any good method to show comments and likes below images?

I don't need to add comments or edit comments and nor there will be functionality to like it. It will be only to display comments and likes.


Facebook's solution is one that many people are aware of, and seems to work well.

Facebook image with more comments

They provide the following:

  • A Like button above the comments.
  • Display 3 comments by default.
  • Provide a View More Comments link to view the next 15 comments.
  • Long comments are truncated, and have a Show More link to expand the comment.

There is a jQuery plugin for Like button, which has lots of themes: https://likebtn.com/en/jquery-like-button

There is also a jQuery plugin for Comments, which looks like it has additional features like upvoting: http://viima.github.io/jquery-comments/

In both cases, the like feature is small so will not take much space, but the comments are likely to be very large, so these should be on another page and just linked to from the page with the image. This is because adding/reviewing comments is not part of the primary reason people are using your application, so it is better to navigate to them otherwise you will be cluttering the primary reason users are using your application.

You could just show a count of the number of comments on the image page because this is very small. Maybe even make the count the hyperlink to the comments page (and if no comments yet just display the word "Comment" as the hyperlink.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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