こんにちは "osaboo"
です。"@osaboo_Bot"
AFFINGER6の「SNS / OGP設定」で迷っている方へ、初心者でも失敗しないおすすめ設定とやり方をわかりやすく解説します。
SNS設定って何を触ればいいの？
OGPってそもそも何…？
設定しないとどうなるの？
正解の設定だけサクッと知りたい
それではご覧ください。
AFFINGER6「SNS / OGP設定」とは？
AFFINGER6の「SNS / OGP設定」とは、記事をSNSでシェアしたときの見え方や表示内容をコントロールできる機能です。
たとえば、X（旧Twitter）やFacebookで記事がシェアされるときに…
- タイトル
- アイキャッチ画像
- 説明文
などが自動で表示されます。
この表示を最適化する仕組みが「OGP（Open Graph Protocol）」です。
なぜSNS / OGP設定が重要なのか
SNS / OGP設定を適切に行うことで、以下のメリットがあります。
- 記事の見た目が整い、クリックされやすくなる
- SNSからのアクセス（流入）が増える
- ブログの印象（信頼性）が上がる
逆に設定していないと…
- 画像が表示されない
- タイトルが崩れる
- 地味な見た目でクリックされない
といった状態になります。
初心者がやるべきことはシンプル
「設定が多くて難しそう…」と感じるかもしれませんが、実際にやるべきことはそこまで多くありません。
👉 ポイントはこの2つだけです！
- SNSボタンを適切に表示する
- OGP（画像・タイトル）を正しく設定する
この2点を押さえるだけで、SNSからの見え方は大きく改善されます。
SNS / OGP設定の場所
まずは、AFFINGER6の「SNS / OGP設定」がどこにあるのかを確認しましょう。
設定画面の開き方
WordPressの管理画面から、以下の手順で進みます。
Menu 『WordPress管理＞ダッシュボード＞AFFINGER管理＞SNS / OGP（タブ）』をクリックします。
- SNSボタンやOGPの設定画面が開きます。
この画面でできること
「SNS / OGP」タブでは、主に以下の設定ができます。
- SNSボタンの表示・デザイン設定
- 表示するSNSの種類
- OGP（SNS表示用のタイトル・画像）設定
- Twitterカードの設定
- ハッシュタグ設定
「SNSでどう見えるか」を全部コントロールできる場所です。
SNS設定
SNSボタンは、記事内に以下のように表示されます。表示パターンもあわせて確認しておきましょう。
設定画面はこちらです。
- SNSボタンをシンプルにする
- SNSボタンを丸くする
- SNSボタンをシンプルにする
チェックが入っていないデフォルト状態の設定画面
- SNSボタンのカラーを優しい色にする
- 投稿ページの上にSNSボタンを表示する
アイキャッチ画像を含めた…
- 投稿ページの上にSNSボタンを表示する
OGP設定
OGP（Open Graph Protocol）とは、SNSでページをシェアしたときの見た目を整える仕組みです。
SNSボタンと同様に表示パターンもあわせて確認しておきましょう。
設定画面はこちらです。
X（旧Twitter）カードサイズ：小（summary）
X（旧Twitter）カードサイズ：大（summary_large_image）
最初にやるべきこと
このあと紹介する「おすすめ設定」をそのまま真似すればOKです。
細かいカスタマイズは後回しで問題ありません。
【結論】AFFINGER6「SNS / OGP設定」のおすすめ設定
AFFINGER6の「SNS / OGP設定」は細かくカスタマイズできますが…
初心者の方はまず、以下の設定をそのまま真似すればOKです。
SNSボタンのおすすめ設定
- ボタンデザイン：シンプル（＋丸くする）
- 表示位置：記事下（＋記事上）
- 表示するSNS：X（旧Twitter）・Facebook・はてなブックマーク
- コピーリンク：ON
- SNSボタンをシンプルにする
- SNSボタンをシンプルにする
- SNSボタンを丸くする
👉 ポイント
シンプルなデザイン＋上下表示にすることで、自然にシェアされやすくなります。
SNSボタンのカスタマイズ設定
- カラー：デフォルトのままでOK
👉 ポイント
無理にデザインを変えるよりも、見やすさを優先した方がクリック率は上がります。
OGP設定（重要）
- OGP出力：ON
- Twitterカード：大（summary_large_image）
- Facebook OGP：ON
- ハッシュタグ：空欄（または1つだけ）
👉 ポイント
画像が大きく表示される設定にすることで、SNS上で目立ちやすくなります。
OGP画像の設定
- アイキャッチ画像：必ず設定する
- 推奨サイズ：1200 × 630px
👉 ポイント
画像がないと、SNSでの表示が崩れたりクリックされにくくなります。
アイキャッチ画像については、こちらの記事で詳しく解説しています。あわせてご覧ください。
不要なSNSは非表示にする
- 使わないSNSはOFF
👉 ポイント
ボタンが多すぎると逆にクリックされにくくなるため、必要なものだけ表示しましょう。
ここまでやればOK
上記の設定をしておけば…
👉 SNSで見栄えよく表示される状態は完成です。
細かい調整は、アクセスが増えてからで問題ありません。
ワンポイント補足
- トップページのOGPは別で設定が必要
- 変更後は反映まで時間がかかる場合あり
トップページの SNS / OGP については、こちらの記事で詳しく解説しています。あわせてご覧ください。
-
-
AFFINGER6でトップページのSEO・SNS設定を実際にやってみた！【初心者向け手順】
AFFINGER6でトップページのSEOとSNS設定を完全解説！正しい設定を行うだけで検索順位とSNSシェア率がアップ。初心者でも3分でできる実践ガイドです。
SNS設定のやり方
ここでは、AFFINGER6の「SNS設定（SNSボタン）」の具体的な設定方法を解説します。
基本的には、前章で紹介した「おすすめ設定」をそのまま反映すればOKです。
SNSボタンの表示設定
まずは、記事内に表示されるSNSボタンの設定です。
設定画面では、以下の項目を調整できます。
- 表示するSNSの種類
- 表示位置（記事上・記事下）
- ボタンデザイン
👉 設定のポイント
- 表示位置は「記事上＋記事下」にする
- 使用するSNSだけONにする
これだけで、シンプルかつ効果的なシェア導線が作れます。
SNSボタンのデザイン設定
次に、SNSボタンの見た目を調整します。
選べる主なデザインは以下の通りです。
- ブランドカラー（優しい色にする）
- シンプル（＋丸くする）
- 単色カラーの設定は、カスタマイザーから簡単に行えます。
👉 おすすめは「シンプル（＋丸くする）」
理由は、主張しすぎず記事の邪魔をしないためです。
結果的に自然にクリックされやすくなります。
表示するSNSの選び方
AFFINGER6では複数のSNSボタンを表示できますが、すべて表示する必要はありません。
👉 基本はこの3つでOK
- X（旧Twitter）
- はてなブックマーク
👉 ポイント
- 使わないSNSはOFFにする
- ボタンは少ない方がクリックされやすい
コピーリンクボタンの設定
「コピー」ボタンをONにしておくと、URLを簡単にコピーできるようになります。
👉 メリット
- SNS以外でもシェアされやすくなる
- LINEやチャットで共有しやすい
特にこだわりがなければ、ONでOKです。
SNS設定でよくあるミス
初心者がやりがちなミスも押さえておきましょう。
- SNSを全部ONにしてしまう
- デザインを派手にしすぎる
- 表示位置をどちらか片方だけにする
👉 対策
- 必要なSNSだけに絞る
- シンプルなデザインにする
- 上下どちらにも表示する
OGP設定のやり方（重要）
OGP設定では、SNSで記事がシェアされたときの
タイトル・画像・説明文の見え方を調整できます。
この設定が適切にできているかどうかで、
👉 クリック率が大きく変わります。
OGPとは？
OGP（Open Graph Protocol）とは、SNSでシェアされたときに表示される情報を制御する仕組みです。
具体的には👇
- 記事タイトル
- アイキャッチ画像
- 説明文（ディスクリプション）
が自動で表示されます。
OGP出力をONにする
まずは基本設定です。
- OGP出力：ON
👉 ポイント
これをONにしないと、SNSで正しく表示されません。
Twitterカードの設定
次に、X（旧Twitter）での表示形式を設定します。
- Twitterカード：summary_large_image（大）
👉 おすすめ理由
- 画像が大きく表示される
- タイムラインで目立つ
- クリック率が上がりやすい
Facebook OGPの設定
Facebookでの表示にも対応しておきます。
- Facebook OGP：ON
👉 ポイント
ONにしておけば、自動で適切な表示になります。
ハッシュタグ設定
SNS投稿時に自動で付与されるハッシュタグを設定できます。
- 基本：空欄でOK
- 使う場合：1つだけ
👉 ポイント
- 多すぎると逆に見にくい
- シンプルな方が自然に見える
OGP画像（アイキャッチ）の設定
OGPで最も重要なのが画像です。
- アイキャッチ画像：必ず設定する
- 推奨サイズ：1200 × 630px
👉 ポイント
- 画像がないと表示が崩れる
- 小さい画像は見栄えが悪くなる
- クリック率に直結する
OGPが反映されないときの対処法
設定しても反映されない場合は、以下を確認しましょう。
- キャッシュが残っている
- SNS側に古い情報が残っている
- 画像が設定されていない
👉 対策
- 時間を置く
- 再シェアする
- キャッシュ削除する
よくある失敗
- アイキャッチ画像を設定していない
- Twitterカードが小サイズになっている
- OGPをOFFのままにしている
👉 これだけ避ければOK
不要なSNSの非表示設定
AFFINGER6では、複数のSNSボタンを表示できますが、すべて表示する必要はありません。
むしろ、不要なSNSは非表示にした方が効果的です。
なぜSNSは絞った方がいいのか
SNSボタンが多すぎると👇
- どれを押せばいいか迷う
- 視認性が下がる
- 結果的にクリックされにくくなる
👉 選択肢が多いほど行動しにくくなる（選択の法則）
表示するSNSの目安
基本は以下だけでOKです。
- X（旧Twitter）
- はてなブックマーク
👉 ポイント
- 日本のブログならこの3つで十分
- それ以外は必要に応じて追加
SNSの非表示設定のやり方
設定画面で、表示したいSNSだけをONにします。
👉 手順はシンプル
- 使うSNS → ON
- 使わないSNS → OFF
これだけでOKです。
コピーリンクはONがおすすめ
「コピー」ボタンはONにしておきましょう。
👉 理由
- SNS以外でもシェアされやすい
- LINE・メール・チャットで使われる
意外と使われるので、ONがおすすめです。
シンプルが一番強い
SNSボタンは、
👉 **「少なく・わかりやすく」**が正解です。
- 多すぎる → クリックされない
- 少なすぎる → 機会損失
👉 必要最低限に絞るのがベスト
トップページのOGP設定の注意点
AFFINGER6では、記事ページとは別にトップページ（ホーム）のOGP設定にも注意が必要です。
ここを設定していないと、SNSでシェアされたときに👉 意図しない表示になることがあります。
トップページは別で設定が必要
記事ページはアイキャッチ画像がそのまま使われますが…
トップページには個別の画像がないため👇
- 画像が表示されない
- 意図しない画像が表示される
- タイトルや説明文がズレる
といった問題が起きることがあります。
対処方法
トップページ用に以下を設定しておきましょう。
- OGP用の画像を用意する
- サイトタイトル・説明文を整える
👉 ポイント
- 画像サイズは「1200 × 630px」推奨
- サイト全体のテーマが伝わる画像にする
固定ページをトップにしている場合
WordPressで
「固定ページをトップページに設定している場合」は注意が必要です。
👉 この場合…
- その固定ページのアイキャッチ画像
- ディスクリプション
がOGPとして使われます。
よくあるミス
- トップページのOGPを未設定
- 画像が設定されていない
- 古い画像が表示される
👉 対策
- OGP画像を必ず用意する
- 設定後に表示を確認する
確認しておこう
設定ができたら、実際にSNSでシェアしたときの表示をチェックしましょう。
👉 確認ポイント
- 画像は正しく表示されているか
- タイトルは適切か
- 説明文は自然か
よくある失敗と対処法
AFFINGER6の「SNS / OGP設定」で、初心者がつまずきやすいポイントをまとめました。
事前に知っておけば、無駄なトラブルを防げます。
❶ SNSで画像が表示されない
原因
- アイキャッチ画像が未設定
- OGPがOFFになっている
👉 対処法
- アイキャッチ画像を設定する
- OGP出力をONにする
❷ 画像やタイトルが変更後も反映されない
原因
- キャッシュが残っている
- SNS側に古い情報が保存されている
👉 対処法
- 少し時間を置く
- 再シェアする
- キャッシュを削除する
❸ Twitterカードが小さいままになる
原因
- カード設定が「summary」になっている
👉 対処法
- 「summary_large_image」に変更する
❹ SNSボタンを増やしすぎている
原因
- とりあえず全部ONにしている
👉 対処法
- 必要なSNSだけに絞る
❺ トップページのOGPを設定していない
原因
- 記事だけ設定して満足している
👉 対処法
- トップページ用のOGP画像を設定する
AFFINGER6の設定をまだ済ませていない方は、まずは「全体設定」から進めるのがおすすめです。
全体の土台を整えておくことで、今回のSNS / OGP設定もスムーズに行えます。
-
-
AFFINGER6「全体設定」タブ完全ガイド｜サイト全体の初期設定とカスタマイズを徹底解説
AFFINGER6の「全体設定」タブを初心者向けに完全解説。サイト全体のデザイン、レイアウト、フォント、サムネイル設定まで、どこをどう設定すればいいかがひと目でわかります。
まとめ！AFFINGER6「SNS / OGP設定」のやり方｜初心者向けおすすめ設定とカスタマイズ方法
AFFINGER6の「SNS / OGP設定」は、SNSからのアクセスを増やすために欠かせない重要な設定です。
難しそうに見えますが、やるべきことはシンプルです。
もう一度おさらい
- SNSボタンは「シンプル＋必要最低限」
- OGPは必ずONにする
- Twitterカードは「大（summary_large_image）」
- アイキャッチ画像は必ず設定
- トップページのOGPも忘れない
まずはここまででOK
この記事で紹介した設定を行えば、👉 SNSで見栄えよく表示される状態は完成です。
細かいカスタマイズは、アクセスが増えてから調整していきましょう。
この記事がお役に立てば嬉しいです。
「最後まで、ご観覧いただきありがとうございました。」
また、次の記事で…お会いしましょう。＼^^／
