ogp

公開日:  2015/02/10        0    0    0    2    hatenauser    

OGPって何だ?

「Open Graph Protocol(オープン・グラフ・プロトコル)」のこと

Twitter
Twitterカードは設定が必要

Summaryカード: デフォルトのカードで、タイトル、説明、サムネイル、Twitterアカウントの属性が含まれています。

<meta name=“twitter:card” content=“summary”>

カード申請

新機能『引用ツイート』


Facebook

FacebookやGoogle+は、ページにOGP設定のタグを設置

Facebook debugger

facebook ID

【最新版】OGP設定時に必要な「fb:admins」の取得方法

以前に 【Facebook-OGP】「fb:admins」「fb:app_id」「SecretKey」の場所 このエントリーでFacebookのOGP設定に必要な値を取得するにはどこを参照すれば良いか…

(via:Qlay)

 

 

ogp.phpを作成しました

header.phpで読み込みます
<?php get_template_part(‘ogp’);?>

<!-- OGP -->
<meta property="og:type" content="blog">
<?php
if (is_single()){//単一記事ページの場合
if(have_posts()): while(have_posts()): the_post();
  echo '<meta property="og:description" content="'.mb_substr(get_the_excerpt(), 0, 100).'">';echo "\n";//抜粋を表示
endwhile; endif;
  echo '<meta property="og:title" content="'; the_title(); echo '">';echo "\n";//単一記事タイトルを表示
  echo '<meta property="og:url" content="'; the_permalink(); echo '">';echo "\n";//単一記事URLを表示
} else {//単一記事ページページ以外の場合(アーカイブページやホームなど)
  echo '<meta property="og:description" content="'; bloginfo('description'); echo '">';echo "\n";//「一般設定」管理画面で指定したブログの説明文を表示
  echo '<meta property="og:title" content="'; bloginfo('name'); echo '">';echo "\n";//「一般設定」管理画面で指定したブログのタイトルを表示
  echo '<meta property="og:url" content="'; bloginfo('url'); echo '">';echo "\n";//「一般設定」管理画面で指定したブログのURLを表示
}
$str = $post->post_content;
$searchPattern = '/<img.*?src=(["\'])(.+?)\1.*?>/i';//投稿にイメージがあるか調べる
if (is_single()){//単一記事ページの場合
  if (has_post_thumbnail()){//投稿にサムネイルがある場合の処理
    $image_id = get_post_thumbnail_id();
    $image = wp_get_attachment_image_src( $image_id, 'full');
    echo '<meta property="og:image" content="'.$image[0].'">';echo "\n";
  } else if ( preg_match( $searchPattern, $str, $imgurl ) && !is_archive()) {//投稿にサムネイルは無いが画像がある場合の処理
    echo '<meta property="og:image" content="'.$imgurl[2].'">';echo "\n";
  } else {//投稿にサムネイルも画像も無い場合の処理
    $ogp_image = get_template_directory_uri().'//keitai-sim.com/wp-content/uploads/2015/05/keitai-sim.png';
    echo '<meta property="og:image" content="'.$ogp_image.'">';echo "\n";
  }
} else {//単一記事ページページ以外の場合(アーカイブページやホームなど)
  if (get_header_image()){//ヘッダーイメージがある場合は、ヘッダーイメージを
    echo '<meta property="og:image" content="'.get_header_image().'">';echo "\n";
  } else {//ヘッダーイメージがない場合は、テーマのスクリーンショット
    echo '<meta property="og:image" content="'.get_template_directory_uri().'/screenshot.png">';echo "\n";
  }
}
?>
<meta property="og:site_name" content="<?php bloginfo('name'); ?>">
<meta property="og:locale" content="ja_JP" />
<meta property="fb:admins" content="100004385896866">
<meta property="fb:app_id" content="APP_ID">


Google+



▼ コメント表示

PAGE TOP ↑