2017-08-06 09:00

Disblog, ghost

カテゴリー: Tech タグ: blogging disqus hugo

Hugo に移行してからも以前と同様コメント機能はDisqusに依存しています。

一月気に入らない点は、Disqusのローディングに時間がかかることと、そのために表示が乱れてしまうことです。

Ghostで使用していたテーマでの扱いを参考にしながら、ページの初期ロード時は表示せずにロードボタンをユーザーに押させてからDisqusのコメントをロードするようにしました。

テーマは、hemingway2を改変したものを使用しています。hemingway2では、layouts/disqus.htmlが該当する部分になります。

以下のように修正を加えました。

{{ if .Site.DisqusShortname }}
<section class="section">
  <div class="container">
    <div class="disqusbox">
            <div id="disqus_thread"><form onsubmit="my.loadDisqus();return false;" class=formBlock><input class="cmd_hemingway" type=submit value="Load Comments"></form></div>
        <script type="text/javascript">

            var disqus_shortname = '{{ .Site.DisqusShortname }}';

            var my = my || {}
            my.loadDisqus = 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="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
        <style score=scoped>
            @media print {
                .disquxbox{display:none}
            }
        </style>
    </div>
  </div>
</section>
{{ end }}

まぁ、コメントをつけていただく方が稀なブログなんで、これで良いでしょう。