タグ貼り付け型コメントフォーム Disqus

新着コメントの表示について書き忘れてたので追加しました。

disqus.png

Disqus
https://disqus.com/

WEBサイトに掲示板型のフォームが設置できます。

URLに対して1つの掲示板が設置されるため、
ブログのコメント欄の代わりに使用できる。
コメント機能がないhtmlタイプのサイトにも実装可能。

OpenIDを使用して投稿可能。
ツイッターやフェイスブックでシェア可能。
匿名での投稿を許可することも設定できます。

スパム対策が楽。
ブログやWEBサーバーに負荷がかからない。
ブログのコメント欄より高機能。
画像をコメント内に貼れる。

メリットはこんなところじゃないでしょうか。

私のケースでは
CDNのキャッシュ機能を有効にした結果、
freoのコメント投稿の挙動が怪しくなったため。
やむなく外部サービスを利用した。

私の場合はやむなく利用するしかなかっただけのことで、
上記に書いたメリットは後付です。
当然ながらデメリットもあるため現状困ってないのに、
あえて実装するほどのメリットがあるとは思ってません。

freoでも使用可能ですが、
実装してみると設置が結構面倒だったので、
気が付いたところをピックアップ。

問題点1 実装がめんどくさい

テンプレートの書き換えが面倒。
多少htmlの知識がないときついかもしれない。
表示させたい位置にタグを貼るだけではあるんですが、
どこがどうなってるのかhtmlの知識がないと分からない。

例えば、viewにコメント表示させる場合は
templates\internals\view\default.htmlの120行目あたりにある
<!–{if $entry.comment != ‘closed’}–>の直前に以下のコードを入れる。

<h2>コメント</h2>
{literal}
<div id="disqus_thread"></div>
<script type="text/javascript">
	/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
	var disqus_shortname = '自分のショートネーム'; // required: replace example with your forum shortname
	/* * * DON'T EDIT BELOW THIS LINE * * */
	(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>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
{/literal}

templates\internals\default\default.htmlも書き換える必要がある。
Disqusのコメント用のリンクを追加。
138行目あたりを書き換える。

<a href="{$freo.core.http_file}/view/{if $entry.code}{$entry.code}{else}{$entry.id}{/if}" title="{$entry.title}の固定URL">この記事のURL</a><br>
<a href="{$freo.core.http_file}/view/{if $entry.code}{$entry.code}{else}{$entry.id}{/if}#disqus_thread" title="{$entry.title}のコメント">Comment</a>

footer.htmlの</body>直前に以下も必要。
コメントのカウント数表示が不要ならいらないです。

{literal}
<script type="text/javascript">
	/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
	var disqus_shortname = '自分のショートネーム'; // required: replace example with your forum shortname
	/* * * DON'T EDIT BELOW THIS LINE * * */
	(function () {
	var s = document.createElement('script'); s.async = true;
	s.type = 'text/javascript';
	s.src = '//' + disqus_shortname + '.disqus.com/count.js';
	(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
	}());
</script>
{/literal}

サイドメニュー(templates\utility.html)に新着コメントを表示させる。
表示させたい位置に以下を挿入

<script type="text/javascript" src="http://自分のショートネーム.disqus.com/recent_comments_widget.js?num_items=3&avatar_size=48&excerpt_length=70"></script>

items=新着コメント数
avatar_size=アイコンの大きさ
excerpt_length=コメント表示文字数

問題点2 URLの問題

URLに対して掲示板が発行されるため、
http://example.com/view/123
続きを読むを設定した場合のURL
http://example.com/view/123?continue=1
同じ記事なのに2つで異なる掲示板が出来上がる。

続きを読むを使わないようにするか、
viewに続きを読むの内容も含めて全部表示させてしまうか。

どちらにしても今までとは使い方が変わってしまう。

問題点3 Disqusの持つデメリット

Javaスクリプト動作のためJavaスクリプトを切ってると表示されない。
Webサーバー側は何も処理していないため高速だが、
ブラウザ側でJavaスクリプトの処理が発生するため、
コメント欄がすぐに出てこない可能性がある。

JavaScriptをオフにしているブラウザは1%前後。米ヤフー調べ
100人に1人ぐらいはコメントが見えないことに。

日本人には使い慣れていないシステムのため、投稿数が減る可能性がある。

タイトルとURLをコピーしました