OGP（Open Graph Protocol）は、ウェブページがソーシャルメディア上で共有される際に表示される情報を指定するためのメタデータの一種です。
目次
OGPを設定することのメリット
- ソーシャルメディア上でシェアされる時に正確かつ訴求力のある情報が表示されるため、ユーザーの注目を集めやすくなります。
- 検索エンジンに対しては、ページの情報を正確に認識させることができ検索結果に影響を与えます。
- OGPの設定がない場合、ソーシャルメディア上でシェアされる時には、自動的にページのタイトルや説明文、画像が選択されますが、設定することで自分で任意に指定することができる為、より魅力的な訴求力のある情報を表示することができます。
一般的なOGPの設定方法は？
一般的なことでいうと、以下の手順で行うことができます。
head要素内にOGPのメタデータを記述するタグを追加する。
<meta property="og:title" content="ページのタイトル"><meta property="og:description" content="ページの説明文"><meta property="og:type" content="ページの種類"><meta property="og:url" content="ページのURL"><meta property="og:image" content="画像のURL">
各プロパティの値を適切に設定する。
例えば、「og:title」にはページのタイトル、「og:description」にはページの説明文、「og:image」には表示させたい画像のURLを指定します。さらに、ページの情報に合わせて「og:type」を指定します。ブログ記事であれば"article"、商品ページであれば"product"という値です。
以上の手順を行うことで、OGPの設定が完了します。
「PORTAS」はOGPコードを自動生成で手間なし！
PORTASでは、OGPコードは自動で生成しますので手動で設置する手間はありません！
「og:title」も「og:description」も「og:image」も記事タイトルや、カスタムフィールドに入力された値で生成します。
