Add support for Disqus comments on distill posts (alshedivat#981)

Fixes alshedivat#980.
davidxwu · Oct 30, 2023 · ca502b0 · ca502b0
1 parent 970660d
commit ca502b0
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/_layouts/distill.html b/_layouts/distill.html
@@ -96,13 +96,27 @@ <h3>Contents</h3>
         <d-citation-list></d-citation-list>
       </d-appendix>
 
+      <d-bibliography src="{{ page.bibliography | prepend: '/assets/bibliography/' | relative_url }}"></d-bibliography>
+
+      {%- if site.disqus_shortname and page.comments -%}
+        <div id="disqus_thread" style="max-width: 800px; margin: 0 auto"></div>
+        <script type="text/javascript">
+          var disqus_shortname  = '{{ site.disqus_shortname }}';
+          var disqus_identifier = '{{ page.id }}';
+          var disqus_title      = {{ page.title | jsonify }};
+          (function() {
+            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+            dsq.src = '//' + 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>
+      {%- endif %}
     </div>
 
     <!-- Footer -->
     {%- include footer.html %}
 
-    <d-bibliography src="{{ page.bibliography | prepend: '/assets/bibliography/' | relative_url }}"></d-bibliography>
-
     {% include scripts/bootstrap.html %}
     {% include scripts/analytics.html %}
     {% include scripts/progressBar.html %}

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -44,7 +44,7 @@ <h1 class="post-title">{{ page.title }}</h1>
   </article>
 
   {%- if site.disqus_shortname and page.comments -%}
-    <div id="disqus_thread"></div>
+    <div id="disqus_thread" style="max-width: {{ site.max_width }}; margin: 0 auto"></div>
     <script type="text/javascript">
       var disqus_shortname  = '{{ site.disqus_shortname }}';
       var disqus_identifier = '{{ page.id }}';