How Do I Add Comments to a Webflow Blog?

by

In this tutorial, we will learn how to add comments to a Webflow blog. Adding comments to your blog can help facilitate engagement and foster a sense of community among your readers. Thankfully, Webflow provides an easy way to incorporate comments into your blog posts.

Step 1: Create a Disqus Account

In order to enable comments on your Webflow blog, you will need to create an account with Disqus. Disqus is a popular commenting platform that allows users to comment on various websites.

  1. Go to the Disqus website and sign up for an account by clicking on the “Get Started” button.

  2. Fill in the required information such as your email address, username, and password. After providing all the necessary details, click on the “Create Account” button.

  3. Once your account is created, you will be redirected to your Disqus dashboard.

Step 2: Configure Disqus for Your Webflow Blog

Now that you have created a Disqus account, it’s time to configure it for your Webflow blog. Follow these steps:

  1. Sign in to your Webflow account and open the project where you want to add comments.

  2. Navigate to the “Settings” tab in the left-hand sidebar and click on “SEO & Metatags”.

  3. In the “Custom Code” section, paste the following code:

<script>
var disqus_config = function () {
this.page.url = window.location.href;
this.identifier = '{{ page.id }}';
};
(function() {
var d = document, s = d.createElement('script');
s.src = 'https://your-disqus-website-shortname.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
</script>

Note: Replace “your-disqus-website-shortname” with the shortname you registered on Disqus.

Step 3: Add the Disqus Comment Component

Now that Disqus is configured for your Webflow blog, it’s time to add the comment component to your blog posts. Follow these steps:

  1. Open the Webflow Editor and navigate to the blog post where you want to add comments.

  2. In the right-hand sidebar, click on the “+” icon to add a new element.

  3. Search for “Disqus” and select the “Disqus Comment” component.

  4. Drag and drop the component into your blog post where you want the comments section to appear.

Step 4: Publish Your Changes

You’re almost done! All that’s left is to publish your changes and make the comments section live. Follow these steps:

  1. In the Webflow Editor, click on “Publish” in the top-right corner.

  2. A popup will appear asking you to confirm your publishing changes. Click on “Publish” again.

  3. Your comments section is now live! Visitors can now leave comments on your Webflow blog posts.

Adding comments to your Webflow blog is a great way to encourage interaction and build a community around your content. By following the steps outlined in this tutorial, you can easily incorporate Disqus comments into your blog posts. Happy blogging!