Create Blogger AMP HTML template install & download Accelerated Mobile Pages themes for Blogspot platform.

Blogr-AMP for Facebook Comments

Facebook comments has been introduced to Blogr-AMP Blogger template in mid January 2017 along with DISQUS & Google+ comments, replacing Blogger default comment system, which has been disabled to allow AMP HTML integrations.

Reference here includes Blogr-AMP Fb comments plugin setup, how to register a new Fb App ID & sync posting between blog & Facebook posts automatically.

Facebook Comments on AMP Blogger Template HTML

Locator


Template HTML


var FB_APP_ID = 123456789012345;

  • Facebook App ID required to sync with your comments dashboard.
  • Replace integers with the unique fb_app_id value provided by Facebook Developer page.

Template HTML - Blog1


<b:includable id='post-comments-fb'>

  • Theme widget tags to render Facebook comments & containers.

Element Tags


Facebook Comments Container

<div class="fb-comments" data-numposts="10" data-order-by="social" data-width="600" expr:data-href="data:blog.canonicalUrl">
</div>

  • Replace data-numposts value for the default amount of comments to display
  • Replace data-order-by value with social, newest or oldest.
  • Replace data-width value to set the default comment container width by default. On smaller screen sizes, responsive styles has been automatically included.

Behavior


  • Facebook comments is available on web view to allow quicker display in mobile devices.
  • Located inside an amp-accordian & optionally could display upon page render.
  • Comment container font & link color inherits Facebook plugins pre-set styles.
  • Comments sync automatically (if shared) between posts at Facebook pages & blog posts.
  • Comments moderation can be viewed on blog page or redirected to Facebook App comments dashboard.

Important Notes


  • By default, Facebook comments & its containers is commented out in blog widget.
  • Uncomment Facebook comment widget tag to use. 
  • Blog page canonical URL's is used for sharing to Facebook pages/posts. 
  • Canonical URL's shared at Facebook pages will automatically sync comments by Facebook on both pages/posts.

Useful Reference


Create a Facebook App ID

  1. Detail instructions to create a Facebook App ID is available here at Facebook for Developers page: https://developers.facebook.com/docs/apps/register

About Facebook Comments Plugin

  1. Fb Comments Plugin lets users comment on content on your site using their Facebook account. Users can choose to share their comment activity with their friends (and friends of their friends) on Facebook as well. The comments plugin also includes built-in moderation tools and social relevance ranking. More information: https://developers.facebook.com/docs/plugins/comments/

Have a comment/question? Add it here... expand_more

Comment on Google+ expand_more

Comment on Facebook expand_more

Have a code snippet to share? Format RAW codes here... expand_more

Users who needs to share code snippets in comments, use helper below to paste your codes & copy to comments body.

Blogr-AMP Blogger AMP HTML Template
Rated 5/5 based on 98 reviews
Facebook comments now enabled on Blogger AMP HTML template enhance engagement & blog post visits on both platform. Automatically sync comments in Blogspot pages & Fb posts with built in comment moderation dashboard views. Setup with unique fb_app_id register for free at Facebook for Developer web page.
Blogr-AMP: Blogr-AMP for Facebook Comments
5/ 5
Best AMP Blogger template, Blogr-AMP exceeded my expectations. Search engine friendly, easy to use, backed by great support Blogr-AMP for Facebook Comments.
mail