タグ:Facebook

Facebook Developersでアプリを登録する。

以前使用していた時から結構インターフェースが変わったので、改めて登録方法。

https://developers.facebook.com/

にアクセスします。

WS001094

上のメニューから「My Apps」を選択します。

 

WS001095

登録済みのアプリ一覧が表示されます。

右上の「Add a New App」ボタンをクリックします。

 

WS001096

どのアプリを作るか選択します。
今回はPage Plugin用のアプリを作りたいので、ウェブサイトを選択します。

 

WS001097

アプリ名を入力します。

アプリ名を入力すると、下図のようになります。

WS001098

Create New Facebook App IDボタンをクリックします。

 

WS001099

カテゴリを選択して、右下の「Create App ID」ボタンをクリックします。

 

下図のような画面になります。

WS001108

少し下に行くと、Tell us about your websiteというフィールドがあります。

WS001100

Site URL と Mobile Site URLを入力し、Nextボタンをクリックします。

 

下図のような画面になります。

WS001101

さらに下へスクロールするとフィニッシュです。

 

さて、このままでは、まだアプリとしては非公開状態です。

Page Pluginのコード取得時に、このアプリを選択しても

This app is in Development Mode and not available publicly.
公開モード can be enabled in the App Dashboard.

というエラーメッセージが表示されてしまいます。

公開状態にするには、まずメニューからMy Appsを選択し、登録されているアプリ一覧を表示します。

WS001109

新規登録したアプリを選択します。

WS001110

左メニューからSettingsを選択します。

WS001111

「Basic」タブブロックの右下にある「Contact Email」にメールアドレスを入力し、「Save Changes」ボタンをクリックします。

 

左メニューの「Status & Review」を選択します。

WS001112

上図の赤枠部分をクリックし、Yesにします。

クリックすると、下図のようにメッセージが表示されるので、承認をクリックします。

WS001113

以上で、公開状態となり、使用できるようになります。

総合管理者 | 2015年04月30日 | コメント(0) | トラックバック(0) | API関連 | アプリ関連

RSS Graffiti本日終了 dlvr.itへ乗り換え

WordPressやMovable Type、なんでもいいのですがRSSが出力できれば、それを元にFacebookへ投稿できる「RSS Graffiti」が本日、2015年4月30日をもって終了するそうです。

ということで、急いで乗り換え。

色々候補は有ったのですが、最終的に「dlvr.it」を使うことにしました。

https://dlvr.it/

まずは、アカウントを作成します。

WS001093

右にある「Sign up」ボタンをクリックして、アカウントを作成してください。
FacebookやTwitterアカウントを持っている場合は、それでもログイン可能です。

アカウント作成、またはログインが成功すると、下図の画面になります。
How would you like to start sharing content?

WS001077

左の「Start Feeding」ボタンをクリックします。

 

WS001078

左の「Source」にフィードのURLを入力します。
Your blog or other website URLと書いてますがフィードのURLです。
例:http://www.nandani.sakura.ne.jp/feed

ラジオボタンでは、次からの投稿を反映させたい場合は、「Wait until a new item is posted.」を選択してください。

URLの入力が成功すると、自動的に正常なURLかどうかを判断して、右の「Choose a Destination」のボタンを選択できるようになります。

今回はFacebookへの投稿なので、Facebookボタンをクリックします。

Facebookログイン画面がポップアップウィンドウで開きますので、Facebookへログインしてください。(すでにFacebookへログインしている場合は、次へ)

一番最初の登録の場合、dlvr.itからFacebookへのアクセスを許可してよいかという画面が開きますが、許可していってください。

最終的に下図の画面になります。

WS001079

プルダウンで、どのタイムラインに投稿するかを選択してください。
Facebookページの権限を持っている場合は、それも選択可能です。
プルダウンを選択したら「Continue」ボタンをクリックしてください。

 

最後の画面になります。

WS001080

右下の「Done」を選択してください。

登録が成功すると、下図のメッセージが開きます。

WS001081

以上が最初の登録です。

 

2回目以降の新規登録

2回目以降の新規登録は左上の「+ Add Route」ボタンから登録します。

WS001082

微妙にインターフェースが変わりますが、やることはほぼ同じです。

 

WS001083

左の「Source」の「+ Add」ボタンをクリックします。

 

WS001084

フィードボタンをクリックします。

 

WS001085

Feed URLを入力し、どのタイミングからタイムラインに投稿するかをプルダウンで選択します。

「save source」ボタンをクリックします。

 

WS001086

続いて右の「Destinations」の「+Add」ボタンをクリックします。

 

WS001087

「Facebook」ボタンをクリックします。

 

WS001088

「Connect to Facebook」ボタンをクリックします。

 

WS001089

※ログイン中の場合は、自動的にログインしているFacebookのアカウントで上記の画面となります。

プルダウンで投稿先タイムラインを選択し、「Continue」ボタンをクリックします。

 

最後に「Save」します。

 

同じタイムラインに複数のフィードを登録する場合

同じタイムラインに複数フィードを登録する場合は、すでに登録済みの「Source」の「+Add」から片側のみを登録します。

WS001090

複数登録されるとこんな感じになります。

 

WS001092

総合管理者 | 2015年04月30日 | コメント(0) | トラックバック(0) | API関連 | SNS関連

LIKEBOXの最小幅は292px

サイドバーのエリアにLIKEBOXをつけてほしいとの依頼を受けたので、いつものところでコードを発行し、HTML5のコードを張り付けたところ、オーバーフローした・・・

調べてみると、どうやら幅の最小値は292pxらしい。

Facebook「Like Box」の最小幅 | lazynotes

どうしようかな~と思い、試しにiframeのコードを張り付けたらうまく行った(ちなみに設定した幅のサイズは232px)。

twitterの新しいウィジェットもそうだけど、最小値を決められると困るな~

nandani | 2013年06月17日 | コメント(0) | トラックバック(1) | WEB関連全般

Facebookページにある"すべての"アルバムの写真をPHPで取得する方法

前回は特定のアルバムのみの写真を取得する方法を記述しました。

今度はFacebookページにあるすべてのアルバムの写真を取得する方法です。

必要なのはPHP5.2以上が動作するサーバ環境(json_decodeがいるので)と、そのFacebookページのID情報です。

ためしにFacebook Japanの公式Facebookページにあるすべてのアルバムの写真情報を取得し、写真を一覧表示します。

まずFacebookページIDですが、前回同様「Facebookスポット」アルバムページのURLをご覧ください。

http://www.facebook.com/media/set/?set=a.428510844023.214836.365989369023&type=3

今度は最後の「.」から「&type=3」までにある数字を取得してください。

つまり「365989369023」です。

これがFacebookIDです。

これを以下のサンプルプログラムの中にある「$fbpage_id」変数に代入します。


$fbpage_id = '365989369023';	//FacebookページID
$thumb_size_set = 3;    //サムネイルのサイズ

//アルバム情報を取得する
$albums_url = "http://graph.facebook.com/".$fbpage_id."/albums/";
$albums_res = file_get_contents($albums_url);
$albums_array = json_decode($albums_res, TRUE);

if(!empty($albums_array["data"])){
	foreach($albums_array["data"] as $albums_values){
		
		//アルバム内の写真情報を取得する
		$album_id = $albums_values["id"];
		$photos_url = "http://graph.facebook.com/".$album_id."/photos/";
		$photos_res = file_get_contents($photos_url);
		$photos_array = json_decode($photos_res, TRUE);
		
		if(!empty($photos_array["data"])){
			
			$albums_link = $albums_values["link"];
			$albums_name = $albums_values["name"];
			echo '<h2><a href="'.$albums_link.'" target="_blank">'.$albums_name.'</a></h2>'."\r\n";
			
			foreach($photos_array["data"] as $photos_values){
				
				$thumb_size_count = count($photos_values["images"]);
				for($i=$thumb_size_set; $i > 0; $i--){
					if($thumb_size_count > $i){
						$thumb_size = $thumb_size_count - $i;
						break;
					}
				}
				
				$photo_name = $photos_values["name"];
				$photo_path = $photos_values["link"];
				$photo_thumb_path = $photos_values["images"][$thumb_size]["source"];
				$photo_thumb_width = $photos_values["images"][$thumb_size]["width"];
				$photo_thumb_height = $photos_values["images"][$thumb_size]["height"];
				
				echo '<p><a href="'.$photo_path.'" target="_blank"><img src="'.$photo_thumb_path.'" width="'.$photo_thumb_width.'" height="'.$photo_thumb_height.'" alt="'.$photo_name.'" /></a></p>'."\r\n";
			}
		}
	}
}

サンプルを実行する

なお、結構表示まで時間がかかります。

nandani | 2011年12月14日 | コメント(5) | トラックバック(1) | API関連 | PHP関連

Facebookページにある"特定の"アルバムの写真をPHPで取得する方法

Facebookページを見ると、左のメニューに「写真」という項目があるページをよく見かけます。

その名の通り、アルバムごとに写真をアップし、公開することができるわけですが、このアルバムの写真情報をPHPで取得することができます。

必要なのはPHP5.2以上が動作するサーバ環境(json_decodeがいるので)と、そのアルバムのID情報です。

ためしにFacebook Japanの公式Facebookページにある、アルバム「Facebookスポット」の写真情報を取得し、写真を一覧表示します。

まずアルバムIDですが、「Facebookスポット」アルバムページのURLをご覧ください。

http://www.facebook.com/media/set/?set=a.428510844023.214836.365989369023&type=3

というURLになっています。

いくつか数字の羅列が並んでいますが、必要なのは「a.」から次の「.」までの数字。

つまり「428510844023」です。

これを以下のサンプルプログラムの中にある「$album_id」変数に代入します。


$album_id = '428510844023';	//アルバムID
$thumb_size_set = 3;	//サムネイルのサイズ
$limit=0;	//取得したい最大枚数(0とするとデフォルト設定の25枚)

$url = "http://graph.facebook.com/".$album_id."/photos/?limit=".$limit;
$res = file_get_contents($url);
$data_array = json_decode($res, TRUE);

if(!empty($data_array["data"])){
	foreach($data_array["data"] as $values){

		$thumb_size_count = count($values["images"]);
		for($i=$thumb_size_set; $i > 0; $i--){
			if($thumb_size_count > $i){
				$thumb_size = $thumb_size_count - $i;
				break;
			}
		}

		$photo_name = $values["name"];
		$photo_link = $values["link"];
		$photo_thumb_path = $values["images"][$thumb_size]["source"];
		$photo_thumb_width = $values["images"][$thumb_size]["width"];
		$photo_thumb_height = $values["images"][$thumb_size]["height"];

		echo '<p><a href="'.$photo_link.'"><img src="'.$photo_thumb_path.'" width="'.$photo_thumb_width.'" height="'.$photo_thumb_height.'" alt="'.$photo_name.'" /></a></p>';
	}
}

サンプルを実行する

もちろん閲覧者がFacebookにログインする必要はありません。

非常に簡単ですね。

※枚数が多くなると重くなるので、キャッシュを取るなどの対策をすることをお勧めします。

 

参考にさせていただいたサイト

facebookのアルバム写真をJSONで取得して表示する with jQuery | Benjamin

nandani | 2011年12月14日 | コメント(4) | トラックバック(1) | API関連 | PHP関連

OGP情報のキャッシュ削除

メモ。

OGPを設定したあと、「いいね!」ボタンを押したりして確認すると、なぜか設定が反映されていない場合があります。

これはキャッシュのせいなので、ほっといたら反映されるようになりますが、できればすぐに確認したい!

そんな時は、Debugger(旧URLリンター)なるツールを使って、OGPの設定を確認するついでにキャッシュを消しましょう。

 

■参考にさせていただいたサイト

nandani | 2011年09月06日 | コメント(0) | トラックバック(0) | API関連 | SNS関連

Copyright(c) 2010 - 2017 ダリの雑記