Ghost のコメント欄、会員だけに開くか誰にでも開くか
会員だけの返信か、Google ログインだけで書けるコメントか。決めたら、貼るのは1行です。
Ghost には2022年8月からネイティブのコメントがあり、設計そのものが会員限定です。読者が自分のサイトに登録してログインしたあとで、はじめて返信欄が出てきます。有料のニュースレターには合う取引で、開いたブログには合いません。言いたいことがある人の大半は、そのためにアカウントを作らないからです。通りすがりの読者に書いてもらいたいなら、代わりにサードパーティのコメントウィジェットを足します。Settings > Advanced > Code Injection にスクリプトタグを1つ、コメント欄を置きたい場所に <div> を1つ。その前に上げておく Ghost(Pro) のプランはありません。
Ghost にはもうコメントがあり、判断はそこで終わる
ネイティブのコメントは、自分の会員リストの上で動きます。Ghost もはっきり書いています。コメントはログインした会員に限られる、と。オンにする場所は Settings > Membership > Access で、Edit を押すと選べるのは All members と Paid-members only の2つです。匿名の読者のための3つ目はなく、Ghost 自身のヘルプも、匿名でのコメントが必要ならサードパーティの連携を見るようにと書いて、その扉を閉じています。
コメント欄が、読者がお金を払って読むものの一部なら、この段差は欠点ではなく機能です。有料の記事の下で購読者どうしが議論する場はいい部屋で、ログインを求めることがその部屋を守ります。開いたブログでは、同じ段差が逆に働きます。どこかから自分のベンチマークの記事にたどり着いて、数字が違うと教えたい人は、そのためにアカウントを作りません。コメント欄は空のままで、こちらは誰も読んでいないと結論します。
自分のトラフィックに合うほうを選ぶ
| Ghost ネイティブコメント | BootSignal コメント | |
|---|---|---|
| 書ける人 | ログインした、自分のサイトの会員。匿名でのコメントには対応していません。 | Google アカウントがあれば誰でも。自分のサイトの会員である必要はありません。 |
| オンにする場所 | Settings > Membership > Access で All members または Paid-members only | Code Injection のローダー1つと、マウントの <div> |
| テーマの条件 | 最新の公式テーマ、またはカスタムテーマの記事テンプレートに {{comments}} を入れた状態 | なし。<div> を貼った場所に描かれます。 |
| 管理 | Ghost の管理画面で非表示・再表示・固定、フィルタと全文検索 | BootSignal のダッシュボードで、コメントの削除と投稿者のブロック |
| データのある場所 | 自分の Ghost サイト | BootSignal、登録したドメインに紐づいた形で |
| 費用 | Community comments はすべての Ghost(Pro) プランに含まれると表示 | 登録ドメイン単位で月 $20 または年 $200、すべてのウィジェット込み |
声に出して言っておくことがあります。Ghost のネイティブの管理機能は、よくできています。スタッフがコメントを隠して戻し、1件を上に固定し、記事・投稿者・公開範囲・日付で絞り込み、本文を全文検索できます。話してほしい相手がすでに会員なら、それを置き換える理由はありません。ウィジェットを足すのは、その人たちが会員ではなく、これからもならないときです。
ここでプランが閉ざしているのは、スクリプトではなくテーマ
Code Injection は有料のアドオンではありません。Ghost(Pro) のプラン比較の表には、Code Injection の行そのものがありません。Site Header と Site Footer の欄はどのプランでも Settings > Advanced にあり、セルフホストの Ghost には、何かを閉ざすプランがそもそもありません。Community comments もすべてのプランに含まれると書かれているので、どちらの仕組みも、解錠のためにプランを上げる対象ではありません。
閉ざされているのは、テーマのファイルのほうです。Ghost(Pro) はカスタムテーマとマーケットプレイスのテーマを、Starter では使えず Publisher 以上で使えると書いています。だから下の post.hbs の道は、Ghost(Pro) では Publisher 以上が要ります。HTML card の道と記事単位の Code Injection の道はどのプランでも動き、セルフホストでは三つとも開いています。どの道を行くかは、始める前に決めてください。スニペットは変わらず、スニペットが入る場所だけが変わります。
記事に付いたコメント欄の見え方
コメント2
- M
本当に一行で完了。設定がこんなに簡単だとは！
- J
ログインも共有なので他に組み込むものがありません。👍
div を置いた場所に、これが座ります。中に並ぶコメントはサンプルです。
ローダーは Site Footer に一度だけ
Ghost(Pro) とセルフホストは、出発するホスト名が違う
BootSignal のダッシュボードに何かを打ち込む前に、読者が実際にたどり着くアドレスを先に整理してください。Ghost はここに答えが2つあります。Ghost(Pro) のサイトは既定で無料の
ghost.ioサブドメインを受け取り、カスタムドメインは後から CNAME レコードで付けます。だから Pro で作った媒体は、最初の数週間をyourpublication.ghost.ioで過ごし、DNS が整ってから引っ越します。セルフホストの Ghost には、頼れるベンダーのサブドメインがありません。インストールのときに指定したホスト名で応答し、すでに動かしているマーケティングのサイトの隣のblog.サブドメインであることが多いです。読者がいるアドレスを登録し、Pro のサイトが引っ越しの途中なら両方を登録します。ウィジェットはlocation.hostnameを site id に付いた一覧と照らし、一覧になければ黙っています。先頭のwww.は両側から外して比べるのでwww.example.comを別に登録する必要はなく、ドメイン本体を登録すれば、その下のサブドメインまで覆います。ダッシュボードが返すのは site id で、Ghost Admin が次に聞いてくるのが、その文字列です。ローダーを Site Footer に貼る
Ghost Admin で Settings > Advanced > Code Injection を開きます。Site Header のコードは
<head>の中に、Site Footer のコードは閉じる</body>タグの直前に出力され、Ghost 自身のチュートリアルも、正しく読み込ませるために JavaScript は Site Footer へ入れるように書いています。この欄は JS 専用ではなく生の HTML を受け取るので、<script>タグは自分で書きます。挿入されたコードはテーマのスタイルやスクリプトのあとに読み込まれ、こちらが望む順序はそちらです。タグに付いたdeferは、解析と最初の描画から、このスクリプトをどけておきます。ローダーは媒体に1つで足り、あとから載せるのはリクエストではなくマークアップです。<script src="https://bootsignal.com/bootsignal.js" data-site-id="YOUR_SITE_ID" data-lang="ja" defer></script>
マウントの div を置ける場所は三つ
Code Injection が文字を書き込めるのは <head> の中か </body> の直前だけで、この制約1つが、この節を決めます。Site Footer にマウントの div を落とすと、コメント欄はページのいちばん下、サイトのフッターよりさらに下に描かれ、サイト全体の挿入はすべてのページで動くので、ホームやタグ・著者の一覧にも一緒に出ます。だからローダーは Code Injection へ、div は位置について意見を持てる場所へ行きます。
HTML card、記事を1件ずつ
エディタで + ボタンを押すか、新しい行で / を打ち、HTML card を選んで div を貼ります。Ghost は HTML card を、外部コンテンツの埋め込みやサードパーティツールの連携に使うカードとして説明していて、自社の Typeform 連携も、まったく同じ動きを使っています。カードは記事の本文の流れの中に座るので、コメント欄はサイトのフッターの下ではなく、最後の段落の下に置かれます。
<div data-bootsignal="comments" data-thread-id="my-post-slug"></div>post.hbs、すべての記事の同じ位置
Ghost の公式の Disqus 連携の手引きが手本で、ここにも直すところなくそのまま当てはまります。div を post.hbs の本文のあとに置き、公式テーマなら {{#if comments}} のブロックを消して、{{comments}} ヘルパーを自分のマークアップに差し替えます。そのあと直したテーマをアップロードして Ghost を再起動するか、Edit code から入るブラウザの中のテーマエディタで、同じ修正をします。カスタムテーマの権限が要るのはこの道なので、Ghost(Pro) の Starter では閉じています。
{{!-- post.hbs, where {{comments}} used to be --}}
<div data-bootsignal="comments" data-thread-id="{{slug}}"></div>記事単位の Code Injection、1ページだけのとき
記事ごとに、エディタのサイドバーへ自分の Code Injection の節があり、その記事にだけ効く Header と Footer の欄が別にあります。Ghost 1.5 で入った機能です。位置の規則は同じなので、コメント欄は本文の下ではなくページのいちばん下に置かれます。ランディングページなら問題なく、ブログの記事では違います。テーマに触らずに1ページだけコメント欄を置きたいときに、引き出す道です。
記事ごとに違う thread id を渡す
data-thread-id 属性が、このページのコメントとあのページのコメントを分けます。ウィジェットが鍵にするのは URL ではなくその値なので、同じ値を持つ記事2件は会話を共有し、値が変わった記事はコメントを失ったように見えます。HTML card では、値を手で書けば十分です。すでにその記事の中にいるので、それで困りません。post.hbs では記事のコンテキストにいるので、記事自身のスラッグを属性に出力すれば、テンプレートを1回直すだけで、すべての記事が自分のコメント欄を持ちます。
スラッグの落とし穴は、改名です。公開した記事の URL を変えるとスレッドのキーも一緒に動くので、タイトルをよく直すなら、絶対に動かない値、たとえば記事の id に属性を結び付けてください。すべてのウィジェットがこの値を受け取るわけではありません。コメント、評価、投票、ゲストブック、アップボート、リアクション、閲覧数、ニュースレター、フィードバックはスレッド id を取りますが、読書バーや目次には、ページごとに保存するものがありません。
コメント欄が2つあると、1つ多い
公式の Ghost テーマはどれも会員のコメントを既定で支えているので、コメントの機能がオンなら、同じ記事の下にネイティブのコメント欄と自分のウィジェットが積み上がることがあります。片方を選んでください。Settings > Membership > Access でネイティブのコメントを切るのがいちばん速く、どのプランでもできます。カスタムテーマなら、代わりに記事のテンプレートから {{#if comments}} のブロックを消せます。Disqus の手本が求めるのと同じ修正です。カスタムテーマを使えない Starter では、設定のスイッチが持っている唯一の取っ手です。
両方を動かすのが筋の通る場合が、1つあります。有料の記事には会員限定の返信、無料の記事には公開のコメント欄という配置です。Ghost は HTML card も Code Injection も記事単位で効かせるので、この配置にテーマを分ける必要はありません。
こちら側でかかる費用
コメントは BootSignal のサブスクリプションに入っています。登録ドメイン単位で 月 $20 または年 $200、有料ウィジェット38個がすべて込みで、トラフィックに応じて増える項目はありません。来月に読書バーを載せても請求は変わらず、購読を始めたあとに出たウィジェットも一緒に入ります。ドメインを増やすときは、ダッシュボードから別に買います。引っ越したあとも ghost.io のアドレスをカスタムドメインと並べて登録しておくなら、知っておくとよい話です。詳しくは料金ページにあり、ホスティング型のコメントサービスどうしを突き合わせたものは比較のセクションにあります。
Site Footer に1行、HTML card に div を1つ。
長い Ghost の記事に合うウィジェット2つ
この2つは、そもそもコメントが付くような長い記事で値打ちが出ます。マウントの仕方はコメント欄と同じで、記事の中の HTML card か、テンプレートに1行です。どちらもスレッド id を取りませんし、Site Footer のローダーがすでにページにいるので、リクエストも増えません。
読むほど満ちる上部のバー
読書の進み具合。長い記事を下へ読み進めるにつれて、細い帯が満ちていきます。
自動目次 · 現在のセクションを強調
見出しから組み立てる目次。いま読んでいる節を目立たせます。
<div data-bootsignal="reading"></div>
<div data-bootsignal="toc"></div>Ghost の設置が静かになる六つの理由
- どこにも何も描かれない。見ているのが、公開されたページではなくエディタです。記事を更新して、公開中の URL を開いてください。
yoursite.ghost.ioでは出るのにカスタムドメインでは出ない、またはその逆。ウィジェットが最初に見るのはlocation.hostnameで、ホスト名は1つずつ site id に登録されている必要があります。- 自分には見えるのに、ログアウトした読者には見えない。HTML card の目のアイコンを確かめてください。会員に限定したカードは、公開の訪問者からまるごと隠れます。
- 記事2件が同じコメントを見せる。
data-thread-idを共有しています。値を分けるか、テンプレートで属性を記事のスラッグにつなぎます。 - コメント欄がフッターの下、ページの末尾に描かれる。div が Code Injection の欄に入っていて、その欄は
</body>の前にしか書けません。HTML card かpost.hbsへ移してください。 - コメントは読み込まれるのに、誰も書けない。返信欄は Google ログインを求め、そのログインはドメイン上のすべての BootSignal ウィジェットが共有します。
よくある質問
- コメントウィジェットを付けるのに、Ghost の有料プランは要りますか？
- いりません。Ghost(Pro) のプラン比較の表に Code Injection の行がないので、Settings > Advanced の下の Site Header と Site Footer の欄は、Starter を含むどのプランにもあります。セルフホストの Ghost には、プランによる制限がそもそもありません。閉ざされている道は
post.hbsを直すほう1つで、カスタムテーマとマーケットプレイスのテーマが Starter では使用不可と書かれているからです。そのプランでは、HTML card か記事単位の Code Injection でマウントしてください。 - 記事ではなくページにも、コメント欄を置けるでしょうか？
- 置けます。HTML card はページの中でも記事の中と同じように動くので、紹介のページや変更履歴の下のコメント欄に要るのは、自分の
data-thread-idだけです。持ち越せないのはテンプレートの道です。post.hbsが描くのは記事で、ページは自分のテンプレートのファイルから出てくるので、両方に置くならページはカードで1つずつ貼るか、ページのテンプレートで同じ修正を繰り返すことになります。Ghost はネイティブのコメントを記事単位の機能として説明し、ページで描かれるかはどこにも書いていないので、ここはウィジェットのほうが先を読みやすい場所です。 - 記事はメールのニュースレターでも配信していますが、購読者はメールの中でコメント欄を見られるのでしょうか？
- 見られませんし、これはどのウィジェットでも変えられません。メールのクライアントは JavaScript を動かさないので、マウントの div は何もしないマークアップとして届き、ローダーは実行されません。Ghost がメールの本文に何を入れても同じです。会話は、記事のウェブ版にだけ存在します。読者の大半が受信箱で読んでいるなら、それは HTML card の道を選ぶ理由になります。カードのすぐ上に1行置いて、返信したいならブラウザで記事を開いてほしいと書いておいてください。
- Ghost の会員コメントと公開のウィジェットを、両方とも残すとどうなるのですか？
- 技術的には並びます。公式テーマなら、手を入れない限り同じ記事の下にコメント欄が2つ描かれます。実際に使える形は、記事単位で分けるほうです。有料の記事にはネイティブの会員コメントを残し、無料の記事には HTML card でウィジェットを落とします。どこでも1つの仕組みだけにしたいなら、Settings > Membership > Access でネイティブのコメントを切ってください。
- 読者は、自分のサイトの会員にならないとコメントを書けませんか？
- ウィジェットのほうは、会員でなくても書けます。Google ログインで入り、そのログインは自分のドメインに付いたほかの BootSignal ウィジェットと共有されます。Ghost のネイティブのコメントは正反対で、会員登録に加えてログインが必要で、初めて書く人には名前と専門分野を尋ねます。
- テーマを変えたらコメント欄が消えました。コメントも一緒に消えたのですか？
- 消えていません。コメントはテーマではなく
data-thread-idの値に紐づいて保存されるので、マウントの div がない新しいテーマは、一文字も触らずにコメント欄を隠すだけです。同じ値で div を戻せば、会話はそのまま戻ります。大事な記事に HTML card を勧める実質的な理由が、これです。カードのマークアップは記事の一部なのでテーマの入れ替えを越えて生き残り、post.hbsの修正はテーマのファイルのものなので、新しく選んだテーマには付いてきません。 - 投稿された文章は、どこで管理しますか？
- BootSignal のダッシュボードです。コメントを削除したり、投稿者をブロックしたりできます。ネイティブに残るほうと比べているなら、Ghost の管理画面は非表示と再表示、上への固定、記事・投稿者・公開範囲・日付での絞り込み、そしてコメント本文の全文検索を与えてくれます。
登録すると、Site Footer のスニペットに入れる site id が出ます。
数値の出典
- Ghost Help: Adding styles with code injection (Settings > Advanced, header and footer output) (確認 2026-08-25)
- Ghost Tutorials: How to use Code Injection in Ghost (wrap JavaScript in a script tag, Site Footer) (確認 2026-08-25)
- Ghost Changelog: Post Code Injection (per-post header and footer fields, Ghost 1.5) (確認 2026-08-25)
- Ghost Help: Editor cards (HTML card, the + button and / command, card visibility) (確認 2026-08-25)
- Ghost: Official Ghost + Typeform integration (paste the JavaScript snippet into an HTML card) (確認 2026-08-25)
- Ghost: Official Ghost + Disqus integration (div in post.hbs, replace the comments helper, re-upload the theme) (確認 2026-08-25)
- Ghost Help: Comments (Settings > Membership > Access, All members or Paid-members only, moderation) (確認 2026-08-25)
- Ghost Changelog: Comments for Ghost (15 August 2022 launch, members only, comments helper) (確認 2026-08-25)
- Ghost(Pro) pricing (free ghost.io subdomain and CNAME custom domains, Custom themes No on Starter, Community comments on every tier, no code injection row) (確認 2026-08-25)