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

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

很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
( q7 X* q9 I* e, @5 L: `) x9 A本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！
3 w$ V+ C- H) {# P8 b; f6 B

以下是語法和註解，複製和修改一下就可以使用囉：

1. <div id="pushGood">
   
2.       請先按讚，才可以看到"秘密"內容唷
   
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   
5. 
   8 K4 {& K) c; K8 p+ ]& z8 D1 s$ ]2 `
6. 
   
7.   <!--↓↓FB讚按鈕語法↓↓-->
   
8.   <div id="fb-root"></div>
   ' c8 }0 U8 G0 ]; G
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>
    % p( s. Y7 B% L3 y
11.   <!-- href裡 放入要按讚的網址-->
    9 `3 U3 F1 d1 u5 Y5 R# J7 D0 N1 }6 s
12.   <!--↑↑FB讚按鈕語法↑-->
    
13. 
    : e  n8 Q2 `& L2 K% K/ b3 a$ r: b( W
14. 
    
15.   <div id="realContent" style="display:none">
    2 L/ Y  F, P( i. @
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    
18.   </div>
    
19. </html>
    , {1 \" F$ X: Z' c9 z: @6 C* B
20. <script>
    
21. function show(){
    9 l' Q8 S1 w4 g! f
22.        //隱藏內容
    
23.       document.getElementById("pushGood").style.display="none";
    5 f' y: a. P5 b5 @
24. 
    
25. 
    ' P5 w9 q* @# {+ v, w# I
26.        //顯示內容
    ' ~; e  f1 `, k2 p1 R& [
27.       document.getElementById("realContent").style.display="";
    8 {- w4 q1 o4 R0 Z
28. }
      X$ H; Q! y$ T0 T+ T
29. function hide(){
    9 J% }8 x+ G; S" a2 b4 H
30.       //顯示內容
      d! p3 n1 g- \. K( x% ~& b6 O
31.       document.getElementById("pushGood").style.display="";
    % Z: Z3 P$ [: j5 v, g1 W0 H
32. 
    " v1 ~0 u; @0 [) Y1 n
33. 
    
34.       //隱藏內容
    
35.       document.getElementById("realContent").style.display="none";
    4 h! S3 M- J7 c$ {
36. }
      V4 K5 v3 Y4 [8 w8 i
37. 
    - r7 I! O# U# E7 f" P& d- ?
38. 
    ; |2 g8 I0 E) d, e: c
39. window.onload = function(){
    8 b7 n. O+ W9 m& S3 C3 Y
40.     //初始化
    " C* \( R8 n% a9 F* J0 ^4 S1 P
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
    
43.    
    
44.     //edge.create 按讚後，要執行什麼function，此為show()
    
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    
46.    
    
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
    ( j# S( g: j  U
49. };
    
50. </script>

Copy

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

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

* Q* c1 @+ E% @6 }現在網站都流行按「讚」散佈訊息，帶入流量，以行銷而言算是一個很好的手段
. _$ o, _2 O. {# E7 P2 p( K畢竟要不要按「讚」是個人的選擇
2 z) U0 f: x! M1 q+ W: O) v如果有隱私方面的疑慮，記得：臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...)，不要留下個人私密的資料唷！
# ~3 V* S* c& I- Z6 b7 O2 D

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   ; J" L9 e0 E$ Z( {" H* t+ w8 j
2. <div id="iError" height="200">
   
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   / O6 c! D1 Y5 D( s6 h6 T& H# p0 ?6 s
5. 
   ; \" A8 M: R# a. x: @0 w5 `
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   ! K+ v' I# [0 @$ e/ a7 n7 Y" p
7. </div>
   ( a1 z/ T; \6 j( {' u
8. <div id="fb-root"></div>
   ; ]$ L+ s; i' ~2 N0 D; B
9. 
   9 e. h) y) G" f* N) x: P6 O
10. <div id="iContent" style="display:none">{1}</div>
    9 E- y. o( n8 U% T$ Q" ~
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";}
    
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();});};
    
15. </script>

Copy