Loading...

Single Post

HOME > post > Web > OGPプラグインから脱却

OGPプラグインから脱却

| Web, WordPress
WordPressイメージ画像

以前は、WordPressでogpを出力するためにopen graph proというプラグインを使用しておりましたが、Facebookページへの表示で画像が上手く読み込めない事が続いた為、他の方法を模索する中でプラグインを使わずに出力する方法に辿り着きました。

ソースを掲載しておきます。【head】内にコピーペーストで貼り付ければ動きます!!


<meta property="fb:admins" content="■fb:adminsのID■" />
<meta property="og:locale" content="ja_JP">
<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";//FBページ表示の抜粋文
     endwhile; endif;
     echo '<meta property="og:title" content="'; the_title(); echo '">';echo "\n";//投稿記事タイトル
     echo '<meta property="og:url" content="'; the_permalink(); echo '">';echo "\n";//投稿記事リンク
} 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
}
?>
<meta property="og:site_name" content="<?php bloginfo('name'); ?>">
<?php
$str = $post->post_content;
$searchPattern = '/<img.*?src=(["\'])(.+?)\1.*?>/i';//投稿記事に画像があるか調べる
if (is_single() or is_page()){//投稿記事か固定ページの場合
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 {//画像が1つも無い場合
     echo '<meta property="og:image" content="■画像が一切ない記事ページで表示させたい「デフォルト画像のURL」■">';echo "\n";
}
} else {//投稿記事や固定ページ以外の場合(ホーム、カテゴリーなど)
     echo '<meta property="og:image" content="■ホームとかカテゴリページで出したい画像のURL■">';echo "\n";
}
?>

上記は、下記サイトを参照させて頂きました。OGP設置理由についても分かり易く書かれているので、是非閲覧される事をお勧めします。

http://yossense.com/ogp/#no01-01

まとめ

OGPって、そもそも必要なの??って聞かれることがありますが、個人的には必要だと思います。Facebookページへリンクを貼った時に適当に画像が表示されたり、長い抜粋文が表示されたりしてコントロールができません。OGPを入れる事でSNSでの表示をコントロールする事が可能になりホームページへのセッション数が向上すると思います!!

関連記事

Contact Page