WFU

2015年8月15日 星期六

如何在部落格中加入Facebook粉絲框?

在逛其他人的部落格時,常常會看到網站中會出現一個粉絲框,裡面會顯示出你個人是否已經按讚,且有多少朋友也按讚了

這個功能是怎麼弄出來的呢?
我在這邊用簡單的方式,一步一步告訴大家
如果您自己也有粉絲專頁及部落格的話
  (粉絲專頁成立方式請點選這邊
  (部落格申請方式請點選這邊,此處以BlogSpot為主)
在看完本文之後,照著做就可以設定出一個Facebook粉絲框了

首先,假設您已經有一個粉絲專頁了
先把您自己的粉絲專頁打開,然後將它的網址複製下來(下圖紅線處)

接著,我們還要申請一個「Facebook應用程式ID」
因為再來要用這個來做相關設定
所以如果沒有的人,請先自行申請一個(申請方式請點選這邊

然後我們直接到設定粉絲框的功能網頁去做設定(網址請點選這邊

在這個網頁的中間部分,可以看到有一些欄位需要做填寫
 1.Facebook Page URL:自己粉絲專頁的網址
            (請填入剛才複製的粉絲專頁網址)
 2.Width:設定框的寬度(此處設定為180,可自行依照需求調整)
 3.Height:設定框的高度(此處設定為200,可自行依照需求調整)
還有其他可以打勾的選項,就留給大家自己慢慢測試吧

調整完之後,可以在下方看到一個「即時的」「粉絲框」
這個就是以後在自己的部落格中會看到的狀況
最下面有一個「Get Code」的按鈕

按下去之後,會跳出一個視窗,有分上半及下半
如果是要放「單一文章」中,請選擇「上半」的編碼
不過我們要的是「任何頁面」都會出現的編碼,所以「下半部」才是我們要的

把滑鼠移到下面的欄位,按右鍵,將它複製下來

接著回到自己的部落格中(此處用Blogspot作範例)
然後選擇「網頁配置

接著,點選右方的「新增小工具

會跳出一個視窗,接著選擇「HTML/JavaScrpit

然後在跳出來的視窗中,填入剛剛複製下來的編碼
貼上之後,然後按下「儲存」

這時候,畫面會跳回版面配置的頁面
下圖紅框部分,就是剛才設定的「粉絲框」

然後回到自己部落格的網頁,就可以看到成果了

不難吧~~
大家自己試試看吧^__^