STINGER3でFBの個別記事いいね数の不具合を修正する方法【OGPの設定】

公開日: : 最終更新日:2013/12/03 WPカスタマイズメモ

LINEで送る
Pocket

こちらのブログはSTINGER3というWordPressの無料テーマを使用しています。
このテーマは周りのお友達の間で最近とても人気が高く、SEO効果も高いと評判になっているものです。

デザインもちょこちょことカスタマイズさせていただいて、いざブログオープン!
記事を書いてみたら・・・!!!

FBのいいね数がどの記事も一緒!!!

えええーーー!!!ってことで、修正すべく色々悪戦苦闘してみましたので防備録として記録しておきます。

Facebookのいいね数と記事をシェアした時にタイムラインに流れるURLがおかしい

お友達からの情報や、色々ググってみた結果、STINGER3にはOGPの設定がされていないため、いいねしてもタイムラインに流れなかったり、URLが間違っていたりするようです。

私も試しに個別記事のいいねボタンを押してみたら、2個目の記事をいいねしたにもかかわらず1記事目のURLが流れてしまうという結果になってしまっていました。

そこで必要になるのがOGPの設定らしいということがわかり、OGPって何ーーーー!!!って状態でしたがやってみることに。

今までもWPでブログは作っていて、自分でソーシャルボタン付けてたけど、OGPの設定なんてしてなかったしちゃんと動いてたんだけどなー。
それは、使ってるテーマによるんでしょうね。

で、OGPの設定をするためにはまずFacebookのアプリIDというのが必要だということがわかりました。

FacebookのアプリIDとを取得する

アプリIDの取得には、こちらのサイトを参考にさせていただきました。

Facebook アプリID取得方法 – User’s Manual2

アプリの名前を入れなければならないところでちょっと躊躇してしまいましたが、サイト名でも入れておけばよいと思います。
なんとか取得できました!

アプリIDの取得が出来たら、アプリの設定画面で、[アプリを編集]ボタンをクリックします。

次に、アプリの編集画面に、自サイトのURLを設定します。(これを設定しないと動きません!)

とりあえず、アプリIDの取得は完了!!!

OGPの設定をする

OGPの設定に関しては、こちらの記事を参考にさせていただきました。ありがとうございます。

facebook いいねボタン設置時のOGP設定方法♪ | フリーランスWebデザイナーの仕事
WordPressでOGPを設定する方法 | NEX.FM

ただ、どちらも片方だけでは上手く行かなくて(^-^;)、両方の合わせ技でSTINGER用にまとめてみました。

追加するタグは2か所。
[外観]⇒[テーマ編集]⇒[ヘッダー(header.php)]にあります。

まずは、<html>タグにxmlnsを追加します。

<html></html>タグ内を下記のように変更します。

<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" dir="ltr" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">

次に、<head></head>タグに下記をプラス。

<!–OGP設定–>
<meta property="og:title" content="<?php wp_title(‘&laquo;’, true, ‘right’); ?> <?php bloginfo(‘name’); ?>"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="<?php the_permalink() ?>"/>
<?php if(has_post_thumbnail()) { ?>
<meta property="og:image" content="<?php get_featured_image_url(); ?>" />
<?php } else { ?>
<meta property="og:image" content="<?php bloginfo(‘template_url’); ?>/images/noimage.gif" />
<?php } ?>
<meta property="og:site_name" content="<?php bloginfo(‘name’); ?>"/>
<meta property="og:description"
content="ここにサイトの説明を書きます。 "/>
<meta property="fb:admins" content="ここにFacebookのアカウント名を書きます。" />
<meta property="fb:app_id" content="ここにFacebookのAppIDを入れます。" />
<!–OGP設定ここまで–>

赤字のところは各自書き換えて下さい。

画像無し記事用のNO IMAGE画像を用意する

上記のMETAタグでは、画像が無い記事用のアイキャッチ画像として、NO IMAGE用の画像を表示させるように分岐処理をしています。

こんな感じでNO IMAGE画像を用意し、WordPressのテーマのフォルダ内にある「image」フォルダに「noimage.gif」のファイル名でアップロードしておきます。

以上でとりあえず、個別記事のいいね数は正しく表示されるようになりました!
まだ何か足りない部分や間違っている部分があるかもしれません、何かお気づきになられた方はコメント等でお知らせいただければ幸いです。

同じところでつまずかれている方のご参考になりましたら光栄です。

ブログランキングに参加しています♪
にほんブログ村 美容ブログ アンチエイジングへ
にほんブログ村


※記事内に価格が掲載されている場合は、執筆当時の価格となります。
現在の価格はリンク先の販売ページにてご確認ください。


 

関連記事

WordPressのコメントスパムを一掃してくれた神プラグイン!SI CAPTCHA Anti-Spam(コメント画像認証追加)

ここのところ、当ブログへのコメントスパムがすごくて、どうにかならないものかと思っていたのですが、とあ

記事を読む

『アフィリエイト実践講座』で紹介した便利ツール・サイトまとめ

『アフィリエイト実践講座』でご紹介し、付録でまとめた便利ツール・サイトのリンク集です。

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*




あやぴ

通販大好き2児の母です。 中2と小5の2怪獣(♂)と日々戦いながら、お得なことを探しています♪

現在45歳。見た目年齢-10歳を目指して日々アンチエイジングにいそしんでいます。

ほとんど群馬な埼玉県在住。北海道札幌市出身。

2015年4月著書を出版しました。

>> 詳しいプロフィールはこちら。
>> 各種受賞歴(旧ブログへ)

【女子限定】レビューブログ研究ワークショップ主宰。

レビュー・講師・取材依頼等あやぴ宛のご連絡はこちらからメールでお願い致します。



日本アフィリエイト協議会正会員

● 『アフィリエイト実践講座』(あやぴ本)無事に出版されました~!皆さんの声をご紹介します

● 無事に出版されました!『今すぐ使えるかんたんEx アフィリエイト 本気で稼げる! プロ技セレクション』

follow us in feedly 

気に入っていただけましたらこちらのボタンをクリックして当ブログをお気に入りに登録して下さい♪

ブログランキングに参加しています。
にほんブログ村 美容ブログ アンチエイジングへ
にほんブログ村


シースリー(C3)での腕全部脱毛コース全6回終了~。自己処理ほぼナシに!

見た目マイナス10歳のための秘密兵器をゲット!新美顔器ビューテリジェンス newa lift(ニューアリフト)♪

プラセンタ100【無料モニター】プレゼント中ですよ~!

maNara(マナラ)のリキッドBBバーでお手軽カバーメイク

朝専用洗顔料マナラ(maNara)モイストウォッシュゲルをリピート!

毎朝愛用中~!朝専用洗顔料♪


pa133291_s
ドモホルンリンクルの無料お試しセットをついに体験してしまいました!

とうとう禁断のコスメに手を出してしまいました。。。 ドモホルンリンク

pb236173_s
ヒアルロン酸美容液のダイナテラは原液なのにサラサラでべたつかない!

先日、お友達の美容ブロガーさんにお誘いいただいて、ヒアルロン酸美容液の

pb246785_s
スリムビューティーハウスの第28回スリムクイーンコンテストを見てきました!

スリムビューティーハウスが年1回行っているイベント、スリムクイーンコン

pb054727_s
ヤマト運輸とLOFTがコラボしたクロネコグッズがカワイイ!

LOFTネットストアの秘密の屋根裏展示会で、ヤマト運輸のクロネコとLO

pa153693_s
ベルメゾンの冷えとりグッズ「冷えとり日和365」で温活しよう!

ベルメゾンのマンスリークラブに冷え取り商品を扱う冷えとり日和365とい

→もっと見る

PAGE TOP ↑