OGPとは?

OGPとは、Open Graph Protocolの略で外部にこのウェブページはこのような内容のサイトですとわかりやすく伝えるためのプロトコル（お約束）となります。

外部とは主にFacebookやtwitter、Google+、mixiなどのSNSがあげられます。
最近のサイトでは、headerに必ずと言っていいほどこのOPGが設定されています。
現在のウェブサイトを運営していく上では必須といっていいでしょう。

OGP記述の例

具体的な記述は以下のような形になっています。

<meta property="og:title" content="ページタイトル" />
<meta property="og:type" content="websiteまたはarticle" />
<meta property="og:url" content="ページのURL（http://から指定）" />
<meta property="og:site_name" content="サイト名" />
<meta property="og:description" content="ページの説明" />
<meta property="og:image" content="画像のURL（http://から指定）" />
<meta property="og:locale" content="ja_JP" />
<meta property="fb:app_id" content="XXXXXXXXXXXXXXXX" />
<meta property="fb:admins" content="XXXXXXXXXXXXXXXX" />

og:typeは、普通のブログであれば「blog」となりますが、普通のサイトの場合は「website」が適切となります。
また、下層ページは、「blog」や「website」は適切ではありません。
トップページ以外には「article」と指定するのが適切となります。

「fb:app_id」と「fb:admins」

この中で、特にわかりづらいのは「fb:app_id」と「fb:admins」ではないでしょうか？
fb:adminsはfacebookの個人のアカウントと紐付ける事が出来るそうです。
また、fb:app_idは個人アカウントに紐付けするのではなく、facebook appとして紐付ける事が出来ます。こちらは複数で管理する際に便利です。

詳しくは、Six Apart社のこちらの方のブログが参考になります。

http://blog.sixapart.jp/2012-04/fb-app-id.html

さらにOPGに関する詳しい内容はOPG公式サイトなどのページを参照下さい。

Wopdpressのプラグインの利点と問題点

WordPress等ではOPGを自動で設定してくれるプラグインがあるのでそれらを利用するのも手です。
ただし、プラグインではFacebookの仕様が変わった時など迅速に対応出来ない場合があります。

例えば、go:imageで設定する画像は、画像サイズを縦横200px以上でないとFacebookの「いいね！」が上手く反映されない場合があるそうです。
そういった場合はプラグインでの対応待ちになってしまうケースがあります。
対応待ちによって出てしまう問題を避ける場合や細かく設定したい場合、自前でOPGを吐き出すスクリプトを書くのが一番手っ取り早いです。

自前のOGP出力スクリプト例

参考に以下にサンプルを記載いたします。
og:imageはアイキャッチ画像が設定されている場合そちらを使うように設定しています。
アイキャッチ画像は、最低でも600px × 315px以上のサイズのものを指定するようにしましょう。
しかもFacebookの推奨は1200px × 630pxだそうです！

下記のサンプルを元にサイトの仕様に合わせてカスタマイズするといいでしょう。

<?php
//OPEN GRAPH PROTOCOL for Facebook settings  

if(is_single() || is_page()):// for single page ogp ?-->"<?php 
//OPEN GRAPH PROTOCOL for Facebook settings
 if(is_single() || is_page()):// for single page ogp
?>
<meta property="og:title" content="<?php wp_title(''); ?>">
<meta property="og:type" content="<?php echo 'article'; ?>">
<meta property="og:url" content="<?php the_permalink(); ?>">
<meta property="og:image" content="<?php
//アイキャッチ画像が設定されている場合の画像指定
if(has_post_thumbnail()):
 $opgimg_id = get_post_thumbnail_id();
 $opgimg = wp_get_attachment_image_src($opgimg_id,$size="full",$icon=false);
 echo esc_url($opgimg[0]);
 else ://アイキャッチ画像が設定されていない場合の画像の指定
 echo esc_url(home_url('/')) . 'images/logo.jpg';
endif;
?>">
<meta property="og:description" content="<?php
//YOAST WORDPRESS SEOを使用している場合の例
if($opg_desc = get_post_meta($post->ID,'_yoast_wpseo_metadesc')):
 echo esc_attr($opg_desc[0]);
else :
 $opg_desc = mb_strimwidth(strip_tags($post->post_content),0,300,'','UTF-8');
 echo esc_attr(str_replace(array("\r\n","\r","\n"), '',$opg_desc));
endif;
?>">
<?php
 elseif(is_archive())://for archive page ogp
?>
<meta property="og:title" content="<?php wp_title(''); ?>">
<meta property="og:type" content="<?php echo 'article'; ?>">
<meta property="og:url" content="<?php
 echo esc_url(home_url('','http') . $_SERVER['REQUEST_URI']);
?>">
<meta property="og:image" content="<?php
 echo esc_url(home_url('/')) . 'images/common/new_logo_big.jpg';
?>">
<meta property="og:description" content="<?php
$quired_obj = get_queried_object();
$term_description = strip_tags(term_description($quired_obj->term_taxonomy_id,$quired_obj->taxonomy));
echo esc_attr(str_replace(array("\r\n","\r","\n"),'',$term_description));
?>">
<?php
 elseif(is_front_page()):
?>
<meta property="og:title" content="<?php wp_title(''); ?>">
<meta property="og:type" content="website">
<meta property="og:url" content="<?php echo esc_url(home_url('/')); ?>">
<meta property="og:image" content="<?php echo esc_url(home_url('/')) . 'images/common/new_logo_big.jpg'; ?>">
<meta property="og:description" content="<?php
 if($opg_desc = get_post_meta($post->ID,'_yoast_wpseo_metadesc')):
 echo esc_attr($opg_desc[0]);
 endif;
?>">
<?php
 endif;
?>
<meta property="og:site_name" content="<?php bloginfo('name'); ?>">
<meta property="fb:admins" content="adminns">
<meta property="fb:app_id" content="アプリケーションID">