Streaming live at 10am (PST)

Disqus on a CMS template page?

Does this work as you generate new content for the page? Do the comments “stick” with the CMS content for viewers?

What are some things to look out for?
For instance, on the disqus site they say:

  1. (Recommended) Edit the RECOMMENDED CONFIGURATION VARIABLES section using your CMS or platform’s dynamic values. See our documentation to learn why defining identifier and url is important for preventing duplicate threads.

Thank you!

1 Like

Yes, you need to define your canonical url for dynamic CMS when using DISQUS!

oh my, what the heck?

Thanks for the reply, but have no idea what that means? Any help would be appreciated :slight_smile:

the canonical url is this:

Yup, still lost. I guess I’ll just remove it.
Thank you.

Have you considered using AddThis to share posts. And you can create your own comment section by using CMS fields with a Zapier Zap.

Check it out and see if that doesnt work for you better.

Hi @WebDev_Brandon, I’m actually grappling with the same issue right now.

I understand what a canonical URL is, but that seems to be only half of what’s required for the necessary customization of the Disqus code. There is also this:

this.page.identifier = PAGE_IDENTIFIER; // Replace PAGE_IDENTIFIER with your page’s unique >identifier variable

In Disqus’s instruction video, they give examples for Hubspot and Wordpress CMS’s. But I’m perplexed as to how to discover what would be the “page’s unique identifier variable” that would work with Webflow.

Would you have any idea what this might be?

Or maybe this might not even be something to be concerned with?

I’m not able to test this at the moment, but I believe you should be able to use the dynamic fields within the HTML embed element to use a value from the CMS item.

Thank you @mikeyevin, I’m actually not sure what that means in terms of what code I should write in to replace the placeholder “PAGE_IDENTIFIER.”

I don’t know if there is a way to bring this to the attention of the Webflow university team, but given the popularity of Disqus, it would be great to make a Webflow University video on this topic. Also, on the Disqus site, they have all kinds of custom settings available for all kinds of platforms, including Adobe Muse, but no Webflow! It would be very helpful if there are indeed custom settings required of Webflow that the Webflow team could share those settings with the Disqus team. It would also be nice for all of us bitter ex-Musers to see the Muse icon replaced with the Webflow icon.

It’s not a scalable solution—ideally you’d want to pull the collection item ID as the PAGE_IDENTIFIER instead of a CMS number field which is something you could do with Zapier—but I was able to get a working test that you can check out below (scroll down for the comment section):

Clicking the link’s just above the Disqus element will take you to one of three separate CMS items with their own unique comments. If this is something that folks would find useful I’d be happy to throw together a quick tutorial (probably including the Zapier piece) over the next couple days.

1 Like

Hi @mikeyevin,

Thank you very much for taking the time to create this.

Unfortunately, in my context, I can’t really comprehend what is happening here. Definitely, if you created a tutorial I would go through it and try to understand it. However, I think what can be difficult for some of us here coming from sophisticated backgrounds in code or integrations with third party tools is that others of us here who are essentially designers who need to be lead slowly though these unfamiliar territories.

It also just occurred to me that while I understand what a canonical URL is, that’s not what this code from Disqus requires—I believe it requires some code that will generate the canonical URL information dynamically for each blog page. I have no idea what that would be.

What I’m curious about more widely is that since blogs are a basic and common feature of websites, and commenting is a basic and common feature of blogs, why there isn’t more attention given to this subject generally in Webflow?

It would be great if some sort of commenting feature could be added to Webflow; or, if that is not technically possible, if the Webflow video library might create one or a series of videos on the subject, perhaps one giving an overview of the possible third-party commenting solutions, and then separate ones explaining how each is implimented.

I agree that this should be available for folks, however I think the setup is fairly straightforward so I recorded a quick video of the steps necessary to get this setup using only the slug of your collection item—however as I mention in the video, this may need modification if you have multiple blogs or collections within the same site:

You can check out the live site here or you can view the Designer read-only link here.

Hopefully that answers some of your questions but feel free to reach out if you run into any issues :v:

1 Like

Thank you, Mike! (@mikeyevin)

Super clear, super helpful, however, you did say to get back in touch in case I run into issues and I actually did. I made my own video that explains the issue, plus another Disqus feature that might likely be of general interest that may or may not be implementable in Webflow. (Please disregard the brief portion of the video where I mention I don’t have the ability to edit or delete a comment that I left on a post; I’ve since figured out and solved that.)

No worries, as I say in the video, if you don’t want to pursue this further, you’ve already demonstrated an enormous amount of generosity, which I appreciate.

In the event you might like to access the read-only link to my project, here it is: https://preview.webflow.com/preview/drumming-patterns?utm_medium=preview_link&utm_source=designer&utm_content=drumming-patterns&preview=3cd0bca9a14ce09d070530b8f8a5c1d6&pageId=5f77a2762eccce274168e4f1&mode=preview

1 Like

Thanks for all the kind words! Always happy to help out folks here in the community, especially a fellow drummer!

I took a minute to go over the questions you had (although admittedly it appears like you figured out the solution to most of them) and walk through how you can get the comment counts displaying in the video below:

As promised, here’s the code I used within my HTML Embed element (with some adjustments based on your specific project) however keep in mind that you’ll want to swap out the placeholder class and update the SLUG text with your dynamic field:

<a class="YOUR_CLASS" data-disqus-url="SLUG" href="/post/SLUG#disqus_thread">Commend Count</a>

Feel free to reference the links in my previous comment if you’d like to check out my live site or the read-only link and let me know if you run into any other problems :+1:

1 Like

@mikeyevin, this is just incredibly clear and helpful!

Thank you so much! There is no way I could have figured out any of this myself.

And thanks, as a drummer, for your interest in the site, I really appreciate that as well. The site should hopefully be fully completed by the end of this month.

I’m curious to learn more about you as a drummer. Let’s stay in touch, feel free to message me privately anytime you like and I’ll do the same.