2010年11月2日火曜日

faceBookのファンページでFBMLを使ってみる その1

最近やたらと世間でfaceBookがプッシュされています。
ローソン、TBS、著名な個人では勝間和代さんもファンページをはじめましたね。

私は別に有名人ではないので、ファンページを作る必要性は感じません。
でも最近はandroidアプリの作成もしていますし、今後はiphoneアプリやWEBサービス、facebookのアプリも作成したいと思っているので、とりあえずこの勢いでファンページも作ってみようかと思っています。

しかし、このファンページの作り方。やたらとっつきにくいのです。本当に日本でfaceBookははやるのかと疑うくらい使いにくい。
職業エンジニアの私がそう思うのだから、普通のユーザーではなおさらでしょう。

そんなわけで作成メモを残しながら、ファンページを作成していこうと思います。
ただし、ここではファンページの作成とFBMLの導入はすでに完了済みであるとします。

でわでわ、一番簡単そうなFBMLというアプリケーションを使ってファンページをいじることにしましょう。

FBMLの使い方は
http://developers.facebook.com/docs/reference/fbml/
を参考にします。、英語は苦手なんですがこれくらいならなんとかなるでしょう。

まずは、訪問してくれた友人を出迎えるメッセージを作成してみましょうか。

作成するメッセージは、

WELCOM TO MY PAGE!! おお、我が心の友よ。

というメッセージにでもしましょうか。

画像下のファンページ編集を選択し、左メニューのアプリケーションを選択します。
FBMLがインストールされていれば、右側にFBMLが表示されているはずなのでそれを選択します。

次に、FBMLの中にHTMLを記述します。




上記のように記述したら、「変更を保存」ボタンを押下します。

さて、変更後のページを確認してみましょうか。




おお、見事にHTMLタグが効いてますね。
しかし、これではfaceBookっぽくないですね。せっかくなんだからもっとfaceBookっぽくしたいですね。なので、facebookで用意されているAPIを利用してみます。

色々見てみると、fb:headerというtagを発見。
http://developers.facebook.com/docs/reference/fbml/header

この部分はヘッダーなので、上記のタグが良さそうですね。では、さっそく使ってみましょう。。

属性のdecorationはヘッダーの下に下線を加えるみたいですね。これも追加しましょうか。
以下のように記述します。






記述を終えたら、「変更を保存」ボタンを押下します。
そして、変更後のページを見てみましょうか。



おおおお、faceBookっぽくなりましたねえ。このダサさがなんともfacebookっぽいw。

ってなわけで疲れたので今回はここまで。次回はもっと色々といじる予定です。
このペースだと果たしていつ完成するのでしょうかw。
とりあえず、お疲れ様でした~~。

この記事がお役にたちましたらシェアをお願いします

このエントリーをはてなブックマークに追加

0 件のコメント:

コメントを投稿

Related Posts Plugin for WordPress, Blogger...