Facebookでサムネイルと表示写真を別々にする方法

Table Of Contents
- 目的と前提条件
- 手順:サムネイルと表示写真を別にする方法
- 追加のヒントとトラブルシューティング
- 代替アプローチと制限事項
- 受け入れ基準とテストケース
- 役割別チェックリスト
- セキュリティとプライバシーの注意点
- まとめ
目的と前提条件
この手順は、プロフィールページに表示される「表示写真(ディスプレイ画像)」と、プロフィール写真の投稿で使われるサムネイルを別々にしたい場合に使います。FacebookのUIや内部属性を一時的に書き換えることで、サムネイルに別画像のIDを与えられます。
前提条件:
- デスクトップのブラウザ(ChromeまたはFirefox)を使用すること。モバイルアプリでは要素検証が原則できません。
- 「プロフィール写真」アルバムに2枚以上の画像が存在すること(表示用とサムネイル用に別画像を用意するため)。
- ブラウザの開発者ツール(要素検証)に慣れていること。基本は要素の値を書き換えるだけです。
重要:この方法はFacebookのクライアント側の挙動に依存します。Facebookの仕様変更により動作しなくなる可能性があります。
手順:サムネイルと表示写真を別にする方法
以下はステップごとの手順です。画像のスクリーンショットは元記事と同じファイルパスを保持しています。
プロフィール写真アルバムから表示にしたい画像のID(fbid)を取得する
- Facebookの「プロフィール写真」アルバムを開き、表示したい画像をクリックして単独表示します。ブラウザのアドレスバーに表示されるURLの中から、fbid= の値を探してコピーしてください。これが該当画像の内部IDです。
プロフィール画面に移動して「サムネイル編集」モードを開く
- 自分のプロフィールページに移動し、プロフィール写真にカーソルを合わせます。
- 表示されるメニューから「プロフィール写真を編集」→「サムネイルを編集」を選び、サムネイル編集のポップアップを出します。
サムネイル画像上で要素検証を実行する
- ポップアップ内のサムネイルにマウスを合わせ、右クリックして「要素を検証」(Inspect element)を選択します。
開発者ツールで該当するフォームタグと属性を探す
- 開発者ツール(Elements/要素タブ)が開いたら、フォーム(form)タグやその配下を展開して検索します。
- ブラウザごとの検索対象例:Chrome/Firefoxで「form」を探し、該当ノードを展開してください。以下は参考スクリーンショットです。
photo_fbid 属性を見つけて値を置き換える
- 展開したコードの中に photo_fbid という属性が含まれるタグがあります(例:photo_fbid=”1234567890”)。その値を、ステップ1でコピーした fbid 値に置き換えます。
- 値を書き換えたら Enter を押して編集を確定し、ポップアップ上の「保存」ボタンをクリックします。
保存して確認する
- 保存後、プロフィールページを再読み込みして、表示写真とサムネイルが別々に表示されているか確認します。期待通りであれば成功です。
追加のヒントとトラブルシューティング
動作しない場合のチェックポイント:
- ブラウザのキャッシュをクリアしてから再読み込みする。
- 対象画像が非公開になっていないか確認する(プライバシー設定によってはIDが無効になることがあります)。
- FacebookのUIが更新されると属性名や構造が変わるため、photo_fbid の名称が変わっていないか確認する。
- モバイルでは要素検証ができないため必ずデスクトップで操作する。
元に戻す方法:
- 同じ手順で photo_fbid の値を元のIDに戻すか、プロフィール写真を再設定し直してサムネイルを更新してください。
いつ効かないか(反例):
- Facebookがサーバー側でサムネイルを再生成している場合は、クライアント側での属性書き換えが無効化されることがあります。
- 企業ページや特殊なプロフィール(例:管理者の権限が制限されたアカウント)では動作しない可能性があります。
代替アプローチ
公式の方法:Facebookは基本的に1つのプロフィール画像を想定しているため、公式には「表示画像とサムネイルを別にする」設定は提供していません。代替としては、投稿時に希望するサムネイル用のカスタム画像を投稿し、その投稿をプロフィールに固定するなどの運用が考えられます。
外部サービスや自動化:サードパーティ製のSNS管理ツールでプロフィール画像の切り替えをスケジュールする方法もありますが、サムネイルの分離を保証するものは少ないです。
受け入れ基準
- プロフィールページを開いたとき、プロフィールのメイン表示画像(大きな表示)と、プロフィール写真を参照する投稿のサムネイル画像が異なること。
- 操作が完了してからページを再読み込みしても、少なくとも最初の表示で差異が確認できること。
テストケース/確認手順
- 事前準備:プロフィール写真アルバムにImageA(表示用)とImageB(サムネイル用)を用意。
- 手順実行:本手順を実行してphoto_fbidを書き換える。
- 検証1:プロフィールページを表示して、大きな表示画像がImageAであることを確認。
- 検証2:プロフィール写真の投稿サムネイルがImageBであることを確認。
- ロールバック:元に戻す操作を行い、両方とも同じ画像に戻ることを確認。
役割別チェックリスト
一般ユーザー:
- デスクトップで実施する。
- 画像ID(fbid)を正しくコピーする。
- 保存後に表示を確認する。
ソーシャルメディア担当者:
- ブランディングに矛盾がないか確認する(プロフィールとサムネイルで別画像を使う影響)。
- 目視でブランド要件を満たしているか承認する。
セキュリティとプライバシーの注意点
- ブラウザの要素検証で行う操作はクライアント側のみの変更です。サーバーに新しい画像をアップロードしたり、パスワードやトークンを入力する必要はありません。とはいえ、プライバシー設定や画像の公開範囲に注意してください。
- 他人の許可なく第三者の写真を使用しないでください。著作権や肖像権に注意が必要です。
なぜこの手法が成り立つのか(メンタルモデル)
Facebookのプロフィール写真周りのUIは、表示(ディスプレイ)と投稿サムネイルで内部的に異なる参照IDを持つことがあります。ブラウザの要素検証でその参照先のIDを差し替えると、クライアント側の表示は即時に変わります。サーバー側で強制上書きされない限り、その表示を用いてプロフィールページが描画されます。
まとめ
この方法は、デスクトップブラウザと開発者ツールを使ってFacebookのクライアント側の属性を一時的に書き換えることで、プロフィールの大きな表示画像と投稿サムネイルを別々に見せるハックです。簡単に実行できますが、Facebookの仕様変更やプライバシー設定によって動作しない場合があるため、実運用で使う際は事前にテストしてください。
重要:FacebookのUI変更で動作しなくなる可能性があります。運用で使う場合は定期的に確認を行ってください。