ホームページにOpen Graphを埋め込んでFacebookにURLを張り付けられたときの見え方をコントロール

投稿日：

Facebookページと連動しているサイトを制作しているときの覚書。

Facebookで誰かがシェアしたときやメッセンジャーでURLを張り付けた際にプレビューされる画像やタイトルを設定する方法。

サイトのヘッダーにOpen Graphのタグを埋め込む。

<meta property="og:url"         content="http://hoge.com/test.html" />
<meta property="og:type"        content="article" />
<meta property="og:title"       content="タイトル" />
< meta property="og:description" content="要約" />
< meta property="og:image"       content="http://hoge.com/key-visual.jpg" />


詳細は公式サイトを参考に


見え方をテストするツールがある。

昔は「Linter」だったけど、今は「シェアデバッガー」という名前に変わったらしい。

image


< Related Posts >