It is not unlikely that you might want to bring to your website the engagement and interaction experienced by your audience on social media platforms like Facebook.
Though the decision to do this solely depends on your choice however, the ultimate decision should pivot on the best medium you found convenient for your audience, whether the WordPress comment system or Facebook comment box.
WordPress commenting system is good and it gives opportunity to post comment anonymously which Facebook comment would not allow because of the log in gateway within that is made mandatory.
Despite this flux, you’ll discover that audience that is loyal to your brand would be comfortable with it.
Why Facebook comment could be better than WordPress comment system
Facebook comment box can bring about deeper engagement and interaction among your blog readers.
The likelihood of content virality is also higher compared to WordPress comment box. This is so because the comments posted by your blog readers through the Facebook comment box on your site will automatically reflect on their newsfeed on Facebook.
This is an opportunity for your content to connect with wider spectrum of audience.
This was part of the reasons why we opted for Facebook comment box. We also discovered that our content have more engagement with Facebook audience. So, placing the comment box on our blog is just our little way to further enhance the engagement and build on the interaction.
Again, most of our clients are on Facebook. It is only logical to tie our blog with features that best resonate with them.
Granted that not everybody would find Facebook interesting to be on it, so what happens when a blog reader that does not have Facebook account wants to comment?
This indeed is another aberration. But, talking a little critical, I would say that not every prospective customer would end up been a customer.
For this reason, your blog can still attract a reasonable number of readers that have Facebook account and are more than willing to post comment through this medium.
Do you even know that all the clients that connected with our brand through our content marketing effort never post a single comment on any of our blog post? Rather, they digested the content which in turn builds the confidence and trust to call us and the rest is history.
Nevertheless, it is important to encourage blog readers to post comments because that would further galvanize the trust repose on the content and then the brand.
That’s why we are trying to use facebook comment to encourage our blog readers to post their comments.
Another reason why we fell in love with Facebook comment system is the complete eradication of spam comments.
WordPress comment can be a great pain with the number of spam comments you might have to contend with. This sometimes eats up better part of our developmental time.
The most annoying is how confusing some spam comments can be that you approve them thinking they are legit.
With Facebook comment box, you don’t have to worry about all that!
So, let’s ride on if you know you’re in with us on replacing WordPress commenting system with Facebook comment box.
Step-by-stop guide on adding facebook comment box manually on your site
This simple tutorial will guide you on how to add facebook comment box to you WordPress blog manually. There is a plugin that can do this job perfectly. But it is always better to use less plugin on your site especially when there is an alternative means that can produce the same result.
Just remember to edit files in the child theme so that you don’t lose them when you update the folders on your site.
Now, let’s go straight to the procedure.
There are basically about 4 steps to follow when you want to add facebook comment box on your website.
1. Register as a developer on Facebook to get an APP ID for your website
– To do this, you’ll need to go to developer.facebook.com and log in with your usual facebook account credential.
– Go to ‘My App‘ and click on ‘Register as a developer‘. Click on the ‘Register Now‘ button.
– Accept the terms and condition of Facebook developer policy by clicking the tab with ‘No‘ sign so that it change to ‘Yes‘.
– Click on the ‘Next‘ button’ to continue.
You’ll be prompted to create a new app. You’ll have to do this in other to generate your APP ID.
– Click on ‘Create a New App‘ button.
– On the new form that emerges as a dialog box, enter the name of your website in the ‘Display Name‘ field.
– Enter the ‘Namespace‘ for the app. It’s just a unique identifier for your app. You may skip it if you feel it’s not necessary.
– The last thing you’ll need to do in this section is to choose a category from the drop down options that best describe your website.
– Click on ‘Create App‘ button.
At this stage, you’ll be able to see your ‘APP ID‘ and the ‘APP Secret ID‘ on the new page. The ‘APP Secret Key’ is hidden by default.
Nevertheless, you don’t need it to integrate Facebook comment on your site. What you’ll need as the tutorial progresses is the ‘APP ID’.
Copy the ‘APP ID’ and keep it somewhere secure, preferably on a notepad.
2. The next thing you need to do is to add your website as a platform on Facebook
– Click ‘Setting‘ on the left side menu on the page that displays your APP ID and Secret keys.
– On the ‘Basic‘ setting tab, enter your website URL into the ‘App Domains‘ field.
– Enter your email into the ‘Contact Email‘ box.
– Now, click on ‘Add Platform‘.
– Select ‘Website‘ from the options available.
– Enter the URL of your website.
– Click on ‘Save changes‘ button.
These are all you need to do on Facebook developer site for now. The next thing to do is to go to your website and insert some codes into your theme files.
3. Insert Facebook comment codes into your website
You’ll insert about three different codes into the active theme on your website for facebook comment box to display on your website appropriately.
First code: Copy the code below. Paste it before the closing head tag (</head>) on the header.php file of your theme.
Ensure you change the value “Add Your APP ID Here” with your APP ID.
<meta property="fb:app_id" content="Add Your APP ID Here"/>
Second code: Copy the code below again and paste it on your theme header.php. This time, paste it just below the opening body tag (<body>).
Also change the value “Add Your APP ID Here” with your APP ID generated on Facebook.
<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_US/all.js#xfbml=1&appId=Add Your APP ID Here";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Click ‘Update‘ button at the bottom of the file to save the changes made.
NOTE: Always backup your site whenever you want to alter file configurations.
Third code: Copy the code below and save it on a notepad on your computer as comments.php. You may change ‘data-mobile=”false”‘ from “false” to “true” if you want the comment box to be responsive. You can also change other data parameters to conform with what you want.
<div class="fb-comments" data-href="<?php the_permalink() ?>" data-num-posts="5" data-width="500" data-colorscheme="light" data-mobile="false"></div>
Go to your active theme folder through FTP and rename comments.php to anything you like (e.g. comments-old.php). This action will disable the active WordPress comment system on your site.
Upload the comments.php file on your computer to the folder where you renamed the former comment file. This should be your active theme (wp-content/themes/youractivetheme).
Go to your site and check if facebook comment box is at the bottom of your post.
4. Facebook comment moderation settings
After you’ve seen facebook comment box displayed on your site, you’ll need to set moderators for it so that you can receive comment notification and also moderate comments.
Simply go to developers.facebook.com/tools/comments. Click on ‘Settings‘ at the bottom left and add your name as the moderator. You have to log in to Facebook to do this.
5. How to show Facebook comment count on posts
It’s not unlikely that you might want to show the number of comments a post have on important pages of your site.
To get this done, simply paste the code below on the specific page theme files and the location where you want the comment count to show (e.g. single.php, archive.php, index.php, search.php, author.php).
<span class="comment-count"> Comments: <fb:comments-count href="<?php echo get_permalink($post->ID); ?>"></fb:comments-count> </span>
That’s all you need to do to change WordPress comment to facebook comment box on your website.
Conclusion: You can see that it’s possible to replace the default WordPress comment tool on your site with a social media inclined facebook comment box that can foster better interaction and engagement among your blog readers that post comment.
On top of that, you can make the box responsive so that people that read your blog ‘On the Go’ can also post their comments.
The only down side is that people without Facebook account may not be able to comment on your site.
Then, people who want to post comment anonymously are shut out from doing so on your site. That could be a plus on some site you know. What do you think?
IMPORTANT UPDATE: We had to revert to WordPress commenting system because we noticed that facebook comment box don’t show up on time on Smartphone and sometimes, it would not show up at all.
This is an aberration we cannot dear cope with in this digital age that tend towards mobile. The responsiveness of every feature on our site is much more important than the considerations of using Facebook comment.
- How to Add Post Thumbnail Image to RSS Feed on WordPress - February 16, 2016
- 10 Tips for Getting the Most out of Google Image Search - January 19, 2016
- How to Add Next and Previous Post Links with Thumbnail - January 11, 2016
