nucleusの時間です

facebookページに自作の「ウエルカムタブ」を作ったので、手順をメモしておきます
（手順はfacebookの方でちょこちょこ変更になるので、現時点での方法）

＜目標＞
「いいね！」を押す前と後とで変化のあるページを作る

＜参考サイト＞
・phpを使った手法
「Facebook Lab」
（Facebookページ制作：活用01）イイネボタンを押したユーザーかどうかでコンテンツを切り替える
http://facebook-lab.jp/?p=973

・外部アプリ登録
「ASCII.jp」
iframe対応！初めてのFacebookページの作り方
http://ascii.jp/elem/000/000/593/593097/index-3.html

「OKWave」
facebookアプリが追加できない
http://okwave.jp/qa/q7182262.html

・サーバ関連
「Ｆａｃｅｂｏｏｋでビジネスを加速する方法」
iframeでFacebookページ作成する際に最初にすべきことは？
http://www.facebook.com/note.php?note_id=127551907316385

＜手順＞
1.iframeのサイズを「w=517px,h=797px」とする（Facebook Lab参照）
2.その大きさ内に入る画像を2種類作成する
3.画像とphpを配置したhtml（.php）を作成する（Facebook Labとビジネスを加速する方法参照）
4.サーバにアップロードする
5.外部アプリの登録（ASCII.jp参照）
6.アプリを自分のfacebookページに組み込む（OKWave）
7.動作確認、完了

・・・こう書くと短いですが、まるっと2日間かかってます

＜各項目でのメモ＞

1.「いいね！」の位置と画像を合わせたいので画面キャプチャ

2.今回はテキストなしの画像だけの図案を作りました
「いいね」前

あ！画像がカラーになってる、すみません、人物はグレーです(^^;

「いいね」後

3.phpの組み込み方法は「Facebook Lab」をまるまるコピー
拡張子を.phpにして保存
ここで注意！phpを組み入れてなくてもファイル拡張子は.phpにしておいた方がいいです
最初、「Method Not Allowed」と出て焦りましたが、「Ｆａｃｅｂｏｏｋでビジネスを加速する方法」にレンタルサーバと拡張子関連の事が書かれてて無事に表示できました

4.アプロードのファイルパスはアプリ登録で使うのでメモ

5.外部アプリの登録は画面が変わっていたのでかなり悩みつつ登録
開発者ページ
http://www.facebook.com/developers/
これが登録した内容（多分、最低必要限でしょう）

（facebook上のアプリ、ページタブの2項目だけ）

6.アプリを自分のページに組み込む「add to My Page」項目が見当たらず、頭真っ白
結局、「OKWave」でURLを直打ちして無事登録
http://www.facebook.com/add.php?api_key=[APP-ID]&pages=1
（[APP-ID]は自分が作ったアプリのID）

7.こんな感じに表示できました
「変更前」


「変更後-いいね前」

クリック前は「いいね！」に注目するようにモノクロにしました

「変更後-いいね後」

クリック後は「ありがとう」の意味を込めてカラーでニッコリ笑顔にしてみました
テキストはありません、あまり文章を書き込んでも読むのが大変そうな気がして(^^;

実際のfacebookページ
「マンガと似顔絵スタンプの地蔵堂」

facebookで、「個人ページ」と「facebookページ」とでどうしてできる事が違っているのだろう？と不思議でした

たぶん
個人ページは「個人単位で非公開」
facebookページは「フォーラム単位で公開」の差なんですね

個人ページはあくまでも個人で、応援できるのは「個人：個人」
facebookページは個人ではない（ある意味、団体）ので、個人には応援できないし、非公開で守られている情報を公開を基本としているfacebookページの領域にもってこれない

・・・的な感じなのでしょうか？
facebookの概念って面白いですねぇ

言われてみれば、mixiだってフォーラムあるけど、フォーラム自体から個人にアクセスってないですもんね
フォーラムの管理人さんならアクセスあるけど、フォーラム名じゃないですもんネ

nucleusネタではありませんが、自分メモでfacebookに関する疑問をかき出しておきます
いんやぁ〜、よくわっかんないよぉ(^^;
まるで細かいパーミッション設定みたいな感じです、けっこうアカウント種類によって「できる、できない」があるみたいです

「fbp（facebookページ）」

• ウォールの近況にURLを書くと自動的にリンクに変わる
• fbpアカウントで友人のページを見ると「いいね」「コメント」ができない
  友達にもなれない
  できるのは「シェア」だけ
  
• fbpアカウントでボタン設置してあるfacebookではないページで「いいね」しようとすると、個人p画像が表示されて、入れ替えを要求される
  
  その場合、クリックで入れ替えされてボタンが表示される
  

「個人ページ（個人p）」

• 個人pでのウォールでは「リンク」がない（TLにした場合）
  そのかわり勝手に変換してくれる
• 個人pでは「シェア」ではなく「投稿」になる
  fbpでは「シェア」になる

「その他」

• 自分のfbpで個人アカウントでコメントしたり、fbpアカウントでコメントしたりすると、hootsweetの場合は、アイコンの表示が変わる
  これは個人アカウント
  
  個人pのアイコンですよね
  
  これはfbpアカウント
  
  「誰なんじゃい？」アイコンになってます、面白いですね〜
• 画像のタグとは、写真の中に人物が写っている場合に、そこを選択して人名を入れる事
  「自然」とか「スポーツ」とかのタグとは違う

・・・いんやぁ、まさに「目からウロコ」と言いますか・・ちょっと素人がやるにはfacebookはとっつきにくいですねぇ（汗）
友達が「やろうと思ってるんだけど教えて」と言われたら説明できるか？考えちゃいますぅ

facebookネタです

facebookで項目を増やすには「アプリケーションを組み込んで作成する必要がある」と理解したので、さっそく使ってみました

アプリは「static HTML」です
他にも「Static HTML: iframe tabs」なんてのがいろいろあるみたいで、私は「たまたま開いたサイト」で紹介していたので最初のを使ってみたのでした(^^;

使い勝手は省略しますが、HTML作成ソフトと同じでそんなに悪くありません
一番悩んだのが、「CSS」の組み込みです
もともと「iframeってcss組み込むのにヘッダに入れないとダメなんじゃなかったっけ？」としか理解してないので、「はて？どうやるんだ？」と頭、真っ白(^^;

結局、「ええ〜い、ソフトが勝手に判断してくれるだろう！」とソースを丸ごとコピペしました
ちゃんとcssもアップロード・・・無事に認識してくれました

ちなみに、最初はcssファイルだけ作って中身を書き込まずにアップしたので、フォントが調整されておらず、「やっぱりダメなのか？」と真っ青になりました（笑）
ま、よくある初歩的なミスですよね

他の記事を読んでいると、自分で作ったページもアプリで認証させればちゃんと表示できるみたいです
多少、慣れてきたので今度はnucleusでトライしてみたいな

facebookページのプロフィール画像の変更方法がわかりませんでした
いろいろ調べても【サムネイルを編集】項目が自分のページには出てこないんです(^^;
（参考サイト：フェイスブックページのサムネイルを正しく表示させる方法）

で、やっとたどり着く事ができました、【サムネイルを編集】項目に！

1. プロフィール画像にカーソルを合わせると、上部に「写真を変更」って項目が浮き出るので、そこをクリック！
   
2. すると「画像をアップする？それとも撮り直す？」って画面になるので
   
3. アップしてあるプロフィール画像の下を見ると【サムネイルを編集】項目が出てくる・・って寸法です

あとは、参考サイトにのっとって切り取り位置（表示位置）を修正すればOKです(^^)

今回は、切り抜き位置をデフォルトで使おうと思って、こんな感じでベースのデザインしておきました
なので、切り抜きは不要なんですけど、やはり方法は知ってて無駄じゃないですもんネ！
（青線の正方形にアイコンになる画像を配置）

やっとこさタブをf_bページに追加できました！

けっきょく、利用したのは、外部アプリの「OneClick」と「Static HTML」

OneClickではウエルカムページを作成
これは超簡単なページで、テンプレートに事前に入力された項目をあてはめて出力したもの
「間に合わせでいも、カッコイイのが欲しい！」って即席人間にはうってつけ

Static HTMLでは、作品紹介（業務サイトへのリンク）を作成
まだ「とりあえず作った」ので単純なHTMLでしか組んでいません(^^;
データ（jpeg/png/css・・）などアップロードして使えるので良さそうです
今回は画像アップロードしか利用していませんが、近いうちにcssでフォントサイズやカラーなど編集してみたいです

そして、ココがミソ！なんですが、このままだとタブの名前がデフォルトのままです（アプリ名のまま）
これを自分用に書き換えるには、以下の処置が必要（Static HTMLもOneClickも同様）

start
↓
Facebookページを編集
↓
アプリ
↓
Static HTML
↓
タブ編集

ここに気がつかないで丸一日悩んでました(^^;はははは

今後しばらくはfacebookについてのメモが多くなりそうです
まだまだよく分からないんだもん・・どうやら単純なhtmlとかblogとかとは基本的に違うみたいです

「nucleusを外部アプリで読み込んでfbページで連携させた。スキンは別途用意する必要がある」という記事を読んだ事があるのだけれど、やっとその意味が理解できてきました

どうやらfb自体はペラペラなスペースで、htmlのようにユーザーが勝手にタグ入力したりページを作成したりできないようで、ページを増やしたい場合は「外部アプリと呼ばれるアプリケーションをインストールする必要がある」らしい・・で、nucleusを使っている人はfbページのサイズにあわせたスキンを作ってblog展開させて、それを外部アプリで利用する・・みたいな感じですね

ぬぬぬ、理解できたもののプログラマーでもない私には厳しいなぁ(^^;
せっかくだからコンテンツを連携させたかったのに〜

やっとこせ、facebookページができたので、今度は「facebookで何をどうしたいんだ？」と考えました

1. nucleus（業務サイト）とfacebookページの連携させたい
2. 業務サイトに、ボタンとバナー設置をしたい
3. facebookページに「ようこそ」ページを作りたい
4. facebookページに「いいね！」を載せたい
5. facebookページでノートを使いたい
6. facebookページにページを増やす方法は？
7. ウォールの使い方を覚えたい
8. 個人ページとfacebookページの違う点は？（「いいね！」や「ウォール」の使用方法の違い）
9. facebookページに、自作マンガ、作品サンプル、コミスタのメモなどを載せたい
10. facebookページでプロフィール画像の切り抜く位置修正ができるのか？

これを1つづつ突破していかなくちゃ！

年末からのお題目だった「facebookに個人ページとfacebookページを作ろう」をなんとかクリアしました
・・・もうお脳はボロボロ（笑）
いんやぁ、概念が理解できないし、欲しいボタンが何処にあるんだか？わからないし、タイムラインの表示にしちゃってからはゴチャゴチャです(^^;

とりあえず作成できた個人ページ
http://www.facebook.com/seiko.hiroki

根性で作成したfacebookページ
http://www.facebook.com/zizodocom

で、このfacebookページを登録する時が一番悩みました
それは・・「カテゴリをどれにするか？」なんです
似顔絵とかマンガってナニになるんでしょうね？facebookが用意した物の中でピンとくるのが無くて、他の人のを見物につぐ見物

• アート/芸能・エンタメ/ナイトライフ
• アート/人文科学
• プロダクト/サービス
• ローカルビジネス
• ウエブサイト

「アートでもないし、プロダクトでもないし、ローカルビジネスでもないし・・・文具じゃなし」とさんざん悩んで「ウエブサイト」にしました
現に、色紙に似顔絵を描くでもなし、データを納品したりweb用のを作ったりしてるんですもん

あとは、イメージバナーを作成してアップロード
コンテンツはこれから書き込んで行く予定です
と、言うのか、「どうやってページを増やしたらいいのか？わからない」のが実情(^^;
（はい、すみません、調べて頑張ります）

ここまできて、自分のnucleusに戻って「いいね！」ボタンを見て驚きました！！
自分のプロフィールアイコンになってるんですもん(@o@)

ナニがどうなっちゃってんだか？よくわかりませんが、safariで見たら普通のボタンだし・・・もしかして火狐の塩梅なのかも知れませんな

SNSのmixiとGreeのアカウントを持ってます
でも、あまり直に書き込んでいません（汗）

このBlog（nucleus）から記事を飛ばしたり、twitterと連携させたりして利用していました

でも、twitterって「即時」なんですよね
その「即時」を日に1回ログインするか？しないか？のSNSに連携させておくのがいいのか？
・・・けっこう悩みました

最初は「まあ、いいか」と思ってたんですが、頻繁にログインしない友人にとってみれば、ダッシュで走り去った私の余韻に声をかけてもらっているようなもので、「これって迷惑じゃない？悪い事してるなぁ」と考えるようになりました

こちらとしても「済んでしまった数時間前の事」にコメントもらっても「え〜と、ナニについてつぶやいたんだっけ？」とトンチンカンなお返事して恥ずかしい経験が何度もあります

と言う事で、この際だからtwitterと切り離して、BlogのRSSでSNSとの連携を強めて、読めるコンテンツを作る事を目指そうと思ってます

さて・・・複数あるBlog（元は1つのnucleus）のRSSをどうやって1つにかき出させようかな？
具体的には、下の3つ

• nucleusの時間です（nucleusネタ）
• へんぺいそく日記（趣味＆自爆ネタ）
• 浜すけダイアリー（インコネタ）

さてさてさて・・・悩むのぉ(^^;