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

http://program.luckchoco.com/2011/04/facebook-like-button.html
8 D, K, ?2 B9 r
很熟悉吧！現在各大網站，尤其是論壇，都喜歡來個按「讚」後才能觀看的伎倆。
本篇不用按讚，免費教你如何寫個這樣的網頁，夠給力吧！

& }% s5 a8 |, p* {: x9 ^+ i- t" P1 }# O
以下是語法和註解，複製和修改一下就可以使用囉：

1. <div id="pushGood">
   # l) z* h3 {8 \7 U) r7 v" F  P/ g
2.       請先按讚，才可以看到"秘密"內容唷
   ' Q' ~# r2 _2 z9 j+ l2 E# k) B" @
3.       <!--還沒按讚前，顯示的內容-->
   
4.   </div>
   1 W' M. K; X: [  S3 {8 [& ?1 [( @
5. 
   ! X! t" n0 O2 K; P
6. 
   
7.   <!--↓↓FB讚按鈕語法↓↓-->
   + K: ^- C  N( x# S2 M
8.   <div id="fb-root"></div>
   
9.   <script src="http://connect.facebook.net/zh_TW/all.js#appId=&amp;xfbml=1"></script>
   ' t* C$ v$ ~9 h* C
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. 
    & L  F! h& n7 m/ e, y( T8 y9 ^
14. 
    ' ]6 k; C9 E& G4 `! A
15.   <div id="realContent" style="display:none">
    
16.        我是真正的內容
    
17.        <!--按讚後顯示的內容-->     
    
18.   </div>
    ; g& V6 L' R% a+ z2 m; ?1 e% o, b0 T
19. </html>
    
20. <script>
    
21. function show(){
    
22.        //隱藏內容
    
23.       document.getElementById("pushGood").style.display="none";
    1 y, `( ~" l; e9 O2 L
24. 
    
25. 
    
26.        //顯示內容
    
27.       document.getElementById("realContent").style.display="";
    0 v& W$ S- k+ H0 y, y; x9 m+ R
28. }
    
29. function hide(){
    
30.       //顯示內容
    8 b; I4 H, M5 n7 x1 H& W
31.       document.getElementById("pushGood").style.display="";
    
32. 
    
33. 
    ) }# B. M1 D4 {8 E; u0 z- U
34.       //隱藏內容
    
35.       document.getElementById("realContent").style.display="none";
    
36. }
    % A! ?5 v1 a3 \/ W5 \
37. 
    
38. 
    . M$ _( Y$ x# }, }. s- b# V5 y. _7 q
39. window.onload = function(){
    . }3 O8 s  b  p1 h% F0 w
40.     //初始化
    
41.     //appid的部份，可以放入你的應用程式appid，也可以不放
    0 n* x4 F" |1 H& b; V6 |* g
42.     FB.init({appId: '', status: true, cookie: true, xfbml: true});
    , B5 \/ G3 U' e! K9 u9 e- C3 S
43.    
    8 ^3 i0 C9 e! V3 c) [
44.     //edge.create 按讚後，要執行什麼function，此為show()
    
45.     FB.Event.subscribe('edge.create', function(response) {show();});
    , _8 y4 l& C' h# M
46.    
    
47.     //edge.remove 移除讚後，要執行什麼function，此為hide()
    
48.     FB.Event.subscribe('edge.remove', function(response) {hide();});
    0 j5 f+ f+ m9 A8 `
49. };
    7 C/ T+ F, p, y- n
50. </script>

Copy

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

參數	執行時機
auth.login	使用者登入後
auth.logout	使用者登出後
auth.prompt	如果使用者讚按或分享等按鈕， & }; S0 M- N; ~+ ^, K# `, L& J! z處於未登入的狀態，跳出登入視窗後
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訊息時

現在網站都流行按「讚」散佈訊息，帶入流量，以行銷而言算是一個很好的手段
畢竟要不要按「讚」是個人的選擇
0 c5 k* N% Z3 C, q7 k如果有隱私方面的疑慮，記得：臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...)，不要留下個人私密的資料唷！
( Q6 i: [# j2 k  D  d8 r$ ~3 K, b0 m

1. <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
   
2. <div id="iError" height="200">
   
3. 如需觀看以下內容請先 『登入』或按 『讚好』後即可觀看。<br />
   2 S2 F1 q% u1 J3 z6 a( n2 t% q$ b6 k" q" ^
4. <!--{if $_G['uid']}--><script>show();</script><!--{/if}-->
   ( H  V: S6 `5 A$ P: w  d& {6 t
5. 
   
6. <fb:like href="" send="false" show_faces="true" font=""></fb:like>
   5 x1 ~7 a2 g* c- j: F# d5 o& Z
7. </div>
   " L6 R# \5 r8 V! g2 T/ r! O3 z
8. <div id="fb-root"></div>
   4 d* H1 q0 ~, B  U0 ?6 T
9. 
   . p! K9 d$ p$ c( m
10. <div id="iContent" style="display:none">{1}</div>
    0 O- I' R8 O) x& V5 s- 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";}
    
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

6 x* u* c5 [- r  ^3 ?! F) O/ h