[メモ]FacebookファンページのFBMLで使えるタグ11選

※注意:2011/03/11以降新規追加はできないとのことです。
フェイスブック、「FBML」を廃止へ: インターネット広告のひみつ - ブログ

Facebookのファンページと言えばFBMLだったりしますよね。
今回は、FBMLで使用できるタグについて何点か記述方法をメモ。
※なおFBMLの導入はこちらを⇒[メモ]Facebookファンページめんどいとこ FacebookファンページのFBMLで使えるタグ11選

【1】「いいね」しないと見られないコンテンツ作り
以前も紹介しましたが、念のため。
<fb:visible-to-connection>
「いいね」済みファンな人達に向けたコンテンツ
<fb:else>
「いいね」してくれない人向けコンテンツ
</fb:else>
</fb:visible-to-connection>
※訂正:2011/02/08
CSSのポジションで指定しないと意図した通りになりません。

【2】友達にだけ表示
似たような感じですが、友達にだけ表示
<fb:visible-to-friends>友達の場合に表示するコンテンツ</fb:visible-to-friends>

【3】FBML内にタブを表示
fb_tab.jpg

■基本
<fb:tabs>
<fb:tab-item href="URL1" title="タブタイトル1" />
<fb:tab-item href="URL2" title="タブタイトル2" />
</fb:tabs>

■右寄せ
<fb:tabs>
<fb:tab-item href="URL1" title="タブタイトル1" align="right" />
<fb:tab-item href="URL2" title="タブタイトル2" align="right" />
</fb:tabs>

使う・・・かな?

【4】フォームを作る
fb_form.jpg
<fb:editor action="phpなどのプログラム" labelwidth="100">
<fb:editor-text label="件名" name="title" value=""/>
<fb:editor-text label="お名前" name="uname" value=""/>
<fb:editor-textarea label="コメント" name="comment"/>
<fb:editor-buttonset>
<fb:editor-button value="送信する"/>
<fb:editor-cancel />
</fb:editor-buttonset>
</fb:editor>

使う頻度高そうです。

【5】YouTubeの動画を表示
<fb:swf
swfbgcolor="000000"
imgstyle="border-width:3px; border-color:white;"
swfsrc='http://www.youtube.com/v/*******'
imgsrc='http://img.youtube.com/vi/*******/2.jpg'
width='340'
height='270'
/>

■備考
swfsrcは、埋め込みコードで表示される以下をコピペします。
<iframe title="YouTube video player" type="text/html" width="1280" height="750" src="http://www.youtube.com/embed/*******" frameborder="0" allowFullScreen></iframe>
いいですね。

【6】YouTubeチャンネルを表示させたい場合
チャンネルを全部見せたいあなたにはこれ。
<fb:swf
swfbgcolor="000000"
imgstyle="border-width:3px; border-color:white;"
swfsrc='http://www.youtube.com/cp/**********
imgsrc='クリック前の画像パス' />

■備考
swfsrcは下記の手順でコードを取得
http://www.youtube.com/custom_player
コードの作成とプレーヤーの保存
<param name="movie" value="http://www.youtube.com/**********"></param><embed src="http://www.youtube.com/**********=" type="application/x-shockwave-flash"> imgsrcはhttp://からのフルパス

【7】ンダムで表示するコンテンツ
ランダムでコンテツを表示させます。
<fb:random>
<fb:random-option weight="2">A:Bの倍表示</fb:random-option>
<fb:random-option weight="1">B: Aの半分表示</fb:random-option>
</fb:random>

■備考
fb:random-optionのwieightで重み付け調整。

これ使えそうです。

【8】ログインしているユーザー名を表示する
小ネタ。
<fb:userlink uid="loggedinuser" />

【9】ユーザー画像を表示
<fb:profile-pic uid="ユーザーID" linked="true" />
■備考
uidはプロフィール画像のリンク先で確認できます。
(参考) http://www.youtube.com/watch?v=PESTfH1TonA

【10】シェアボタン
<fb:share-button>
<meta name="title" content="タイトル"/>
<meta name="description" content="ページの概要" />
<link rel="target_url" href="シェアするURL"/>
</fb:share-button>
基本ですかね。

【11】ユーザーエージェントで表示を分ける
マニアックです。
<fb:user-agent includes="ie" excludes="ie 6">
IEを含む。IE6は含まない
</fb:user-agent>

skuare.netのファンページはこちら

sponsors

「[メモ]FacebookファンページのFBMLで使えるタグ11選」をシェアする

記事作成:
記事URL:

TOP > > > [メモ]FacebookファンページのFBMLで使えるタグ11選