How to Add Facebook Comments to Your Blog Posts With the Legacy Template

Kayla M.

Updated

If you are building your website with the legacy template, Premier, learn to add a Facebook comments section to your Blog Posts. 

This article refers to the Premier Legacy Template, which may be outdated in comparison to the newer Templates. If you are using the new Kajabi Pages or Website Builder, please refer to the updated guide here.

In this article:


Note:
To add Facebook comments, you will need to be on a Kajabi Pro account to access the code editor. Learn about our different plans here.

Step 1. Get the Facebook Comments code

To add Facebook comments to your Blog Post, log into your Facebook account and follow this link to configure and generate HTML snippets for the Facebook Comments plugin:

  • Copy and paste your blog page URL into the Comments Plugin Code Generator URL field.
  • Enter the number of posts (or comments) you want displaying on the page.
  • Click GET CODE:

Tip:
Keep two tabs open in your browser for your Kajabi Blog and the Facebook Comments Plugin Code Generator to easily switch back and forth during the process of adding Facebook Comments to your page.

Step 2. Open the Code Editor in Kajabi

Once the code snippets are generated, head back to Kajabi and enter your Blog Post code editor:

  • Open the Website tab from your Dashboard.
  • Select Pages.
  • Locate your Blog Post page template.
  • Click  on the far right and choose Modify code:


Step 3. Paste the first code snippet into Kajabi

Open the Layouts folder in the code editor:

  • Click on the theme.liquid file.
  • Scroll down to the <body> tag (usually around line 70 of a freshly installed template).
  • Copy the first code snippet from the Comments Plugin Generator.
  • Paste the code snippet one line below the <body> tag:
  • Click Save:


Step 4. Paste the second code snippet

Open the Templates folder in the code editor:

  • Click on the blog_post.liquid file.
  • Locate the {% section "blog_post_body" %} tag (usually around line 5 of a freshly installed template).
  • Copy the second code snippet from the Comments Plugin Generator.
  • Paste the second code snippet one line below the {% section "blog_post_body" %}:


Step 5. Configure the second code snippet

Finally, to get your Facebook Comments to fully function on all of your Blog Posts:

  • Replace your site URL within the quotations in the second code snippet with this exact text: {{canonical_url}}

For example, if the second code snippet began like this:

<div class="fb-comments" data-href="https://help.kajabi.com/blog/getting-to-know-the-how-tos"data-numposts="3" data-width=""></div>

and would be changed to look like this:

<div class="fb-comments" data-href="{{canonical_url}}" data-numposts="3" data-width=""></div>

Click Save and preview your Blog Posts to see Facebook Comments near the bottom of the page.


And that’s how you can add Facebook Comments! Please vote below and let us know if you found this article helpful. We value your feedback. Thanks for being the best part of Kajabi!

Did you find this article helpful?

Need more help?

Contact Us