ナカーマ
無料でコミュニティを開設

SNSでシェアされたときのカード画像（OGP）

コミュニティのページがSNS（X・Facebook・LINE など）でシェアされると、リンクの下に大きなカード画像が表示されます。ナカーマはこのカードをページごとに自動生成します。この記事では、カードの見た目を選ぶ「OGP」の使い方を説明します。

1. OGPの設定を開く

左メニューの「運営・設定」からサイト設定 ＞ OGPタブを開きます。左が設定、右がプレビューです。設定を保存できるのは、オーナー・管理者・編集のロールです（経理・サポートのロールでは保存できません。ヘルプ記事「運営メンバーと権限」）。

サイト設定のOGPタブ

画像を1枚ずつ用意する必要はありません。投稿やイベントなどページごとに、そのページのタイトルを入れたカードが自動で作られます。

2. 見た目を選ぶ

選べる項目は4つです。どれかを変えると、右のプレビューがすぐに作り直されます。まだ何も設定していないコミュニティは、「シンプル中央」＋「テーマグラデ」＋文字は中央＋アイコンありで表示されます。

  • テンプレート：シンプル中央 / 下帯 / 写真+スクリムの3種類から選べます。
  • 背景：テーマグラデ（コミュニティのテーマ色のグラデーション）・単色・指定画像から選べます。
  • 文字位置：中央か左かを選べます。
  • ロゴ（アイコン）：カードにコミュニティのアイコンを載せるかどうかを切り替えます。

背景に「指定画像」を選ぶと画像をアップロードできます（横長 1200×630 が推奨）。文字が読めるように暗幕（スクリム）が自動で重なりますが、写真が明るいときや柄が強いときは、「オーバーレイ（暗幕）の濃さ」を「なし」から「濃い」まで手動で足せます。0%のままなら自動の暗幕だけがかかります。足せるのは80%までで、それ以上は指定しても80%として扱われます。濃くしても写真が真っ黒になることはないので、安心して調整してください。

テンプレートを「下帯」に変えたときのプレビュー

上はテンプレートを「下帯」に変えたところです。同じ内容でも、名前とアイコンの置き方が変わります。

3. プレビューを確かめて保存する

プレビューはサーバーが実際に生成した画像です。見た目を似せて描いたものではないので、保存後の共有カードとずれません。上の「プレビュー用タイトル」を書き換えれば、長いタイトルが入ったときの見え方も試せます。カードに載る文字は最大90文字までで、それより長いタイトルは途中で切れます。さらに、収まりきらないときは行数に合わせて自動で文字を小さくし、それでも入らない分は「…」で省略されます。大事な言葉は先頭に置くと、カードでも確実に見えます。

決まったら「保存する」を押します。保存すると、共有カードを使うすべてのページに反映されます。なお、「基本情報」タブで画像を手動アップロードしているページは、そちらが優先されます。ここでの設定は、個別の画像を用意していないページに使われます。

4. 「基本情報」タブの画像との関係

同じ「サイト設定」の「基本情報」タブには、画像を直接アップロードする欄が2つあります。どちらの画像が使われるかには決まった順番があります。

  • コミュニティアイコン：ヘッダーのロゴ・コミュニティ一覧・通知・シェア画像など、いろいろな場所で横断して使われます。正方形の画像がおすすめです。この欄は、画像を選ぶとその場で保存されます（保存ボタンは不要です）。
  • SNSシェア画像（OGP）：コミュニティ全体の既定のカード画像です（1200×630px の横長推奨）。ここに画像を入れると、自動生成のカードよりこちらが優先されます。

使われる順番は、①商品・チケット・投稿などの詳細ページは、そのアイテム自身の画像 → ②「基本情報」タブに入れた既定の画像 → ③このOGP設定で自動生成したカードです。「せっかく設定したのに違う画像が出る」というときは、上の段の画像が使われていないか確認してください。

5. あとから変えたときの反映

共有カードは、ページのタイトル・コミュニティのテーマ色・ここでの設定から作られます。どれかを変えると新しいカードが自動で作り直されるので、テーマの色を変えたあとにOGPを設定し直す必要はありません。投稿のタイトルを直したときも同じです。

ただし、SNS側が以前のカードを覚えていることがあります。同じURLを貼り直しても古い画像が出るときは、ナカーマ側ではなくSNS側にカードの情報が残っている状態です。しばらく時間をおくか、各SNSが用意しているカードの再取得ツールをお使いください。

まずはテンプレートをひととおり切り替えて、コミュニティの雰囲気に合うものを選んでみましょう。SNSでの見え方が整うと、シェアされたときの印象が変わります。

公開ページそのものの組み立てはヘルプ記事「ホームページを組み立てる」、色やロゴなどの見た目はヘルプ記事「サイトのデザインを変える」で説明しています。