新增 Facebook Like Button(說「讚」按鈕)於網頁的方法

phpBB-TW Knowledge Base
收集網友們在竹貓所發表的教學主題或文章,以利分享!
(僅供瀏覽,由版主群維護)

新增 Facebook Like Button(說「讚」按鈕)於網頁的方法

文章心靈捕手 » 2011-06-09 20:47

前言:
目前,包括 CNN、IMDb、ESPN 等全球知名網站都已經成為 Facebook 的合作夥伴,未來在這些網站上的內容都可以直接以 Like 按鈕讓網友們表示意見並且分享給自己在 Facebook 上的社群好友。

Facebook 已經提供了 Like Button 的外掛程式供網站經營者們安裝。主要有兩種方式得以達成目標:XFBML 以及 Iframe。本文列舉實例說明:以 XFBML 原始碼的方式,新增 Facebook Like Button(說「讚」按鈕)於 phpBB 3 論壇以及相簿的方法。

增加 Facebook Like Button(說「讚」按鈕)原始碼於網頁上
  1. 取得 XFBML 原始碼:
  2. 填入需要顯示 Facebook Like Button(說「讚」按鈕)的網頁之網址:
      將該網址填入 href="" 兩個雙引號之間。
      p.s. 若網址中包含有變數,則需要另外處理。(詳見底下實例說明)
  3. 修改相關屬性:
    • 正體中文:將「en_US」修改為「zh_TW」。
    • 若要顯示個人頭像,則將「show_faces="false"」修改為「show_faces="true"」。
實例:
  1. 顯示 Facebook Like Button(說「讚」按鈕)於 phpBB 3(v3.0.8)論壇的文章頁
    代碼: 選擇全部
    --開啟--
    styles/prosilver/template/viewtopic_body.html

    --找到--
    <h2><a href="{U_VIEW_TOPIC}">{TOPIC_TITLE}</a></h2>

    --之後加入--
    <div id="fb-root"></div><script src="http://connect.facebook.net/zh_TW/all.js#xfbml=1"></script><fb:like href="http://220.134.232.37/phpBB3/viewtopic.php?f={FORUM_ID}&t={TOPIC_ID}" send="false" width="450" show_faces="false" font=""></fb:like>

    --儲存與關閉--

    p.s.
    1. 清除論壇快取。
    2. 將「122.116.131.30/phpBB3」修改為您論壇的網址。
    3. 展示:什麼是(黑心)起雲劑,如何避免食用?
  2. 顯示 Facebook Like Button(說「讚」按鈕)於 phpBB 3(v3.0.8)論壇的相簿(phpBB Gallery v1.0.6)圖片頁
    代碼: 選擇全部
    --開啟--
    styles/prosilver/template/gallery/viewimage_body.html

    --找到--
    <h2><a href="{S_ALBUM_ACTION}">{IMAGE_NAME}</a></h2>

    --之後加入--
    <div id="fb-root"></div><script src="http://connect.facebook.net/zh_TW/all.js#xfbml=1"></script><fb:like href="http://220.134.232.37/phpBB3/gallery/image_page.php?album_id={ALBUM_ID}&image_id={IMAGE_ID}" send="false" width="450" show_faces="false" font=""></fb:like>

    --開啟--
    gallery/image_page.php

    --找到--
    'ALBUM_JUMPBOX'      => gallery_albumbox(false, '', $album_id),

    --之後加入--
    'ALBUM_ID'      => $album_id,
    'IMAGE_ID'      => $image_id,

    --儲存與關閉--

    p.s.
    1. 清除論壇快取。
    2. 將「122.116.131.30/phpBB3/gallery」修改為您論壇相簿的網址。
    3. 展示:高科技氣象預測石.jpg
後記:

--
資料來源:
http://122.116.131.30/phpBB3/viewtopic.php?f=77&t=1001
施比受有福,歡迎來信賜教,謝謝 & 再見!
祝福您 好運 ^_^
歡迎加入★★心靈捕手★★ :: 討論區!!
p.s.
奉老婆之命:在晚上十一點前,得關機睡覺!!!
頭像
心靈捕手
默默耕耘的老師
默默耕耘的老師
 
文章: 8091
註冊時間: 2004-04-30 01:54
來自: Taiwan

回到 教學文件庫

誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 1 位訪客

Partnership: phpBBHacks.com