How can I make a unique comment section appear on each individual Story page in my Webflow site's "Stories Template" collection, instead of displaying site-wide comments?
TL;DR
- Choose a CMS-compatible comment platform (e.g., Hyvor Talk, Commento, or Disqus).
- Embed its script in your Stories Template page and dynamically insert each Story’s slug to create unique comment threads.
To display a unique comment section per Story page in your Webflow CMS-driven "Stories Template," you'll need to dynamically associate comments with each story using third-party tools, since Webflow does not have native commenting functionality.
1. Choose a Compatible Commenting Platform
- Use a third-party tool that supports dynamic CMS templates. Common options include:
- Hyvor Talk (CMS-friendly and privacy-focused)
- Commento (lightweight option with dynamic pageID support)
- Disqus (widely used, but be cautious of ads/privacy)
2. Use a Unique Identifier for Each Story
- Each CMS item has a unique slug, which can act as the dynamic identifier.
- Webflow lets you inject this slug into your embed scripts using a CMS field.
3. Add the Comment Embed to the Stories Template
- In your Stories Template page, add an Embed element where you want the comment box to appear.
- Use a script from your chosen service and dynamically insert the Story slug. For example:
- For Hyvor Talk, you would set its websiteId and set the page identifier using the slug:
identifier: "{{wf {"path":"slug","type":"PlainText"\} }}" - Webflow will auto-replace the dynamic field at publish.
4. Ensure Unique Comments per Story
- Confirm that your comment platform uses the slug or Story ID to separate comment threads.
- This means the same script can embed on each CMS template, but will load different comment threads per Story based on the slug.
5. Test the Integration
- Publish your site, open multiple Story pages, and verify that:
- Each has an independent comment thread.
- Posting a comment under one Story does not appear under others.
Summary
To get unique comments per Story page in Webflow, use a third-party commenting system that supports dynamic CMS fields. Inject the Story’s slug or ID as the comment thread identifier using an Embed element on the "Stories Template" page. This keeps each Story’s comments separate and dynamic.