SNS関連
mixiページを作る 【新規登録方法】
mixiでも「Facebookページ」のようなページが作れるらしい。
ソーシャルページが作成できる「mixiページ」、ネット全体公開も
ということで、早速作成してみます。
まず、「mixiページnavi」というサイトにアクセスします。
「mixiページnavi」サイトの右側にある「ページ作成」ボタンをクリックしてください。
新規登録画面が開きます。
- ページ名
- カテゴリ
- 友人に共有(共有する場合はチェックを入れる)
を入力し、「同意の上、ページを作成する」ボタンを押します。
(法人登録は結構めんどくさいので、ここでは飛ばします。)
確認画面が開きますので、その内容でよければ「作成する」ボタンを押してください。
これで新規登録完了です。
完了画面下にある「作成したmixiページへ」リンクをクリックすると、作成されたmixiページが開きます。
う~ん、超簡単!
mixiチェックの件もあるので、少し警戒してましたが、あっさり作成できました。
あとは画面右側にある、「管理者向けメニュー」の「ページ編集・管理」から基本情報などを登録してください。
■インターネット公開について。
「公開設定」にて「インターネット公開」している場合は、mixiユーザでなくてもそのページを見ることができます。
その際注意点として、
http://page.mixi.jp/public/recent_page_feed.pl?page_id=xxxx
というように「public/」を付けたURLでアクセスするようにしてください。
管理画面からアクセスすると「public/」がつかないから、インターネット公開用のURLが始め分からなかった・・・。どこかに書いてるのかな?
ちなみにpublic抜きのURL
http://page.mixi.jp/recent_page_feed.pl?page_id=xxxx
でもアクセス可能ですが、その場合、mixiにログインする必要があります。
■URL設定について。
「公開設定」にてmixiページのURLを、任意の英数字に変更できるようなのですが、それには50人以上にフォローされる必要があるそうです。
ここまでFacebookに合わせなくてもいいのにな~^^;
つか50人て。Facebookの倍じゃん。
■メニューについて
「フォト」や「ホワイトボード」など、任意に追加できるメニューは、「インターネット公開」されないみたい。facebookは出来るのになぁ・・・
nandani | 2011年08月31日 | コメント(0) | トラックバック(0) | SNS関連
レーティング機能と「いいね!」を連動させる【Facebook】:STEP4
この記事は、『レーティング機能と「いいね!」を連動させる【Facebook】:STEP3』の続きの記事です。
すでにボタンが押されている場合はボタンを押せなくするプログラムを作成。
STEP3の「3-2. 「いいね!」ボタンの設置と、それを監視するスクリプトの追加」で作成したサンプルコードに手を加えます。
サンプルコード(step4.php)
<?php session_start(); $fb_app_id = "App IDをここに入力"; $fb_app_secret = "App Secretをここに入力"; //現在開いているページのURL $fb_my_url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; $fb_my_url_split = explode("?", $fb_my_url); $fb_my_url = $fb_my_url_split[0]; $fb_code = $_GET["code"]; $fb_user_id = $_SESSION["fb_user_id"]; if(empty($fb_code) && empty($fb_user_id)) { $fb_get_userdata = "0"; }elseif(!empty($fb_user_id)){ $fb_get_userdata = "1"; }elseif(!empty($fb_code)){ // Facebook側からトークンを取得 $fb_token_url = "https://graph.facebook.com/oauth/access_token?" ."client_id=".$fb_app_id ."&redirect_uri=".urlencode($fb_my_url) ."&client_secret=".$fb_app_secret ."&code=".$fb_code; $fb_access_token = file_get_contents($fb_token_url); // トークンを使用して、graph APIから名前を取得 $fb_graph_url = "https://graph.facebook.com/me?".$fb_access_token; $fb_user = json_decode(file_get_contents($fb_graph_url)); if(empty($fb_user)){ $fb_get_userdata = "0"; }else{ $fb_get_userdata = "1"; $fb_user_id = $fb_user->id; $_SESSION["fb_user_id"] = $fb_user_id; } } //これまでのレーティングデータを取得する $fb_checked_vote = ""; $fb_count_vote = 0; $fb_like_vote = 0; $fb_checked_flag = 0; if(file_exists("csv/rating.csv")){ $fp = fopen("csv/rating.csv", "r"); while ($data = fgets($fp)) { $data = rtrim($data); $data_split = explode(",", $data); if($data_split[1] == $fb_my_url){ $fb_count_vote++; if($data_split[2] == "1"){ $fb_like_vote++; } if($data_split[0] == $fb_user_id){ if($data_split[2] == "1"){ $fb_checked_vote = "いいね!"; }else{ $fb_checked_vote = "だめだね!"; } } } } fclose($fp); } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>レーティング機能と「いいね!」を連動させる【Facebook】</title> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript"> if (window.attachEvent) { //IE用 window.attachEvent("onload", watchRating); }else{ window.addEventListener("load", watchRating, false); } function watchRating(){ if($("#rating_button") != ""){ timerID = setInterval(function () { if ($('.fb_edge_comment_widget.fb_iframe_widget:visible').length) { ratingSave('1'); clearInterval(timerID); }; }, 200); } } function ratingSave(select_vote){ var php_url = "rating_save.php"; var fb_my_url = "<?php echo $fb_my_url; ?>"; var fb_user_id = "<?php echo $fb_user_id; ?>"; if(select_vote == "1"){ $('#rating_button').html("「いいね!」に投票されました。"); }else if(select_vote == "0"){ $('#rating_button').html("「だめだね!」に投票されました。"); } $.post( php_url, {"select_vote":select_vote, "fb_my_url":fb_my_url, "fb_user_id":fb_user_id}, function(message, status) { if ('error' != status){ message_split = message.split("/"); $('#like_vote_id').html(message_split[0]); $('#count_vote_id').html(message_split[1]); } }, "html" ); } </script> </head> <body> <?php //ユーザ基本データが取得できた場合。 if($fb_get_userdata == "1"): //まだボタンが押されていない場合 if(empty($fb_checked_vote)): ?> <div id="rating_button"> <p>以下のリンクをどちらかクリックしてください。(<b>※いいね!を押すとFacebookに反映されます。</b>)</p> <p><div id="fb-root"></div> <script src="http://connect.facebook.net/ja_JP/all.js#appId=225227424196030&xfbml=1"></script> <fb:like href="<?php echo $fb_my_url; ?>" send="false" layout="button_count" width="100" show_faces="false" font=""></fb:like> <a href="javascript:void(0);" onclick="ratingSave('0')">だめだね!</a></p> </div> <?php //すでにボタンが押されている場合 else: ?> <div> <?php echo $fb_checked_vote; ?>に投票済みです。 </div> <?php endif; ?> <?php //取得できなかった場合。 else: //アプリ許可用のURL $fb_dialog_url = "http://www.facebook.com/dialog/oauth?" ."client_id=".$fb_app_id ."&redirect_uri=".urlencode($fb_my_url); ?> <p>レーティングに参加するにはFacebookのアカウントが必要です。<br /> またFacebook用アプリの「(アプリ名)」を許可する必要があります。</p> <p style="margin:5px 0px;"><a href="http://www.facebook.com/index.php" target="_blank">Facebookアカウントを取得する</a> | <a href="<?php echo $fb_dialog_url; ?>">アプリを許可する</a></p> <?php endif; ?> <p><span id="count_vote_id"><?php echo $fb_count_vote; ?></span>人中、<span id="like_vote_id"><?php echo $fb_like_vote; ?></span>人がいいね!と言っています。</p> </body> </html>
■変更部分
58~64行目:csvデータ取得中にて、FacebookIDとページのURLが一致したものがあれば、どのボタンを押したかを取得する。
133~154行目:ボタンを押したデータがcsvから取得できなければ、ボタンを表示。できればボタンを非表示にし、どのボタンを押したかを表示する。
以上です。
すべて読まれた方はおつかれさまでした^^
長くなってすみません。
■追記補足
今回のサンプルでは、レーティングの数字において、ボタンを押したユーザの合計数も「いいね!」の合計数もこちら側が保持しているcsvデータを元に計算しています。
しかしFacebookをお使いの方はご存知かと思いますが、「いいね!」というのはFacebookにて取り消すことが出来ます。
ということはFacebookが保持している「いいね!」が押された回数と、csvデータから算出した数には誤差が起こりえますが、ここではあえてcsvデータの数字を使うことにしました。
もしFacebookが保持している「いいね!」の数を取得したい場合はFQLでデータ取得し、ボタンを押したユーザの合計数などを計算してください。
FQLでのデータ取得方法はこちらのページをご参照ください。
このサンプルでは、すでにボタンが押されているかどうかを、FacebookIDから判断させるプログラムにしましたが、STEP1にも書いたとおり、他にも色々と手段はあります。
Facebookアプリを許可させるのが煩わしい場合は、メールアドレスなどを入力させるなどの方法でも大丈夫かと思います。
また、csvでデータを管理する方法も、データベースが使えるサーバの場合はそちらで管理するほうが何かと便利かと思います。
csvでも構わないという場合は、データ管理だけにはご注意ください(csvファイルにアクセスできないよう制限をかけておくなど)。
最後にSTEP1~STEP4までに記述したサンプルコードをアップしました。
今更ではありますが「ブログじゃ読みづらい!」って方はこちらからダウンロードしてください。
nandani | 2011年08月27日 | コメント(0) | トラックバック(3) | API関連 | JavaScript関連 | PHP関連 | SNS関連
レーティング機能と「いいね!」を連動させる【Facebook】:STEP3
この記事は、『レーティング機能と「いいね!」を連動させる【Facebook】:STEP2』の続きの記事です。
3. 「いいね!」と「だめだね!」ボタンを設置。
■3-1. 「いいね!」ボタンのコードを取得する
こちらのサイトから「いいね!」ボタンのコードを取得してください。
このとき注意しなくてなならないのは、「XFBML」形式で取得する必要があるということです。「iframe」形式では正常に動作しませんのでご注意ください。
■3-2. 「いいね!」ボタンの設置と、それを監視するスクリプトの追加
STEP2の「2-2. Ajax Requestを用いて上記のプログラム(rating_save.php)を呼び出す」で作成したサンプルコードに手を加えます。
なお、「いいね!」ボタンを監視するスクリプトは、こちらのサイトを参考にさせていただきました。
Facebookのいいねボタンを押した時に自分で用意したjsのメソッドを呼び出す jsdo.it Share JavaScript, HTML5 and CSS
サンプルコード(step3.php)
<?php session_start(); $fb_app_id = "App IDをここに入力"; $fb_app_secret = "App Secretをここに入力"; //現在開いているページのURL $fb_my_url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; $fb_my_url_split = explode("?", $fb_my_url); $fb_my_url = $fb_my_url_split[0]; $fb_code = $_GET["code"]; $fb_user_id = $_SESSION["fb_user_id"]; if(empty($fb_code) && empty($fb_user_id)) { $fb_get_userdata = "0"; }elseif(!empty($fb_user_id)){ $fb_get_userdata = "1"; }elseif(!empty($fb_code)){ // Facebook側からトークンを取得 $fb_token_url = "https://graph.facebook.com/oauth/access_token?" ."client_id=".$fb_app_id ."&redirect_uri=".urlencode($fb_my_url) ."&client_secret=".$fb_app_secret ."&code=".$fb_code; $fb_access_token = file_get_contents($fb_token_url); // トークンを使用して、graph APIから名前を取得 $fb_graph_url = "https://graph.facebook.com/me?".$fb_access_token; $fb_user = json_decode(file_get_contents($fb_graph_url)); if(empty($fb_user)){ $fb_get_userdata = "0"; }else{ $fb_get_userdata = "1"; $fb_user_id = $fb_user->id; $_SESSION["fb_user_id"] = $fb_user_id; } } //これまでのレーティングデータを取得する $fb_count_vote = 0; $fb_like_vote = 0; if(file_exists("csv/rating.csv")){ $fp = fopen("csv/rating.csv", "r"); while ($data = fgets($fp)) { $data = rtrim($data); $data_split = explode(",", $data); if($data_split[1] == $fb_my_url){ $fb_count_vote++; if($data_split[2] == "1"){ $fb_like_vote++; } } } fclose($fp); } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>レーティング機能と「いいね!」を連動させる【Facebook】</title> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript"> if (window.attachEvent) { //IE用 window.attachEvent("onload", watchRating); }else{ window.addEventListener("load", watchRating, false); } function watchRating(){ if($("#rating_button") != ""){ timerID = setInterval(function () { if ($('.fb_edge_comment_widget.fb_iframe_widget:visible').length) { ratingSave('1'); clearInterval(timerID); }; }, 200); } } function ratingSave(select_vote){ var php_url = "rating_save.php"; var fb_my_url = "<?php echo $fb_my_url; ?>"; var fb_user_id = "<?php echo $fb_user_id; ?>"; if(select_vote == "1"){ $('#rating_button').html("「いいね!」に投票されました。"); }else if(select_vote == "0"){ $('#rating_button').html("「だめだね!」に投票されました。"); } $.post( php_url, {"select_vote":select_vote, "fb_my_url":fb_my_url, "fb_user_id":fb_user_id}, function(message, status) { if ('error' != status){ message_split = message.split("/"); $('#like_vote_id').html(message_split[0]); $('#count_vote_id').html(message_split[1]); } }, "html" ); } </script> </head> <body> <?php //ユーザ基本データが取得できた場合。 if($fb_get_userdata == "1"): ?> <div id="rating_button"> <p>以下のリンクをどちらかクリックしてください。(※いいね!を押すとFacebookに反映されます。)</p> <div id="fb-root"></div> <script src="http://connect.facebook.net/ja_JP/all.js#appId=225227424196030&xfbml=1"></script> <fb:like href="<?php echo $fb_my_url; ?>" send="false" layout="button_count" width="100" show_faces="false" font=""></fb:like> <a href="javascript:void(0);" onclick="ratingSave('0')">だめだね!</a> </div> <?php //取得できなかった場合。 else: //アプリ許可用のURL $fb_dialog_url = "http://www.facebook.com/dialog/oauth?" ."client_id=".$fb_app_id ."&redirect_uri=".urlencode($fb_my_url); ?> <p>レーティングに参加するにはFacebookのアカウントが必要です。<br /> またFacebook用アプリの「(アプリ名)」を許可する必要があります。</p> <p style="margin:5px 0px;"><a href="http://www.facebook.com/index.php" target="_blank">Facebookアカウントを取得する</a> | <a href="<?php echo $fb_dialog_url; ?>">アプリを許可する</a></p> <?php endif; ?> <p><span id="count_vote_id"><?php echo $fb_count_vote; ?></span>人中、<span id="like_vote_id"><?php echo $fb_like_vote; ?></span>人がいいね!と言っています。</p> </body> </html>
■追加部分
72~87行目:いいね!ボタンに変化がないかを監視。ボタンが押されたら、ratingSaveを実行。
127~129行目:3-1で取得した「いいね!」ボタンを貼り付ける。fb:likeタグのhrefには、開いているページのURLが入るようにする。
131行目の「だめだね!」ボタンはSTEP2から変更する必要はありません。
※今度のサンプルコードの実行例はFacebookに反映されるのでご注意ください。
※この段階では、まだ「だめだね!」ボタンが無限に押せてしまいます。
nandani | 2011年08月27日 | コメント(0) | トラックバック(3) | API関連 | JavaScript関連 | PHP関連 | SNS関連
レーティング機能と「いいね!」を連動させる【Facebook】:STEP2
この記事は、『レーティング機能と「いいね!」を連動させる【Facebook】:STEP1』の続きの記事です。
STEP2からjqueryを使用しますので、あらかじめこちらのサイトからダウンロードを行ってください
2. 「いいね!」「だめだね!」ボタンが押されたとき、そのデータをcsv形式で保存するプログラムを作成。
ボタンが押された際、csv形式でデータを保存するプログラムを作成します。
保存するデータは
- ボタンを押したユーザのFacebookID
- ページのURL
- 「いいね!」「だめだね!」のどちらのボタンを押したか
です。
nandani | 2011年08月27日 | コメント(0) | トラックバック(3) | API関連 | JavaScript関連 | PHP関連 | SNS関連
レーティング機能と「いいね!」を連動させる【Facebook】:STEP1
ここで言うレーティング機能とは
「80人中、60人がいいね!と言っています。」
という機能の事を指します。
独自でこのレーティング機能を作る上で、「いいね!」ボタンを連動させるには、
- 「いいね!」に相対するボタン、つまりBADボタンをつける。(ここでは以降BADボタンのことを「だめだね!」ボタンということにします。)
- 「いいね!」と「だめだね!」ボタンを押した回数を、こちら側が保持する。(※1)
- 「いいね!」または「だめだね!」ボタンが押されたら、そのユーザはそのページの両ボタンを押せなくする。
の3つが必要となります。
※1:Facebookには「だめだね!」ボタンに該当する機能が有りませんので、誰が押したか、何回ボタンが押されたかのデータはこちらが保持する必要が有ります。
なお、WordpressやMTでレーティング機能を設置したい場合はDISQUSというシステムもあるので、そちらを利用したほうが早いかもしれません^^;
作成手順としては
- ログインしているユーザのFacebookIDを取得する機能を設置。
Facebookアカウントをもっていないユーザ、またはFacebookIDを取得するアプリを許可していない場合はボタンを表示しないプログラムを作成。 - 「いいね!」「だめだね!」ボタンが押されたとき、そのデータをcsv形式で保存するプログラムを作成。
- 「いいね!」と「だめだね!」ボタンを設置。
- すでにボタンが押されている場合はボタンを押せなくするプログラムを作成。
なお、1.における「FacebookID」というのは、Facebookにログインする際に使用するIDではなく、Facebook登録時に自動的に連番で割り振られる番号のことです。
「FacebookID」をわざわざ取得する必要がある理由は、
『「いいね!」または「だめだね!」ボタンが押されたら、そのユーザはそのページの両ボタンを押せなくする。』
という点を制御するためです。
「いいね!」ボタンはご存知の通り、一度押したらそのページではもう押せなくなります。しかし「だめだね!」はこちらで用意する機能ですので、誰が押しているかを取得する必要が有ります。
もちろんメールアドレスを入力させるとかIPで制限させるなどの手段も有りますが、ここではFacebookIDを元に制限させる仕様として記述していきます。
■必要条件
nandani | 2011年08月27日 | コメント(0) | トラックバック(3) | API関連 | JavaScript関連 | PHP関連 | SNS関連
PHPを用いてFacebookにログインしているユーザの基本情報を取得する方法【Facebook】
メモ。主に解説サイトの紹介。
なんとなく分かりづらいタイトルですが、自分が今Facebookにログインしているとして、とあるサイトにアクセスしたときに、自分の基本データが収集される・・・あれ?何かすごい恐ろしいこと書いているような・・・^^;
まあ何のために取得するかというと、サイト運営者それぞれに理由があると思いますが、信頼できるユーザかどうか(スパムではないかという意味)を調べたり、二重投稿などを防ぐために必要だったりします。
この基本データというのはいわゆる「プロフィール」なので、Facebookにログインしている状態ならば誰でも見れるものではあるのですが、とはいえ勝手に収集されてはかないません。
というわけで、当然ながら勝手に情報を収集できるわけがなく、そのサイトがユーザの基本データを得るには、訪れたユーザに「取得しても別にいいよ」と許可してもらう必要があります。
↓許可画面はこんな感じ
ここで「許可する」ボタンが押されると、そのサイトは許可したユーザの基本データを取得できるようになります。
では、ユーザの基本データを取得するアプリの開発方法を記したサイトのご紹介です。
- Facebookアプリを開発してみよう:OAuth版 (ここがもっともわかりやすかったです。)
- facebookのPHP-SDKを使わずに自力でウォール書き込みまで実装(´Д⊂ヽ | motooLogue (サーバのPHP環境が5.2以下の方はこちら)
- facebookのPHP-SDKで、ウォールに書き込んだり、フレンドリストを取得したり。 | motooLogue(PHP-SDKを用いて取得する場合はこちら。要PHP5.2以上)
※事前に「アプリケーションID」や「アプリの秘訣」を取得するために、facebook DEVELOPERSページの「アプリ」画面にて、これ専用のアプリを新規作成しておいてください。またアプリを作成するにはディベロッパー登録を行う必要があります。未登録の方はこちらのサイトを参考に登録してください。分かりやすく手順を書いてくださっています。
Facebook 開発者登録 - ネットショップサポート[PBsupport 門戸開放塾]
設置時ちょっとはまってしまったこと
設置直後「アプリの許可」画面を開こうとすると以下のようなエラー画面が出てしまいました。
○エラー内容
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri: 指定されたURLは、アプリケーションの設定で許可されていません。
これはアプリ作成時にWebsiteを設定していないためです。
1.facebook DEVELOPERSページの「アプリ」画面を開いてください。
2.データ取得で使用するアプリを選択し、「設定」の「Edit Settings」をクリックしてください。
3.「Website」にデータ取得プログラムを設置しているホームページのURLとドメインを入力してください。
これで正常に「アプリの許可」画面が開くようになります。
nandani | 2011年08月20日 | コメント(0) | トラックバック(5) | API関連 | PHP関連 | SNS関連
FQLで特定のページの「いいね!」ボタンが押された回数などを取得する方法【Facebook】
FQLで特定のページの「いいね!」ボタンが押された回数などを取得する方法です。
PHPを用いるとこんな感じ。
$target_url = "http://www.yahoo.co.jp"; //データを取得したいページのURL $select = 'SELECT like_count, total_count, share_count, click_count FROM link_stat WHERE url="'.$target_url.'"'; $select = urlencode($select); $fb_url = "http://api.facebook.com/method/fql.query?query=".$select; $res = file_get_contents($fb_url); echo $res;
$target_urlの変数にデータを取得したいページのURLを入れてください。
実行結果(XML形式で表示されます。)
■参考サイト
nandani | 2011年08月20日 | コメント(0) | トラックバック(2) | API関連 | PHP関連 | SNS関連
「いいね!」ボタンが押されたとき、スクリプトを実行させる方法【Facebook・Javascript】
メモ。
「いいね!」ボタンが押された瞬間、こちらが用意しているスクリプト(javascript)を実行させたい!
という案件があったため、ググっていると下記のサイトを見つけました。
Facebookのいいねボタンを押した時に自分で用意したjsのメソッドを呼び出す - jsdo.it - Share JavaScript, HTML5 and CSS
注意点として、「いいね!」ボタンのコードは「XFBML」で記述する必要があります。(iframeじゃ多分ダメ。)「いいね!」ボタンのコード取得はこちら
また、jQueryも読み込んでおく必要が有ります。jQueryのダウンロードはこちら
「いいね!」ボタンを設置したページに以下のようなスクリプトを埋め込みます。
■スクリプト(javascript)の例
if (window.attachEvent) { window.attachEvent("onload", initFunc); }else{ window.addEventListener("load", initFunc, false); } function initFunc(){ timerID = setInterval(function () { if ($('.fb_edge_comment_widget.fb_iframe_widget:visible').length) { ~実行させたいプログラムをここに記述~ clearInterval(timerID); }; }, 200); }
01~04行:ページが読み込まれたら「initFunc()」関数を実行します。
07~14行:setIntervalでインターバルタイマーを設定し、 $('.fb_edge_comment_widget.fb_iframe_widget')に変化がないか見張ります。
(いいね!ボタンの状態が変化すると、$('.fb_edge_comment_widget.fb_iframe_widget')の状態も変化するみたいです。)
変化があったら「~実行させたいプログラムをここに記述~」部分に記述されているスクリプトが実行されます。
最後に、clearIntervalでインターバルタイマーをクリアします。
■注意点
参考にさせていただいたサイトにも書いてありますが、上記の方法では押した瞬間にスクリプトを実行させることは可能ですが、再度ユーザが訪れたとき、そのユーザがすでに「いいね!」ボタンを押しているかどうかは、判断できません。
これを判断するにはFQLを使うか(動作未確認)、「いいね!」ボタンを押してくれたユーザのFacebookIDを取得し、データベースや外部ファイルに蓄積しておく、という方法が考えられます。
ユーザのFacebookIDを取得する方法はこちらのページをご参照ください。
※ここで言うFacebookIDというのはログイン時に使用するIDではなく、登録時に連番で割り当てられる番号のことを指します。
nandani | 2011年08月19日 | コメント(0) | トラックバック(0) | API関連 | JavaScript関連 | SNS関連
Like Boxを設置する【facebook】
【2013/06/18修正】 結構仕様が変わっているので一部修正しました。
メモ
Facebookページ(旧ファンページ)を作成すると、Like Box(いいねボックス)なるウィジェットを自分(自社)のブログやサイトに設置できるようになります。
こんなの↓
1.まず、下記のURLにアクセスします。
http://developers.facebook.com/docs/reference/plugins/like-box/
2.Boxを調整し、コードを取得します。
- Facebook Page URL:FacebookページのURL
- Width:Boxの幅
- Height:Boxの高さ
- Show Faces:いいねを押してくれているユーザの写真を下のブロックに表示するかどうか(なぜかShow Facesを外すと、Streamまで表示されなくなるので注意)
- Color Scheme:色(明るいor暗い)
- Stream:ウォールを表示するかどうか
Border Color:外枠の色(例:#FF0000)無くなりました- Show Border:外枠を表示するかどうか
- Header:ヘッド部分の「Find us on Facebook」というブロックを表示するかどうか
上記を調整後、「Get Code」ボタンを押してください。
「Like Boxのプラグインコード:」ウィンドウが開きます。
コードは「HTML5」「XFBML」「IFRAME」「URL」の4パターンありますので、お好きなパターンのコードをサイトに張り付けてください。
なおBOXの最小幅は292pxとなっているので注意してください。くわしくはこちらの記事
nandani | 2011年07月15日 | コメント(0) | トラックバック(0) | API関連 | SNS関連
mixiイイネ!ボタン
mixiチェックの設置方法の7.まではやり方が同じです。
1.イイネ!ボタンを発行する
「登録サービス詳細」になると、新規に追加された「イイネ!ボタンHTMLタグ発行」というフォームが表示されます。
「タグを取得」ボタンを押すと、すぐ下の「タグ」と書かれたテキストフィールドにiframeタグが表示されます。「プロフィール画像表示」にチェックを入れたままだと、かなりボタン領域が大きくなってしまいますので、不要ならばチェックを外しておいてください。
2.タグを改良する
出力されるタグは以下のようになります。
<iframe scrolling="no" frameborder="0" allowTransparency="true" style="overflow:hidden; border:0; width:140px; height:20px" src="http://plugins.mixi.jp/favorite.pl?href=http%3A%2F%2Fwww.nandani.sakura.ne.jp%2F&service_key=識別キー&show_faces=false&width=140"></iframe>
上記のオレンジで記述された部分は、ページのURLが入るようにしなくてはなりません。
※ただし、URLはURLエンコードする必要があります。
wordpressだと以下のようになります。
<iframe scrolling="no" frameborder="0" allowTransparency="true" style="overflow:hidden; border:0; width:140px; height:20px" src="http://plugins.mixi.jp/favorite.pl?href=<?php echo urlencode(get_permalink()); ?>&service_key=識別キー&show_faces=false&width=140"></iframe>
さらに赤で記述されている「識別キー」の部分には、1.の「登録サービス詳細」画面に載っている「識別キー」を入れてください。
結果はこのページの下の方(mixiチェックボタンの左横)にボタンがあるので確かめてみてください。
いやー、なんというか、・・・挙動がまんまですねw
ここまで似てていいんでしょうか^^;
nandani | 2010年12月15日 | コメント(0) | トラックバック(0) | API関連 | JavaScript関連 | SNS関連