Adding Facebook Comments to BlogEngine.Net

15. November 2013 22:04 by jay grossman in   //  Tags: , ,   //   Comments (0)

This blog runs using the open source BlogEngine.net platform using ASP.Net 4.0. So far I have been pretty happy with the features provided overall, as it was pretty straight forward to set up and there are many themes/widgets.

The issue I had with using the out of the box comments system was seeing about 15 spams comments posted a day. I've seen some of the bigger blogs use Facebook Comments and they had less of the spammy junk, like ESPN in the screenshot below:

 

Since I couldn't find a pre-canned BlogEngine widget available using Facebook comments, I needed to use Facebook Comments plugin to add this functionality.  I was able to insert the following code into PostView.ascx of my theme to implement Facebook comments:

    <fb:comments-count href="<%=Post.PermaLink %>"></fb:comments-count> <%=Resources.labels.comments %>
    <div id="fb-root"></div>
    <script>   
        (function (d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
            fjs.parentNode.insertBefore(js, fjs);
        } (document, 'script', 'facebook-jssdk'));
    </script>
    <div class="fb-comments" data-href="<%=Post.PermaLink %>" data-width="470" data-num-posts="10"></div>

Since I wanted the comments box to appear only on the post page (and not on the homepage), I wrapped the Facebook markup in if statement below:

<% if (Request.Url.ToString().ToLower().IndexOf("post.aspx") >0) {%>
<% %> 

Comments