需按「讚」才可觀看！FaceBook Like Button

http://program.luckchoco.com/2011/04/facebook-like-button.html
4 H0 l6 h' L" u- v4 [; J
很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！

7 x: B, S* ^" p, s8 J+ r+ H以下是語法和註解，複製和修改一下就可以使用囉：

1. <div id="pushGood">
   : \4 [6 b2 O8 r, a+ H. ~- S) G, X
2.       請先按讚，才可以看到"秘密"內容唷
   ( I5 x) P! I" a" [- v
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   
5. 
   
6. 
   
7.   <!--↓↓FB讚按鈕語法↓↓-->
   
8.   <div id="fb-root"></div>
   1 E0 N$ D# k" y, n; P4 ^
9.   <script src="http://connect.facebook.net/zh_TW/all.js#appId=&amp;xfbml=1"></script>
   
10.   <fb:like href="http://program.luckchoco.com/2011/04/facebook-like-button.html" send="false" width="450" show_faces="true" font=""></fb:like>
    * X& l  D$ ~9 b# H  A4 ~/ ]
11.   <!-- href裡 放入要按讚的網址-->
    0 e  M7 k2 e# S3 @- b( C# |" F. G
12.   <!--↑↑FB讚按鈕語法↑-->
    8 d4 q' R( V9 \* F
13. 
    
14. 
    
15.   <div id="realContent" style="display:none">
    9 M- p+ ^2 v. D0 J7 ~  F/ e% ?( }3 ]
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    ! N( m- n: O& [  F5 }+ Z2 }) ]- w
18.   </div>
    + |% B# [( k8 \" T" q/ J
19. </html>
    4 P6 [4 v9 \2 ]2 ~) d) V# f
20. <script>
    
21. function show(){
    
22.        //隱藏內容
    - @: p, A# G1 s& Q6 n
23.       document.getElementById("pushGood").style.display="none";
    
24. 
    
25. 
    . t2 P; B4 F# V2 F% b! M; e
26.        //顯示內容
    
27.       document.getElementById("realContent").style.display="";
    
28. }
    / O: M# D* j0 |9 K% O
29. function hide(){
    ) R% m8 ]/ v, T' k' p
30.       //顯示內容
    $ l# u- c# t# |" S$ U
31.       document.getElementById("pushGood").style.display="";
    
32. 
    
33. 
    
34.       //隱藏內容
    # g- K; \' n7 S, g6 E1 N5 t" C
35.       document.getElementById("realContent").style.display="none";
    
36. }
    ( l! F9 |: L1 W$ ~2 t& g  t
37. 
    ; n' S) r! L: n5 L9 ?
38. 
    
39. window.onload = function(){
    
40.     //初始化
    
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
    4 g% _; Z( q# L$ [' d, \1 W. c6 H1 ^
43.    
    
44.     //edge.create 按讚後，要執行什麼function，此為show()
    : R% ~3 v5 L" ~% d: C; d
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    + M+ S$ r$ V: \8 d" d
46.    
    : ]# ^7 T( A9 g3 G# t* Z+ v
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
    ; h  V" B/ M: h0 c4 O* P+ F3 O
49. };
    
50. </script>

Copy

關於 FB.Event.subscribe ，FaceBook有說明

參數	執行時機
auth.login	使用者登入後
auth.logout	使用者登出後
auth.prompt	如果使用者讚按或分享等按鈕， 3 e" _& D* [* G; ~3 j  g  y& Y處於未登入的狀態，跳出登入視窗後
auth.sessionChange	當使用者的FaceBook session改變時
auth.statusChange	當使用者的FaceBook status改變時
xfbml.render	呼叫FB.XFBML.parse()，執行完後
edge.create	當使用者按「讚」後
edge.remove	當使用者移除「讚」後
comment.create	當使用者送出「評論」後
comment.remove	當使用者移除「評論」後
fb.log	處理FaceBook Log訊息時

現在網站都流行按「讚」散佈訊息，帶入流量，以行銷而言算是一個很好的手段
6 }% e' @9 g' p" Q& D  Q畢竟要不要按「讚」是個人的選擇
如果有隱私方面的疑慮，記得：臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...)，不要留下個人私密的資料唷！

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   # V' ?; n( A( z
2. <div id="iError" height="200">
   ( P" w# ^* g9 d2 W/ \8 V6 a
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   . F. @1 ~4 M) y- B2 ]
5. 
   ! j& O% @& O3 R6 ]& y+ Q! U
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   
7. </div>
   # c* e+ N$ V' ?2 [
8. <div id="fb-root"></div>
   " \& h# S& i/ x( p+ o! y
9. 
   ( e3 t3 c, P1 q4 A8 c
10. <div id="iContent" style="display:none">{1}</div>
    
11. <script>
    
12. function show(){document.getElementById("iError").style.display="none";document.getElementById("iContent").style.display="";}
    ; r" N; {$ I4 T
13. function hide(){document.getElementById("iError").style.display="";document.getElementById("iContent").style.display="none";}
    # m. ~* A" M! f/ M. H* C
14. window.onload = function(){FB.init({appId: '', status: true, cookie: true, xfbml: true});FB.Event.subscribe('edge.create', function(response) {show();}); FB.Event.subscribe('edge.remove', function(response) {hide();});};
    0 W* J+ G+ ~$ B6 p6 ^  J, _/ D) G$ H
15. </script>

Copy