Refactored inclusion of disqus script

- Added ARIA setting `aria-live="polite"` to comment output
- Removed duplicate <div id="disqus_thread"> from page/post templates
- Moved blocking JavaScript loading to the end of the document body.
- Merged JavaScript code for index and pages/posts using conditionals
- Moved global JavaScript disqus variables into the anonymous function to stop pollution of global namespace
This commit is contained in:
Frederic Hemberger 2011-09-21 13:37:59 +02:00
parent b2828eb039
commit 2a30d9a1eb
6 changed files with 44 additions and 44 deletions

View File

@ -0,0 +1,22 @@
{% comment %} Load script if disquss comments are enabled and `page.comments` is either empty (index) or set to true {% endcomment %}
{% if site.disqus_short_name and page.comments != false %}
<script type="text/javascript">
(function () {
var disqus_shortname = '{{ site.disqus_short_name }}';
{% if page.comments == true %}
{% comment %} `page.comments` can be only be set to true on pages/posts, so we embed the comments here. {% endcomment %}
// var disqus_developer = 1;
var disqus_identifier = '{{ site.url }}{{ page.url }}';
var disqus_url = '{{ site.url }}{{ page.url }}';
var disqus_script = 'embed.js'
{% else %}
{% comment %} As `page.comments` is empty, we must be on the index page. {% endcomment %}
var disqus_script = 'count.js'
{% endif %}
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/' + disqus_script;
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
}());
</script>
{% endif %}

View File

@ -1,13 +1 @@
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus_short_name }}';
var disqus_identifier = '{{ site.url }}{{ page.url }}';
var disqus_url = '{{ site.url }}{{ page.url }}';
//var disqus_developer = 1;
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

View File

@ -9,6 +9,7 @@
</div>
</div>
<footer>{% include footer.html %}</footer>
{% include disqus.html %}
{% include google_analytics.html %}
{% include google_plus_one.html %}
{% include twitter_sharing.html %}

View File

@ -27,7 +27,7 @@ layout: default
{% if site.disqus_short_name and page.comments == true %}
<section>
<h1>Comments</h1>
<div id="disqus_thread">{% include post/disqus_thread.html %}</div>
<div id="disqus_thread" aria-live="polite">{% include post/disqus_thread.html %}</div>
</section>
{% endif %}
</div>

View File

@ -17,10 +17,10 @@ single: true
{% endunless %}
</footer>
</article>
{% if site.disqus_short_name and page.comments != false %}
{% if site.disqus_short_name and page.comments == true %}
<section>
<h1>Comments</h1>
<div id="disqus_thread">{% include post/disqus_thread.html %}</div>
<div id="disqus_thread" aria-live="polite">{% include post/disqus_thread.html %}</div>
</section>
{% endif %}
</div>

View File

@ -3,35 +3,24 @@ layout: default
---
<div class="blog-index">
{% assign index = true %}
{% for post in paginator.posts %}
{% assign content = post.content %}
<article>
{% include article.html %}
</article>
{% endfor %}
<nav role="pagination">
<div>
{% if paginator.next_page %}
<a class="prev" href="{{paginator.next_page}}">&larr; Older</a>
{% endif %}
<a href="/blog/archives">Blog Archives</a>
{% if paginator.previous_page %}
<a class="next" href="{{paginator.previous_page}}">Newer &rarr;</a>
{% endif %}
</div>
</nav>
{% if site.disqus_short_name %}
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus_short_name }}';
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
{% endif %}
{% assign index = true %}
{% for post in paginator.posts %}
{% assign content = post.content %}
<article>
{% include article.html %}
</article>
{% endfor %}
<nav role="pagination">
<div>
{% if paginator.next_page %}
<a class="prev" href="{{paginator.next_page}}">&larr; Older</a>
{% endif %}
<a href="/blog/archives">Blog Archives</a>
{% if paginator.previous_page %}
<a class="next" href="{{paginator.previous_page}}">Newer &rarr;</a>
{% endif %}
</div>
</nav>
</div>
<aside role=sidebar>
{% if site.blog_index_asides.size %}