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

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

* J$ ?& U7 N2 f1 K很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
( S, a* `% P% \( {本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！
, h2 q9 F# L0 f' e9 b8 }* I

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

1. <div id="pushGood">
   
2.       請先按讚，才可以看到"秘密"內容唷
   * P9 E" r5 A# [9 ^& {& X
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   ! V6 Z9 |. [; P
5. 
   $ R7 H, b; x* S
6. 
   1 g* e% V. _* a8 s0 I  q) c
7.   <!--↓↓FB讚按鈕語法↓↓-->
   , m7 q$ j4 f4 I' F' i
8.   <div id="fb-root"></div>
   
9.   <script src="http://connect.facebook.net/zh_TW/all.js#appId=&amp;xfbml=1"></script>
   * M$ |3 r% n6 g; Y
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. 
    
15.   <div id="realContent" style="display:none">
    
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    
18.   </div>
    % M5 i! a: B- g; W3 t
19. </html>
    + w$ Z9 j3 X- t7 t
20. <script>
    
21. function show(){
    
22.        //隱藏內容
    
23.       document.getElementById("pushGood").style.display="none";
    , A* ]) n- q5 Z! t+ c8 _/ h; o
24. 
    
25. 
    
26.        //顯示內容
    
27.       document.getElementById("realContent").style.display="";
    ' w' z5 _6 W" A
28. }
    
29. function hide(){
    ( s" B- [7 b0 O  ]
30.       //顯示內容
    
31.       document.getElementById("pushGood").style.display="";
    
32. 
    . \" L/ f" ?) p5 q
33. 
    1 N0 |) n7 H# |4 a6 ?7 m
34.       //隱藏內容
    
35.       document.getElementById("realContent").style.display="none";
    5 j* V! Y/ N5 x4 }8 e
36. }
    
37. 
    4 F3 Q4 F3 M% a- u) E/ s
38. 
    / G" E* N& i7 c8 S2 e- f  h- z
39. window.onload = function(){
    
40.     //初始化
    # `9 ]$ D' u$ i1 U  @' u- i) b
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    & B& p3 H5 o2 w3 U( ~4 E- @
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
    
43.    
    
44.     //edge.create 按讚後，要執行什麼function，此為show()
    * ^1 t  \7 F" B. p2 B; U$ R1 ~
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    , ~/ N, @  {( [
46.    
    
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
      y( r1 B& ^1 W& P3 c6 w2 v3 e
49. };
    ! H0 B( @5 R7 E
50. </script>

Copy

關於 FB.Event.subscribe ，FaceBook有說明
+ s) `* Z& o4 Y  g* P, ~: M, j

參數	執行時機
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訊息時

% j1 H% W5 I2 G/ C) L7 R; C9 s現在網站都流行按「讚」散佈訊息，帶入流量，以行銷而言算是一個很好的手段
4 b' o7 ~6 G9 X2 N  [$ @% X8 e畢竟要不要按「讚」是個人的選擇
: K+ ]# n) R5 P! k6 m! _/ R! s' L如果有隱私方面的疑慮，記得：臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...)，不要留下個人私密的資料唷！
% w0 d3 R! @2 |8 Y* d& S! R$ c

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   
2. <div id="iError" height="200">
   ' Z% ~/ R, R* Y* `- m! y5 ~
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   0 x7 |. s9 E- H+ f; m# j$ y" c& Z/ G6 Q
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   # J* ]+ p  `, O* ^
5. 
   9 q9 Y; S* u9 {+ H3 r- q" n! Z
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   - C" _' d& Q/ J) F7 H# u5 n
7. </div>
   
8. <div id="fb-root"></div>
   , N/ Z1 ~/ x# w  O$ e6 @; t* j
9. 
   
10. <div id="iContent" style="display:none">{1}</div>
    
11. <script>
    9 g2 x, T& X7 P
12. function show(){document.getElementById("iError").style.display="none";document.getElementById("iContent").style.display="";}
    1 O8 S/ q/ r/ v. z+ z
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