4/06/2015

How I Add Facebook Comment Form To WordPress Blog Without Plugin



Placing Facebook comment form on WordPress blogs is possible without having to install any plugin. I added the Facebook comment form under the blog posts at mobilitaria.com without using any plugin. You too can. Just follow me through the steps below.


For you to add the Facebook comment form to your blog, you will need the Facebook Application ID of the blog. If you know the ID, copy it somewhere and if you don't know it you can check the Facebook apps page.

You can read: How To Get Facebook Application ID to generate one for your blog.

Next is to sign in to your WordPress dashboard and go to "Appearance" > "Editor"

==> Find Header (header.php) on the sidebar and click on it.



==> Carefully find the <body tag below the closing <head tag
==> Paste the code below, directly below the <body tag


<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/sdk.js#xfbml=1&appId=1569785879914041&version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>



==> Carefully replace the highlighted appID with the ID of your blog
==> Click "Update File" button

==> Find Comments (comments.php) on the sidebar and click on it.


==> Paste the code below at the top as seen in the screenshot below the code:

<br>
<div style="text-align: center;">
<div class="fb-comments" data-href="<?php the_permalink() ?>" data-num-posts="8" ></div>
</div>
<br/>


==> Click "Update File" button.

View one of your blog posts and you should see the Facebook comment form displayed.

I hope it works for you.

NB: Mobilitaria uses Jarida theme as at the time of publishing this post. Although, I have restyled it to my taste, you can get the Jarida theme here

Recommended: How To Add Facebook Comment Form To Blogger.


Share :


10 comments:

  1. I will try it asap. Thanks my boss

    ReplyDelete
  2. I know this will be helpful and implementable on my own wordpress though here is mine own Modernize Technology
    Thanks Greatly Boss!

    ReplyDelete
  3. Thats a nice one bro...great

    ReplyDelete
  4. mehnnnnn i have been looking for this since ....God bless bro
    www.tellnig.com

    ReplyDelete
  5. awesome! just implemented it on techroid.org.. will also love to know how to hide widgets on mobile view of wordpress without mobile themes.. thanks

    ReplyDelete
  6. wow! Jide you make look like a Pro! It works very well for me, thanks a lot Bro.

    ReplyDelete
  7. It worked.... Thanks for such a nice tutorial...

    ReplyDelete
  8. Thank you it works! I have implemented it on tasmag.com I hope it encorages more users to leave comment. How can I move it directly under the article. Hoping to hear from you soon

    ReplyDelete

We love to hear from you!

Sign in to comment "anonymously" without entering verification text.

Want to be notified when I reply your comment? Tick the "Notify Me" box.

If your comment is unrelated to this post, please drop it at my Facebook group here.

THANKS.

Designed by Jide Ogunsanya.