Article comment visibility toggleable, with setting property COLLAPSE_COMMENTS determining default visibility.
diff --git a/README.md b/README.md
index 7275d54..3e7445e 100644
--- a/README.md
+++ b/README.md
@@ -32,6 +32,8 @@
- `DISQUS_SITENAME` set this to enable disqus comments in articles
+- `COLLAPSE_COMMENTS` set to `True` to have article comments hidden by default. Clicking on the `comments` link will toggle visibility.
+
- `TAGLINE` some text rendered right below the logo
- `INTERNET_DEFENSE_LEAGUE` set this to `True` if you want to enable the [Internet Defense League](http://internetdefenseleague.org) code
diff --git a/templates/article.html b/templates/article.html
index 25d3b3d..51506f6 100644
--- a/templates/article.html
+++ b/templates/article.html
@@ -26,11 +26,13 @@
{% endfor %}
</p>
{% endif %}
+ {% if DISQUS_SITENAME %}
+ <p><a href="#" onclick="javascript:toggleComments();return false;">Comments</a></p>
+ {% endif %}
</div>
{% if DISQUS_SITENAME %}
- <div class="comments">
- <h2>Comments !</h2>
+ <div id="article_comments" style="display:{%if COLLAPSE_COMMENTS %}none{% else %}block{% endif %}">
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_identifier = "{{ article.url }}";
@@ -48,4 +50,11 @@
{% block footer %}
<p><a href="{{ SITEURL }}/" class="button_accent">← Back to Index</a></p>
+<script language="javascript">
+ function toggleComments() {
+ var commentDiv = document.getElementById("article_comments");
+ (commentDiv.style.display == "none") ? commentDiv.style.display = "block" : commentDiv.style.display = "none";
+ return false;
+ }
+</script>
{% endblock %}