2012年4月17日 星期二

黏‧輕‧點 親子溫馨留言便利貼

黏輕點 親子溫馨留言便利貼
黏‧輕‧點 親子溫馨留言便利貼

最近上線的活動,主要的功能就是使用瀑布流的方式,結合FB留言板完成的網頁,這次就從頭到尾都自己完成,一個禮拜的時間。

留言板跟按讚的功能是使用FB的Social Plugins,使用起來很簡單,只要有網址就可以嵌到網頁內,不過後來有發現效能的問題,要在一個頁面出現那麼多留言板,下次製作類似網站的話就應該直接使用FB的API來開發了。

然後因為我使用ajax,所以之後讀取進來後不會初使化social plugins,所以必須要再Parse XFBML一次。

黏輕點 親子溫馨留言便利貼
這邊的彈出視窗是模擬pintrest的視窗,會從下面跑上來,因為上面的banner是固定的,所以這邊我就沒有使用plugin,而是自己去偵測彈出視窗的位置,自己寫也不會很複雜。

黏輕點 親子溫馨留言便利貼
影片的部分,用了才發現IE跟其他瀏覽器的行為又不一樣,其他瀏覽器只要hide,影片就會重置,而ie卻不會,所以我就用一個變數把值存起來,開啟彈出視窗再重新讀進去。

黏輕點 親子溫馨留言便利貼
這邊使用FB的Javascropt SDK,如果FB在登入狀態,便可取得使用者的名稱跟ID。

黏輕點 親子溫馨留言便利貼
留言完成便可以取得折價券了。

這邊有使用FB Dialog去把資料發布到FB的塗鴉牆。

黏輕點 親子溫馨留言便利貼

另外還有在FB的page嵌入頁籤。
黏輕點 親子溫馨留言便利貼
看文件就可以知道怎麼嵌入了FB Page Tabs

黏輕點 親子溫馨留言便利貼

設定完則是需要使用Add To Tab Dialog將頁籤嵌入Page內。

這次用了很多FB的東西,還蠻好玩的,下次就可以玩更複雜的東西了。
反應:

0 意見:

Related Posts Plugin for WordPress, Blogger...