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

http://program.luckchoco.com/2011/04/facebook-like-button.html

很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！
- N* K- w1 f+ ^1 U' A5 h

% o$ T8 p5 X5 g* n1 e
以下是語法和註解，複製和修改一下就可以使用囉：

1. <div id="pushGood">
   4 v1 n' o- O# S6 Z; Y$ _; Z5 Q
2.       請先按讚，才可以看到"秘密"內容唷
   5 o2 }% c2 M: r% n
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   
5. 
   # X% e2 N  R7 l3 \# a& x
6. 
   
7.   <!--↓↓FB讚按鈕語法↓↓-->
   ' [4 c9 W  p1 i2 H4 `
8.   <div id="fb-root"></div>
   
9.   <script src="http://connect.facebook.net/zh_TW/all.js#appId=&amp;xfbml=1"></script>
     o9 w( M& Y# M6 a' }0 U8 ^
10.   <fb:like href="http://program.luckchoco.com/2011/04/facebook-like-button.html" send="false" width="450" show_faces="true" font=""></fb:like>
    
11.   <!-- href裡 放入要按讚的網址-->
    
12.   <!--↑↑FB讚按鈕語法↑-->
    
13. 
    
14. 
    0 h/ m" L. p& O, a
15.   <div id="realContent" style="display:none">
    
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    
18.   </div>
    2 K; {2 ^3 p, B2 ~2 y
19. </html>
    
20. <script>
    8 D. T+ I8 y# h+ O) G  p
21. function show(){
    3 Y  h9 |/ \! `' D9 |" R. t
22.        //隱藏內容
    
23.       document.getElementById("pushGood").style.display="none";
    9 b. I* J% W0 q* s" V  u0 I. V- ^
24. 
    
25. 
    ! g9 z# G' B& f
26.        //顯示內容
    & [3 k% b1 r: W+ {, _6 d+ ^$ Y
27.       document.getElementById("realContent").style.display="";
    + w  e7 e3 \) T+ `0 E2 T6 G7 u
28. }
    : _( h! g( b: d2 p; \
29. function hide(){
    * ]: t4 x4 ?" d3 U) E
30.       //顯示內容
    $ Z( K& B4 c- m* {4 S0 I' L
31.       document.getElementById("pushGood").style.display="";
    
32. 
    
33. 
    
34.       //隱藏內容
    
35.       document.getElementById("realContent").style.display="none";
    . m5 U/ h. P4 h
36. }
    ; u# u' |  |0 d) P8 H$ `! i1 C
37. 
    
38. 
    
39. window.onload = function(){
    8 J, f8 f& S5 }: t  I& S. f- |4 V
40.     //初始化
    ' q# ^( G* y9 @1 h$ R, N
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    2 s1 B: n0 i5 \- C
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
      w' w1 {2 G7 h5 N( s7 n- l; G' m
43.    
    
44.     //edge.create 按讚後，要執行什麼function，此為show()
    , T: F6 [4 X2 o. d7 b" j, n6 p
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    9 k+ q. X% b: y. d; {9 o0 @
46.    
    
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
    5 o( V) F/ }6 [. P$ j3 [
49. };
    
50. </script>

Copy

關於 FB.Event.subscribe ，FaceBook有說明
4 n4 c1 J. Z, @; P

參數	執行時機
auth.login	使用者登入後
auth.logout	使用者登出後
auth.prompt	如果使用者讚按或分享等按鈕， 處於未登入的狀態，跳出登入視窗後
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訊息時

3 C) Z! y/ O* M' `7 J% n現在網站都流行按「讚」散佈訊息，帶入流量，以行銷而言算是一個很好的手段
畢竟要不要按「讚」是個人的選擇
5 \$ a: a$ e8 F7 x/ h( F如果有隱私方面的疑慮，記得：臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...)，不要留下個人私密的資料唷！

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   
2. <div id="iError" height="200">
   
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   0 B+ V3 p. B% b2 l* o- s( E
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   
5. 
   / l( ]+ ?: s2 P. E6 D
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   ' c- K' c; d4 z* C( p9 Y+ e! O# J/ C
7. </div>
   ; S( F- ^5 C0 e. \" @' \! r% T7 L
8. <div id="fb-root"></div>
   
9. 
   7 L5 y( t% I5 B# D# n5 L' c
10. <div id="iContent" style="display:none">{1}</div>
    " @+ G. U$ E- t7 E
11. <script>
    
12. function show(){document.getElementById("iError").style.display="none";document.getElementById("iContent").style.display="";}
    
13. function hide(){document.getElementById("iError").style.display="";document.getElementById("iContent").style.display="none";}
    , o, d8 f6 `3 @& i& h  F, X) 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();});};
    2 I  ]# i. O: ~6 y
15. </script>

Copy