【加入Facebook讚】加入臉書讚按鈕簡易做法

我就直接做個大眾化的懶人包，方便自己用也方便大家用，想看詳細內容請往下看。

懶人包，請享用：
自己看要不要看到按讚的人的臉，有可能性的會下拉拉爆你的版面
沒face版


<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class="fb-like" data-send="true" data-layout="button_count" data-width="450" data-show-faces="false" data-font="arial"></div>

有face版

<div id="fb-root">
</div>
<div class="fb-like" data-send="true" data-show-faces="true" data-width="450">
</div>
<script>
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

詳細說明
首先請到https://developers.facebook.com/docs/reference/plugins/like/選擇你要的按鈕樣式

選完後，請按GetCode他會給你兩段程式碼，請依下方程序操作

請打開Html語法，不會Html語法的請上基礎課程
W3schools裡面有詳細的教學
http://www.w3schools.com/html/


IDCode好像是要先申請Facebook開發人員，因為我之前有申請過，所以這我直接OK
如果有遇到障礙的人，可能要再找一下方法申請。


請先改IDCode，請勿直接拿去用

一般人用我標示的||||||這顏色
Step1.這段code到處放沒關係，放哪都沒影響
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
一般人用上面這一段


下面是你有加Facebook開發人員時會多加appID

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1&appId=XXXXXXXXX你自己的IDCode";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Step2.這是顯示按鈕的語法(就看你想放哪個位置)
<div class="fb-like" data-send="true" data-width="450" data-show-faces="true" data-font="arial">
</div>

沒試成功0.0~不過我發現Google  Blogger的小工具上有這項功能，所以在小工具上新增也是可以。

成功了~我搞錯了  修正一下。

還是有點怪怪的~
好像不是這樣用的，感覺還有什麼沒注意到的地方..

可以嚕~XD
測試OK~




參考
1.
http://www.inside.com.tw/2010/04/22/how-to-install-your-own-facebook-like-button
2.
http://micnet.blogspot.com/2010/05/facebook-like-button.html