2015/04/15
あと2週間で動かなくなる!古いFacebook「いいね!ボタン」は早急な対応を!
最近は、Facebookのいいね!ボタンが設置されていないWebサイトのほうが珍しいというほど、あらゆるWebサイトにいいね!ボタンが見かけられるようになりました。
しかし、そのいいね!ボタンを設置したのが2014年5月より以前の場合は、来月の2015年5月から動作しなくなる可能性があるということなので、今回は現在設置しているいいね!ボタンが、来月からも動作するのか調べる方法をご紹介します。
目次
JavaScriptの呼び出し部分をチェック
2015年5月から使用できなくなる例
<script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1&appId=xxxxxxxxxx"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>
古いJavaScriptで呼び出している場合は、上記5行目に“all.js”と書かれています。
このままでは5月以降はいいね!ボタンが使用できなくなってしまいます。
これを以下の様に書き換えます。
今後も使用できる例
<script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&appId=xxxxxxxxxx&version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script>
ご覧のように、5行目の“all.js”が“sdk.js”に変更されています。また、“appId”の後ろに“&version=v2.0”という記述が加わっています。
お使いのいいね!ボタンのJavaScriptの記述が“all.js”の場合は、4月30日までに対応が必要になります。
iframe版のいいね!ボタンも要注意
先ほどまではJavaScriptでいいね!ボタンを呼び出している事例について説明しましたが、iframe版のいいね!ボタンにも対応が必要になるようです。
iframe版はバージョン番号を追記
<iframe src="//www.facebook.com/v2.0/plugins/like.php?href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&width&layout=standard&action=like&show_faces=true&share=true&height=320&appId=xxxxxxxxxx" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:80px;" allowTransparency="true"> </iframe>
iframe版のいいね!ボタンのソースコードに対しては、“/www.facebook.com/”の後ろに
“/v2.0/”というバージョン番号を追記すればOKです。
新いいね!ボタンは2016年4月30日まではサポート
Facebook公式の発表によると、上記の新しい「いいね!ボタン」は、2016年4月30日までは確実にサポートすると記載されています。
詳しくは以下の公式ページをご覧ください。
便利なチェック用ブックマークレット
現在、使われているいいね!ボタンが古いものなのか新しいものなのか、ワンクリックでチェックしてくれるブックマークレットが下のWebサイトで提供されています。
ソースコードを見なくてもチェックすることができ、とても便利です。ぜひ利用してみてください。
まとめ
このようなSNS系のAPIなどを利用していると、一度作成した後は、そのまま放置しているという方も少なく無いと思います。
ですが、今回のように仕様が変更されることが少なくないため、知らない間に動かなくなっていたという事態にならないためにも、普段からFacebookやTwitterなどのリリースに気を配っておくことが必要です。
これまでは、生成されるコードをそのままコピペしていただけという方も、これを機会にもう一度、管理しているWebサイトのAPI関連のチェックをしてみてはいかがでしょうか。
コーディング業務のご依頼、ご相談の詳細についてはこちらから
最後までお読みいただき、ありがとうございました。
よろしければシェアしていただければ幸いです。
次の記事へ | 前の記事へ |
WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。