【Blogger】コメント欄をブログ管理者専用にする

この記事では、Blogger においてブログ管理者だけがコメントを書き込めるようにする方法について説明する。

ブログ管理者だけがコメントを書き込めるようにする

ブログ管理者だけがコメントを書き込めるように設定する方法について以下に示す。

まず、Blogger ダッシュボードの左側のメニューから「設定」画面にアクセスする。

次に「コメント」＞「コメントを投稿できるユーザー」＞「このブログのメンバーのみ」を選択。

これでブログの管理者（個人でやってるブログなら自分）以外のユーザーはコメントを書き込むことができなくなる。

ブログ管理者に対してのみコメント投稿欄を表示させる

前項の設定だけではコメント投稿リンクや埋め込みフォーム自体は管理者以外にも表示されてしまう。

そこで、記事編集リンクを表示させる仕組みを流用して、コメント投稿欄も同じようにブログ管理者にだけ表示させるようにした。

このカスタマイズを行う前に注意点がある。

まず、</head> の処理で authorization.css が読み込まれないようにしている場合は、別途以下のコードを追加する必要がある。

<b:if cond='data:view.isSingleItem'>
  <link expr:href='&quot;https://www.blogger.com/dyn-css/authorization.css?targetBlogID=&quot; + data:blog.blogId' media='print' onload='if(media!=&apos;all&apos;)media=&apos;all&apos;' rel='stylesheet'/>
  <noscript><link expr:href='&quot;https://www.blogger.com/dyn-css/authorization.css?targetBlogID=&quot; + data:blog.blogId' rel='stylesheet'/></noscript>
</b:if>

また、標準 CSS を無効（ b:css='false' ）にして css_bundle_v2.css が読み込まれないようにしている人も同様に注意。このままだと管理人以外にもコメント投稿欄が表示される可能性があるので、必要に応じて以下の CSS を追加する。

.item-control{
  display: none;
}

最後の注意点として、この方法をスレッド形式のコメント欄で使えるのか試していない。フラット形式のコメント欄での使用を激しく推奨。

以下に、ブログ管理者だけがコメントを書き込めるように設定する方法について示す。

まず、Blogger ダッシュボードの左側のメニューから「設定」画面にアクセスし、「コメント」＞「コメントの表示」＞「フルページ」か「ポップアップウィンドウ」を選択。

次にテーマ編集画面に飛び、ブログの投稿ウィジェット内のコメント投稿欄を表示させたい場所に、以下のコードを追加する。

<div expr:class='&quot;item-control &quot; + data:post.adminClass'>
  <!-- ここにコメント投稿欄のコードを挿入 -->
</div>

data:post.adminClass が出力する blog-admin というクラス名と、ブログ管理者から見た authorization.css が以下の記述に変わることにより、自分にだけコメント投稿欄が見えるようになる。

div.blog-admin, div.pid-********* { display:block; }
span.blog-admin, span.pid-********* { display:inline; }

ブログ管理者以外の Blogger（Google）ユーザーから見える authorization.css は以下のような内容で、非ログインのユーザーにはそもそもなんの CSS も表示されないため、デフォルトでは他人にコメント投稿欄を見られることもない（たぶん）。

div.pid-********* { display:block; }
span.pid-********* { display:inline; }

コメント投稿欄のコードは、下の記事の「併用させてみる」の項を参考にして、埋め込みフォームとコメント投稿リンクを両方表示させるのがおすすめ。

【Blogger】コメント欄を改造してみた | ふじろじっく

上の記事ではコメント投稿欄の折りたたみに input と label を使用しているが、筆者は以下のように details と summary で折りたたんでいる。

<div expr:class='&quot;item-control &quot; + data:post.adminClass'>
  <details>
    <summary><data:messages.postAComment/></summary>
    <!-- ここにコメント投稿欄のコードを挿入 -->
  </details>
</div>

埋め込みフォームのほうが、別ページに飛ばなくて済むぶんコメントを書くハードルがぐっと下がる。しかし、iOS の端末では書き込もうとするとエラーになるらしいので、投稿リンクも一緒に表示しておくのが無難だと思う。