How To Add Facebook Mobile Comment Form To Blogger / Blogspot Mobile View

If you’ve enabled custom Blogger mobile template, you can customize the mobile view of your blog as you desire. You can add and remove whatever you like in as much as you know how to go about it. Today, I have decided to share with you, how to add Facebook mobile comment form to Blogger or Blogspot mobile view.

facebook mobile comment box

To get started, I recommend you enable Custom Blogger mobile template. If you don’t know how to do that, sign in to your blog, go to “Template”. Click the icon under “Mobile”. Select “Yes. Show mobile template on mobile devices“. Select “Custom” from the drop down box and SAVE.

Next is to get your blog’s Facebook APP ID handy. If you know the ID, copy it somewhere and if you’ve forgotten it, you can check the Facebook apps page. If you can’t find it on the apps page, then you need to read how to get Facebook application ID for your blog here.

Next is to log in to your Blogger dashboard, back up your template and go to “Template” > “Edit HTML”

==> Click inside the HTML and use CTRL F to find : <body
==> Directly below it, paste <div id=’fb-root’/>

==> Open a new tab on your browser and go to
==> Copy and paste the code below inside the box on the page

<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); = id;
  js.src = “//″;
  fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>

==> Carefully replace the highlighted appID with the Facebook app ID of your blog
==> Click “Encode”

See also :   How To Insert Youtube Videos In Blogger Post (Embed Youtube Videos In Blogger)

==> Go back to the browser tab where you have your blog HTML

==> Copy and Paste the encoded script directly below the  <div id=’fb-root’/>

==> Now, your HTML should look similar to the screenshot below:

==> Click “Save Template”

==> Click inside the HTML and use CTRL F to find :

<b:if cond=’data:top.showMobileShare’>

==> Carefully find the ending </div> as seen in the screenshot below:

==> Directly below it, copy and paste the code below:

<p align=’center’>
<span style=’font-size: 15px;font-weight:bold;’>Facebook Comment Box </span>
<div style=’text-align: center;’>
<fb:comments expr:href=’data:post.url’ expr:title=’data:post.title’ expr:xid=’’ mobile=’yes’ numposts=’10’/>

–> Click SAVE Template.

View one of your blog posts and the comment box should appear on the mobile view,  above the Blogger comment form.

Try this and let me know if it works for you. Also leave your comments if you’ve questions to ask.

Note: You might not find in your template if you are using a third-party template.

Please Share :

Written by Jide Ogunsanya

Pro Nigerian Blogger, Digital Marketer and Web designer. I help business owners to grow their businesses online. You can join my Facebook Group here.


Leave a Reply
  1. Ogbonge you Rock… Despite the fact that I'm an experience blogger, I find this tutorial so helpful. Thanks bro. Let me just maintain my anonymous status.

  2. Thumbs up Oga Jide. You are the best.

    So happy I finally found this tutorial after an endless search online.

    Pls, what message were you passing in the note you dropped below the post? What might one not be able to find if he/she is using a third party template?

  3. hi thanks for the tutorial, but mine is nit showing at all, instead its showing " FACEBOOK COMMENT BOX" in words without a place or box to comment.. please help review this

    • Ensure you parse the facebook sdk at before pasting it. In your blog html and also ensure you didn't delete anything else while replacing the app id in the sample above.

  4. Wonderful tutorial oga Jide. But I didn't use it on my blog. I even removed that of the PC version. Because I didn't see any blog using it. Those who did initially including ogbongeblog removed them afterwards. Any reason why? Plus I seem to be mobile restricted so can't generate the app ID.

  5. My oga i still find it difficult to add facebook mobile comments on my blog. Please what else can i do cos it seems Facebook made adjustment on their web.

Leave a Reply

We're glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our comment policy. Your email address is required but will not be published. No keyword stuffing in the name field and commenting from blah blah blah makes no sense. Thank You.

  • Millionaire Reveals How You Can Make Millions Doing What You LoveRead More
  • Free Ebook Explains How To Design WebsiteDownload Now
  • We can help you ship items from Amazon USA to NigeriaMore Info
  • Do you want to ask some questions?Click To Ask

Finally Receives Konga Nigeria Affiliate Commissions In My Bank Account

You Can Now Purchase Domain Name Right From Blogger Settings