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

http://program.luckchoco.com/2011/04/facebook-like-button.html
& i/ k0 w% \" }+ g! G
- M0 m# a' _1 K- Q# q' Q) @1 s' {/ E很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
4 [# k; l5 |, ?$ `本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！

1 Z; f5 }# a4 C
" H1 u6 V+ E2 S; Q  S以下是語法和註解，複製和修改一下就可以使用囉：

1. <div id="pushGood">
   0 x8 z  d1 g; Y* r
2.       請先按讚，才可以看到"秘密"內容唷
   5 @. [- m# d' V% y
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   & w4 _+ e+ G. O! i& G) t9 J
5. 
   ! f0 k% D% S/ I0 z, Q: S$ g. D5 v
6. 
   . F& G0 \: I6 |( [# G5 p# `
7.   <!--↓↓FB讚按鈕語法↓↓-->
   / |2 i0 G% X! S
8.   <div id="fb-root"></div>
   
9.   <script src="http://connect.facebook.net/zh_TW/all.js#appId=&amp;xfbml=1"></script>
   ' h" R+ {+ g1 X; y& h
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讚按鈕語法↑-->
    6 b3 h/ z- ?& y& P  q! d
13. 
    
14. 
    ' v4 @6 j$ u9 y) J9 _
15.   <div id="realContent" style="display:none">
    
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    
18.   </div>
    
19. </html>
    - T* m# C& h( S# G: g+ [
20. <script>
    
21. function show(){
    
22.        //隱藏內容
    , b, `7 u5 f( _! N4 w
23.       document.getElementById("pushGood").style.display="none";
    
24. 
    
25. 
    
26.        //顯示內容
    " R% `8 Y6 {" ?1 [- d- O: m9 \. s
27.       document.getElementById("realContent").style.display="";
    
28. }
    
29. function hide(){
      G8 y/ X3 ^& |
30.       //顯示內容
    ! t2 r6 V: n, s- r! _" ]: g2 r
31.       document.getElementById("pushGood").style.display="";
    / G+ d6 H) v$ ^7 l1 k
32. 
    7 S( }' k2 H- R; |/ c
33. 
    
34.       //隱藏內容
    
35.       document.getElementById("realContent").style.display="none";
    
36. }
    9 i. W3 c' d3 s, M, ^0 h6 L+ i
37. 
    
38. 
    
39. window.onload = function(){
    6 x; u6 m( ?. P( o
40.     //初始化
    
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    2 B! O0 V6 I/ c3 F& g
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
    8 [+ `$ l  B6 P! \& ~2 S
43.    
    9 `0 |+ I; d0 J6 ^8 l
44.     //edge.create 按讚後，要執行什麼function，此為show()
    5 e# y: J" m8 i9 [
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    / o* t2 y# c8 Y8 D, [" k
46.    
    
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    , z4 c1 S0 \; k) z% ~* B  n) X
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
    
49. };
    
50. </script>

Copy

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

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

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

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   
2. <div id="iError" height="200">
   
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   ( }4 U8 W! ]3 }" E# `& x
5. 
   
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   % x% O: i  l8 W. O
7. </div>
   - I  _9 O2 V! R) K& w0 S
8. <div id="fb-root"></div>
   
9. 
   - V) }$ V. g: |( v% t" x
10. <div id="iContent" style="display:none">{1}</div>
    / Y+ O+ h+ O4 o+ N0 J1 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";}
    : J( f9 N' x$ r1 P3 x8 O8 P
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();});};
    / h9 G  i( Q! l" W
15. </script>

Copy