Skip to content

Instantly share code, notes, and snippets.

@valueof
Created July 8, 2010 08:37
Show Gist options
  • Select an option

  • Save valueof/467770 to your computer and use it in GitHub Desktop.

Select an option

Save valueof/467770 to your computer and use it in GitHub Desktop.
Comments count code example
<html>
<head>
<title>Comments count code example</title>
<!--
Note: Disqus uses custom data- attributes to specify thread identifiers.
Those attributes are part of the HTML5 specs and already supported by all browsers.
For more information, see:
* http://ejohn.org/blog/html-5-data-attributes/
* http://dev.w3.org/html5/spec/elements.html#embedding-custom-non-visible-data
-->
</head>
<body>
<!-- For this link, we will try to fetch comments count by URL: http://example.com/article.html -->
<a href="http://example.com/article.html#disqus_thread">First article</a>
<!-- For this link, we will try to fetch comments count by identifier: article2identifier -->
<a href="http://example.com/article2.html#disqus_thread"
data-disqus-identifier="article2identifier">Second article</a>
<!-- We will ignore this link because its href attribute does not end on #disqus_thread -->
<a href="http://example.com/" data-disqus-identifier="tenthousands">Anchor</a>
<script type="text/javascript">
// This is actual code that needs to be inserted.
var disqus_shortname = 'websiteshortname'; // Put your website's shortname here
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = 'http://disqus.com/forums/' + disqus_shortname + '/count.js'; // And here
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
</body>
</html>
@Znarkus
Copy link
Copy Markdown

Znarkus commented Aug 13, 2010

Using a proprietary attribute breaks validation, can't you use the "rel" attribute?

@valueof
Copy link
Copy Markdown
Author

valueof commented Aug 14, 2010

We can't use rel because we have more than one way to identify the thread. For example, in addition to data-disqus-identifier we already have data-disqus-slug.

Also, data- attributes are part of HTML5 specs: http://dev.w3.org/html5/spec/elements.html#embedding-custom-non-visible-data

@Znarkus
Copy link
Copy Markdown

Znarkus commented Aug 14, 2010

Couldn't you use it like

or something similar?

Otherwise I guess it's a good time to convert to HTML5.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment