如何在Wordpress部落格上加入 Facebook「讚」按鈕來分享文章？

記得當時挨踢路人甲沉迷於小遊戲而接觸facebook臉書，時間與熱度慢慢的解除一昧追求流行瘋狂的行為，當回歸理智後發現原來臉書的社群功能才是它主要的拿手絕活，進而發現facebook的粉絲專頁也蠻不錯的，更沒想到會自己架部落格(wordpress)，看到別人的部落格上都會出現Facebook的「讚」鈕，感覺好酷哦！為了讓自己經營的部落格有更多的推廣，特別加入facebook、Google+推文的按鈕，期許更多人能欣賞到不錯的文章。

首先至社群外掛程式網頁，在左邊選擇想要設定的外掛功能，有儲存按鈕、讚、分享、發送…等眾多外掛，筆者以「讚」按鈕來說明。

進入設定頁面後，第一個「按讚的網址」是指定推文的網址指定，除非你要推文的網址是固定的，例如路人甲是要在部落格(wordpress)內文呈現，所以先填一個易記的網址或編號，待程式碼產生後較容易尋找並取代，版面設計就是按紐的型態，選擇預設的standard，box_count、button_count與button，接下來是區塊的寬度指定，動作型態是指按鈕顯示的文字，最後按下[取得代碼]來產生程式碼。

提供兩種嵌入按鈕到網頁的方式，挨踢路人甲使用「Javascritp SDL」程式碼，其下方有兩個程式碼區，上方是通用的語法，一般只要放在<body>之後即可，下方式是顯示按鈕的語法，就是放入你想要顯示的頁面位置，為了能動態分享文章網址，藍色框內的網址必須修改。

WordPress的佈景主題是採外掛的方式，路人甲無法得知每個佈景主題的設計差異，一般來說文章頁面是single.php檔，在\wp-content\themes\佈景主題名稱下就可找到，利用文字編輯器開啟single.php檔，為了讓Facebook「讚」按鈕能自動抓取對應的文章網址，須將原先程式碼上的「分享文網址」改成動態顯示網址的語法，就是在 data-href=之後的網址改成"<?php echo get_permalink(); ?>"。

<!– Facebook 分享按鈕。顯示按鈕的語法 –>
<div class=”fb-share-button” data-href=”<?php echo get_permalink(); ?>” data-layout=”button_count” data-mobile-iframe=”true”></div>

通用的語法只要放在<body>之後即可，筆者將放在header.php上。