如何在部落格放Facebook粉絲框?

常常看到很多人在問說怎樣把Facebook粉絲框裝加入到網站內?因為他們看到我們網站右上角有個Facebook的粉絲框,加上去好像可以有不一樣的感覺。其實加上這個框主要就是推廣粉絲專頁,讓更多人可以加入這個粉絲團,在Facebook上可以得知我們的最新文章以及一些好玩的資訊。

要放上這個粉絲框,其實只要到Facebook取得一串代碼就可以了,不過前提是你要有建立粉絲團,才可以拿到代碼。代碼就只是一串iframe,只要在部落格新增一個模組,貼上就會顯示了,不過若部落格側邊欄不支援iframe語法,那很可能就沒辦法了,可能要改用另外的模式。

想要可以在部落格放一個Facebook粉絲框,首先您必須先建立一個粉絲專頁才能獲取這樣的粉絲框(Like Box),若您尚未建立粉絲專頁,參考這篇文章新增這個粉絲框和之前介紹的「讚按鈕」方法是一樣的。這兩個元件都是屬於Facebook社群外掛元件,讓你可以利用社群平台來與網友進行互動。目前非常流行透過社群網站來曝光自己網站,透過這樣的元件,可以讓你在臉書這個大市場內凝聚人氣。

補充一下,很多人第一次看到這個東西會覺得很特別,為什麼他都顯示我的朋友耶?事實上只要你有登入,如果你去別人網站看到這樣的框,Facebook為了利用社群的力量來壯大,所以會在粉絲框上面優先顯示有加入這個粉絲框而且是你朋友的人,所以你常常會看到裡面都是朋友,如果你登出,那就是隨機顯示囉!

  • 網站名稱:Facebook 社群外掛-Like Box
  • 網站網址:按這裡
  • 香腸炒魷魚的粉絲頁按這裡

第1步 來到Facebook的Like Box頁面,依照網站欄位需求進行設定,右手邊會即時顯示這個Like Box的樣式,完成後請按﹝Get Code﹞。

  • Facebook Pafe URL:粉絲專頁連結
  • Width:寬度
  • Color Scheme:顏色樣式(分成白底與黑底)
  • Show Faces:顯示頭像
  • Stream:顯示最近張貼的文章
  • Header:顯示頂部

如何在部落格放Facebook粉絲框?

第2步 Facebook提供兩種嵌入粉絲框的語法,建議大家選擇iframe比較簡單,另一種是透過XFBML,如果iframe使用失敗,可以考慮嘗試看看。

如何在部落格放Facebook粉絲框?

第3步 以WordPress為例,在後台【外觀】→【模組】中,新增一個文字模組,然後輸入代碼並點﹝儲存﹞即可,我們是使用iframe語法。

如何在部落格放Facebook粉絲框?

第4步 最後你就會看到在側邊欄中顯示Facebook Like Box 粉絲框囉!

如何在部落格放Facebook粉絲框?

  • Sheng Yun Wang

    你好 想請問一下
    粉絲團的讚會出現錯誤
    按下去會先顯示已按讚 之後瞬間變成錯誤
    至於其他文章的讚 和其他功能都可正常使用

    • 不確定喔@@ 隔空抓藥有點難

    • Sheng Yun Wang

      原本我想說我丟到ER-WEB 給你看 結果發現 丟上去功能變正常了 是因為我在localhost 測試 才產生錯誤嗎?

    • loalhost 只是測試環境,有些東西需要以正式環境較為準確

  • Amber Buzz

    想請教要怎麼外掛於blogger?

    • blogger 可以找找側邊欄的工具,應該有一個HTML的程式碼可以塞的樣子

  • Yuhan Jiang

    想請問一下,FB Like Box粉絲框的長度有限制?

    • 新版長度固定,無法變更,除非增加訊息流。

  • disqus_katsvAxTHZ

    之前貼都好好的…今天FB Like Box 粉絲框突然扁掉了…
    寬度被鎖定在180px,要改也沒反應QQ
    請問有人知道原因嗎?謝謝!

    • 請問有網址嗎?

    • Acilo

      問題已解決,剛剛參考了香腸大的這篇
      http://sofree.cc/facebook-page-plugin/
      把"程式碼1″移除之後就正常了!! 謝謝!!

  • Simona

    請問樂天要怎麼加facebook

  • Huang Zheng-Lun

    請問小工具可以選擇顯示於特定的頁面嗎
    我想把likebox的工具僅顯示在首頁就好
    但不知怎麼修改,目前是每一個頁面都會有

    • 這個要改code了,會必較麻煩些了哦~

  • 香腸大!請教您現在的協作平台是不是已經無法嵌入粉絲團囉!如果是側欄的話!

  • Guest

    不好意思
    想再請問您
    為什麼FB like box 按讚會出現問題?如圖示

    • 可能FB沒辦法正確讀取網站,或是您放置語法有誤。

  • 宜 靜

    你好,請問香腸版大

    Google Sites 網站首頁的Sidebar有辦法直接嵌入Facebook的Like Box頁面嗎?

    目前我只能新增頁面去放語法!並不能像您介紹的文章一樣顯示在旁邊

    • Google Site 這部分不太清楚,因為沒有去使用了。

      看看他是否支援iframe 或是Javascript吧

    • 宜 靜

      謝謝您的回覆!

  • 您好,請問如何在部落格文章最下方崁入FB名片?(上網爬文還是不知道怎麼用)麻煩幫忙解惑一下,謝謝
    EX:http://loislinlin.pixnet.net/blog/post/175372692

    • 名片和這個不一樣。
      而且名片不會更新,他只會抓你當下的資料,不建議使用。
      若真的需要可以查看: https://www.facebook.com/badges/

  • 求解的人

    請問一下~~為什麼粉絲團管理者本身有時候看不到崁入在網頁的粉絲框…有時候又看的到???
    瀏覽其他人的粉絲框都是正常的….這是啥原因???

    • 你是用粉絲團身分看還是個人身分?通常用粉絲團身分看問題會比較多。

  • lhd

    香腸大,我要在新的APP引入我粉絲團的like按鈕,已經引入,但是我無法判斷,該用戶師傅為我粉絲團的成員:也就是點沒點擊過like按鈕.我用的是asp.net開發.并引入facebook.dll,登陸那塊用的是javascript SDK ,如果有相關demo,還望告知,不勝感激.liuha889@163.com

    • 抱歉,這個沒有DEMO,你必須自行透過API取得戶權限後,然後調查他是否有按粉絲團讚。

      ASP部分就更沒碰過了 ~~

  • 為甚麼我用GOOGLE的部落格用卻多次顯示不出來><

    • 應該有東西你沒有貼好,再自行檢查看看了

  • lucy

    請問奇摩部落格有辦法用這個link嗎?因為試了蠻多次都顯示不出來

  • 錢先生

    大家有沒有發現Like box 雖然可以顯示塗鴉牆, 但圖片卻沒有出現, 我很多網站的也是一樣啊! 有辦法解決嗎? 我的網址是www.catcatdaddy.com, 請幫忙查看一下~ 謝謝!

    • 因為你的FB頁面可能設定限定年齡或是國別,所以登出無法判定 = 通通不顯示

  • eason

    臉書被鎖..下一個呢..人民的嘴也要鎖? http://beta.im.tv/article.aspx?cid=50&id=29339

  • 不好意思又要來請教香腸了。
    以前兔兔腳的網頁中就有放置粉絲框,也都可以正常顯示。
    但是不知道從何時開始,突然就變成非登入FB帳號時,會顯示『公開的 Facebook 個人檔案登入查看內容』一定要登入才能看到內容?(部落格也是)
    但是在別人的網頁不用登入帳號就可以看到粉絲頁內容耶?
    請想教一下,我需要更改哪些設定,才能非登入時也正常顯示呢?謝謝唷。

    • 呵呵..不好意思,我終於找到解答了。
      因為我把顯示國家設定台灣,看FB解釋好像有設定國家,一般人沒登入就看不到。
      (啊..位於台灣怎麼看不到?)
      刪除國家設定就OK了。
      不好意思ㄋㄟ…每次都是來香腸這邊找答案。^^"
      剛剛有照香腸的文章說明改了短網址了,好方便唷。

      香腸回應:
      恭喜你 :)

    • oohowba

      請問要怎麼刪除國家設定呢?

  • o( ̄︶ ̄)/

    iframe用不起來 +1
    XFBML 無法貼出
    @wordpress

    香腸回應:
    新版改版可能造成一些問題了 囧

  • 飛呀

    請問如果是放在無名小站

    那要使用哪種語法呢

    又要貼在哪裡??

    我放在資料夾結果它不理我- –

    香腸回應:
    無名我不是很清楚耶~

  • 感謝您的教學,第一次開始要用粉絲專頁了。

    香腸回應:
    加油囉! GO!

  • YO~

    可是我iframe用不起來….

    XFBML是用啥外掛?

    香腸回應:
    XFBML 你查一下囉~ 我也沒有說很清楚~@@