HubSpotでソーシャルメディアへの投稿を作成して公開すると、対応するソーシャルネットワークで投稿の画像プレビューの生成が試みられます。投稿に入力したリンクに基づき、ソーシャルネットワークではページのソースコードに含まれるメタタグをスキャンし、ウェブサイトのrobots.txtファイルをクロールします。
WordPressなどの外部プロバイダーでウェブサイトをホスティングしている場合、投稿のプレビューが想定どおりに表示されなければ、以下の手順に従ってください。
robots.txtを更新する
robots.txtは検索エンジンに対し、ウェブサイトをインデックス化する方法を伝えるためのファイルです。robots.txtファイルが追加されていなかったり、適切に構成されていなかったりすると、ソーシャルネットワークではページのコンテンツを解析できません。Facebook、X、どちらもrobots.txtファイルに追加する必要があるユーザーエージェント文字列を提供しています：
User-agent: facebookexternalhit
Disallow:
User-agent: Twitterbot
Disallow:
LinkedInではユーザーエージェント文字列に関するドキュメントを提供していませんが、LinkedIn投稿インスペクターを使用して、ウェブサイトのコンテンツをLinkedInでクロールできるかどうかを確認できます。
ウェブサイトページの<head>セクションにメタグタグを追加する
検索エンジンとソーシャルネットワークはHTMLのヘッドセクションを解析して、ページのプレビューを生成するために必要なメタデータを探します。FacebookとX、主要なメタタグの後にメタデータを含める必要があります：
<!-- Primary Meta Tags -->
<title>Meta Tags — Preview, Edit and Generate</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">
上記の各メタタグのcontent属性には、ページに応じた値を入力します。Facebook debugger tool , X card validator , LinkedIn post inspectorを使ってMetaタグを検証できる。
キービジュアルのサイズ要件
挿入したリンクのキービジュアル画像がソーシャルプレビューで正しく表示されない場合（画像が切れている、比率が正しくないなど）、画像を編集して、投稿先のソーシャルネットワーク（）に適した寸法にし、ページを再公開する必要があるかもしれません。Facebookに投稿する場合は、Facebookのドキュメントに記載されているキービジュアルの要件で詳細を確認できます。
各ネットワークでキービジュアルを最適化するには、次の寸法にすることをお勧めします。
- Facebook 1.91:1
- X : 写真投稿は16:9、リンク投稿のキービジュアル画像は1.91:1
- Instagram （正方形）：1:1
- Instagram （ポートレート）：4:5
- Instagram （風景）： 1.91:1
- LinkedIn（風景）： 1.91:1
ソーシャルメディアへの投稿に含めるメディアが各ネットワークのファイルサイズのガイドラインに従っていることを確認してください。特定のネットワークに投稿するにはファイルが大きすぎるとHubSpotが判断すると、警告が表示されます。各ソーシャルネットワークの最大ファイルサイズは以下のとおりです。
- Facebook 8MB (ピクセル化を避けるため、PNGファイルは1MB以下を推奨)
- Instagram 8MB
- X : 5MB (GIFは15MB)
- LinkedIn 10MB
画像の色と鮮明さの不一致
画像の色の違い
ソーシャル投稿にキービジュアルがどのように表示されるかは、埋め込みカラープロファイルによって影響される可能性があります。共通ではないカラープロファイルはシステムによって異なる方法で処理されます。ファイルマネージャーで画像をプレビューする際に色が異なって見える場合があるのは、このことが原因です。画像の URL をの外部ツールに通すと、一般的でないカラープロファイルを使用しているかどうかを確認できます。必要に応じて、Photoshopなどの写真編集ツールを使用して問題の原因となっているカラープロファイルを削除してから、ページを再公開した後、ソーシャルメディアへの投稿を公開できます。
画像の鮮明さの違い
HubSpotのファイルマネージャー、JPEGとPNGの画像圧縮を使用して、HubSpotがホスティングするコンテンツの読み込み速度を最適化します。ソーシャルメディアネットワークでも投稿で画像の圧縮を使用していますが、HubSpotで表示される品質とは異なる場合があります。そのため、各ネットワークの（推奨されるアスペクト比で）比較的高い解像度の画像を使用することをお勧めします。画像がソーシャルネットワークの要件に準拠していない場合、HubSpotのソーシャルパブリッシングツールに警告が表示されるので、それに応じて画像を調整します。
それでもリンクプレビューが正しく表示されない場合は、トラブルシューティングガイドをご覧ください。
Social
Marketing Hub
Professional
,
Enterprise
