http://program.luckchoco.com/2011/04/facebook-like-button.html' O: J6 g+ u) U! G$ Q6 [
) `/ C/ U4 x; U很熟悉吧!現在各大網站,尤其是論壇,都喜歡來個按「讚」後才能觀看的伎倆。! x9 F# w W: Q
本篇不用按讚,免費教你如何寫個這樣的網頁,夠給力吧!
0 Z# A# Y; }7 v& |
& |) D0 u5 O6 Z: J" l; D! S3 l3 k2 _, F5 A# e! ]9 {" n- {
以下是語法和註解,複製和修改一下就可以使用囉:- <div id="pushGood">
3 g2 Y, F$ j7 h+ P/ L/ _ - 請先按讚,才可以看到"秘密"內容唷2 _' w- N- T; _& n {) }
- <!--還沒按讚前,顯示的內容-->
- I$ }: }5 m4 s$ ?7 @ - </div>
+ j& Q0 J9 P! i0 y; {
1 U7 w* F8 l% ~0 N" g9 k+ [
5 c& e8 Y. z, d; r- <!--↓↓FB讚按鈕語法↓↓-->$ v0 ~1 C$ X% i+ M" j
- <div id="fb-root"></div>
8 ?0 @ F- ^8 j. y2 N - <script src="http://connect.facebook.net/zh_TW/all.js#appId=&xfbml=1"></script>
; Y+ O) ]6 @$ C- y* q2 H - <fb:like href="http://program.luckchoco.com/2011/04/facebook-like-button.html" send="false" width="450" show_faces="true" font=""></fb:like>
) H/ c- j9 u# {) x2 K% ` - <!-- href裡 放入要按讚的網址-->5 Z* B" K u$ ?7 a1 G
- <!--↑↑FB讚按鈕語法↑-->
4 }* p ]2 ^! L
! v3 ^/ l, \! Q+ x. G2 t9 e
8 r% q9 I B7 g6 H* C4 N- <div id="realContent" style="display:none">- c- `0 X2 {1 f4 k& P, w, d( a
- 我是真正的內容
3 a$ i& t1 m. B$ f2 B; H - <!--按讚後顯示的內容-->
3 w0 z8 N9 j- Q0 `3 z+ i$ m' v: p - </div>& C! h l2 t* j t7 P5 ^! }
- </html>
4 d# L D) q+ \ - <script>! g u$ Q w0 K r
- function show(){7 i- Y3 N$ h, g g/ m- D5 v6 Q
- //隱藏內容: l' D( Z. i, @: H! P
- document.getElementById("pushGood").style.display="none";
3 _4 L4 N, G4 H1 S6 P - ( M& w, O! R$ d; Q# h6 m# A& A
- 4 N9 R, H& H; p
- //顯示內容6 H1 o. k5 n: z, w0 C6 G
- document.getElementById("realContent").style.display="";
7 C+ d0 y4 m- L! { - }* ?8 W+ a, i. S. l
- function hide(){
' G% L& j) [2 V" A* \, S - //顯示內容5 r, @$ I0 ]9 t/ T" |
- document.getElementById("pushGood").style.display="";
5 a$ N0 W, f) @% p; v- j
5 Y' b' Z! r; _, ~, `/ L% F- : Y8 j, {9 p4 r/ n. y$ G! |: m
- //隱藏內容
, m6 l, i6 L6 K% } - document.getElementById("realContent").style.display="none";
u2 E9 r- `" {* b1 u' C5 A, C - }$ I# X7 Z: a* U" c: D
3 D" U5 i6 p" B2 X& D& p
; m' ~! Z) N, d. d- window.onload = function(){: S- v6 ]1 P! b% }$ G
- //初始化( l* t% l# s C' R: O
- //appid的部份,可以放入你的應用程式appid,也可以不放. X5 R. i7 x) H& }1 e& M
- FB.init({appId: '', status: true, cookie: true, xfbml: true});* I5 g' m3 H% X8 d' A
- % M+ n8 H/ y) a4 F7 q( i/ h
- //edge.create 按讚後,要執行什麼function,此為show()" G% P* b; b; A" p3 M
- FB.Event.subscribe('edge.create', function(response) {show();});
E. U3 N1 S+ {: a- G - 7 M ~$ n6 F* J7 [8 M+ M. t! |) f7 r# w
- //edge.remove 移除讚後,要執行什麼function,此為hide()9 J& o! B5 D9 T
- FB.Event.subscribe('edge.remove', function(response) {hide();});# J; j) ?5 g+ L I/ v# |8 @. T
- };3 [' Z; Z5 p0 m5 H: ]
- </script>
Copy 關於 FB.Event.subscribe ,FaceBook有說明6 a6 Q+ T/ j' r |
參數 | 執行時機 | auth.login | 使用者登入後 | auth.logout | 使用者登出後 | auth.prompt | 如果使用者讚按或分享等按鈕,% L, `1 F( T) O! E
處於未登入的狀態,跳出登入視窗後 | 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 g1 v8 W" R% t( \ i
現在網站都流行按「讚」散佈訊息,帶入流量,以行銷而言算是一個很好的手段4 g6 B( }6 N/ s
畢竟要不要按「讚」是個人的選擇
, U7 y p* e6 ]7 ~如果有隱私方面的疑慮,記得:臉書上不管哪裡(塗鴉牆、個人資料頁、對話訊息...),不要留下個人私密的資料唷!
Q. y' e1 d" N& L4 ` |
|