2009年11月19日 星期四

用FBML工具來製作你的Facebook粉絲歡迎頁面---多媒體篇


2010.8.21更新,
未來Facebook已經不再支援FBML語法,所以此篇教學內容已沒有作用,未來是以iFrame語法為支援對象,等綸太郎研究過後再跟大家分享。

在Facebook上架設粉絲專頁的朋友越來越多了,但如何讓粉絲停留在你的專頁上,閱讀更多的資訊,我想是身為每一個使用者應該關心的事,發現很多人只是把它當作轉貼自己網誌RSS或是twitter和plurk匯入的另一個介面,覺得有點可惜,發現還是有很多利用的空間。

本篇要介紹的就是利用FBML來編寫你的粉絲專頁,加入多媒體的介面,讓你的頁面更活潑與多元媒體化,其實Facebook系列寫下來,我想真正會利用的人並不多,說真格的,高手們可能已經在開發Facebook小遊戲或是程式了,對我而言可以利用這個工具來編寫頁面,就是目前努力的方向,也當成自己的學習紀錄本跟大家分享,或許有的人也想自己設計一個圖文並茂的粉絲頁。

放入多媒體,包含影片、Flash檔案及照片的幻燈片(Slideshows)或音樂MP3:

在Facebook嵌入影片或是swf檔,fmbl的tag稱為Fb:swf

【放入Youtube影片】

語法為
<fb:swf swfbgcolor="000000" imgstyle="border-width:3px; border-color:white;" swfsrc='http://www.youtube.com/v/xxxxxxxxxx' imgsrc='http://img.youtube.com/vi/xxxxxxxxxx/2.jpg' width='340' height='270' />

其中
http://www.youtube.com/v/xxxxxxxxxx
裡面的xxxxxxxxxx就是Youtube影片的ID,譬如這一部影片
http://www.youtube.com/watch?v=SkUXmodrV58
所以你的網址就是
swfsrc='http://www.youtube.com/v/SkUXmodrV58'
而imgsrc='http://img.youtube.com/vi/xxxxxxxxxx/2.jpg是顯示的圖片
而width='340' height='270' 也是可以修改的,就看自己的設定。

因為Facebook他會捉其中的影片當作首頁圖片顯示,而不是直接顯示youtube的影片介面,需要按下圖片後才會顯示介面,這是不同於其他Youtube影片在其他平台顯示的方式,所以這個img你也可以放入自己自己喜歡的圖片來用,寬度width及高度height要配合就是了。

呈現方式,



【放入Picasa幻燈片】

怎樣知道你的幻燈片網址,進入picasa後台介面,在右手邊有個選項,按下"內嵌投影播放"


選擇大小,找到語法,



語法類似以下這樣,
<embed type="application/x-shockwave-flash" src="http://picasaweb.google.com/s/c/bin/slideshow.swf" width="400" height="267" flashvars="host=picasaweb.google.com&hl=zh_TW&feat=flashalbum&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2Fallen%2Falbumid%2F1231213235%3Falt%3Drss%26kind%3Dphoto%26hl%3Dzh_TW" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

我們找到host=後面的紅色語法把它加到fbml的語法裡即可,

<h1> 按下圖片開始播放!</h1><br/><fb:swfswfbgcolor="000000"imgstyle="border-width:3px; border-color:white;"swfsrc='http://picasaweb.google.com/s/c/bin/slideshow.swf?host=picasaweb.google.com&hl=zh_TW&feat=flashalbum&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2Fallen%2Falbumid%2F1231213235%3Falt%3Drss%26kind%3Dphoto%26hl%3Dzh_TW'imgsrc='按下的圖片網址'width='400' height='267' />

如果你的picasa網址不是picasaweb.google.com而是其他國別,記得上方的picasaweb.google.com要改成你自己國家的網址,例如加拿大的是picasaweb.google.ca

呈現的樣子,

【插入音樂MP3】

語法為,
<fb:mp3 src="http://音樂網址.mp3" title="歌曲名稱" artist="演唱者" album="專輯名稱"/>
呈現方式,

測試頁面可以參考以下網頁,目前暫時放著。
FMBL教學

自從成立粉絲專頁後,綸太郎儘量不要把它變成一個RSS發布的平台,而是真正能與喜歡自己文章的朋友有互動及交流的機會,但是目前好像大家的習慣還是趨向較靜態的,較常遇到的就是遊戲及測驗的邀請或是加入,只是這兩個我目前都沒有興趣,只能按下"略過",其實一直在想怎麼樣好好利用這個在台灣已超過500萬人口使用的平台,加入也才半個月,覺得這是一個很好研究討論的園地,慢慢的發掘吧。

9 則留言:

  1. 我也還再研究,現在幾乎只用來轉RSS和打電動……

    老實說我主力還是會放在blog上面,臉書變成一個窗口而已,但還是希望他可以漸漸發揮出更好得功能。

    至少臉書幫我找到不少失聯同學阿!但我發現他們用的比我還要少……

    回覆刪除
  2. 對啊,這樣下去可能是走向熱潮漸退的停滯狀態了。

    回覆刪除
  3. 拜讀貴大作,及到訪你的 facebook 0 與 1 謎詭世界 ,真的獲益良多,我都做了一個試試,可是我只能在查看粉絲專頁出現FBML 的頁籤,當按個人檔案後只見塗鳽牆和資料等頁籤,又試過用其他 Facebook 用戶登入都沒見FBML 的頁籤 (已選取非粉絲登是FBML ? ) 不能像你 的 facebook 一樣能顯示 Welcome 及 fbml教學的頁籤。謝謝!

    回覆刪除
  4. 安裝篇有提到,"這個工具只限粉絲專頁使用,個人頁面是無法使用的。"你可能沒有注意到。

    回覆刪除
  5. 但是我已經試過用另一個 Facebook 用戶登入郤見不 用FBML 寫的 Welcome 頁籤
    (已選取非粉絲登入是FBML 的 Welcome ? )
    謝謝解答!

    回覆刪除
  6. 不管有無登入,FBML製作的Welcome都能看得見的,除非你的粉絲專頁還未發佈,那就只能該粉絲專頁的主人登入時才能看見。

    回覆刪除
  7. 已試用朋友的戶口以非粉絲身份登入,但和未有建立 FBML 之前一樣,不像我登入你的戶口一樣,即見到 Welcome 頁?

    回覆刪除
  8. 我以我的狀況告訴你,我只有一個facebook的帳號,粉絲專頁是公開的園地,沒有登入與否都能看得見,譬如http://www.facebook.com/driver168,他的"介紹"就是用fbml寫的,是不是你沒有把它拉到分頁裡,而放在應用程式+的資料夾裡。

    回覆刪除

設有留言驗證及核准,版主閱覽後,留言才會顯示,發問前請善用網站目錄Google搜尋功能