エンジニアステップ

初心者エンジニア(1年目~3年目くらい)のための技術ブログ

OGP設定方法 | WEBサイト制作初心者のための必要最低限のSNS対策【チートシート】

WEBサイト制作初心者は、最低限の「OGP設定」をすることで、SNSシェアに向けて対策をしましょう。

本記事では、

  1. OGPとは何か?
  2. 最低限設定するべき内容

について語ります。

 

OGPとは?なぜ必要?

OGPとは「Open Graph Protocol」の略語です。

SNSでWEBサイトや記事をシェアした時に、SNSに正しく情報を伝えるために必要です。

伝えるためには、metaタグを使って、表示のために必要な情報を記載します。

 

OGPに最低限設定するべき内容まとめ

OGPに最低限設定するべき内容まとめです。

チートシート的なものです↓

 

<!-- 基本 -->
<meta property="og:url" content=" 【URL】" />
<meta property="og:type" content=" 【website / blog / article】" />
<meta property="og:title" content=" 【タイトル】" />
<meta property="og:description" content=" 【説明】" />
<meta property="og:site_name" content="【サイト名】" />
<meta property="og:image" content="【画像】" />

 

<!-- Facebook -->
<meta property="fb:app_id" content="【数字】" />
<meta property="fb:admins" content="【数字】" />

 

<!-- Twitter -->
<meta name="twitter:image" value="【画像】" />
<meta name="twitter:card" value="【色々あるけどとりあえずsummary_large_image】" />
<meta name="twitter:site" value="【ツイッターアカウント @から】" />
<meta name="twitter:creator" value="【ツイッターアカウント @から】" />
<meta name="twitter:title" value="【記事名/サイト名】" />
<meta name="twitter:description" value="【説明】" />

 

これだけ設定しておけばOKだと思います。

とりあえずメモ書き代わりでした(灬╹ω╹灬)