2008-10-01

製作Google工具列的自訂按鈕

現在Google工具列已經是我在瀏覽器必須安裝的元件之一，因為有太多服務都依靠於Google，當然主要提供的服務也是相當方便實用。官方也提供了各式各樣的Google工具列按鈕集給予大家安裝，但難免都有找不到自己需要的工具列按鈕，只能靠自己製作。官方提供了Google工具列API建立自訂按鈕指南，自訂按鈕格式為XML檔。

google-toolbar-buttons

google-reader-buttons-refresh

例如找不到Google閱讀器的按鈕，官方也未提供，我們可以依照說明自行製作XML檔。XML檔基本結構如下︰

<?xml version="1.0" encoding="utf-8"?>
<custombuttons xmlns="http://toolbar.google.com/custombuttons/">
  <button>
    <title>您的稱謂</title>
    <description>您的工具提示</description>
    <search>您包含 {查詢字詞} 的搜尋範本 URL</search>
    <site>您的網站 URL</site>
    <icon mode="base64">
<-- 以 base64 文字編碼圖示取代本行 -->
    </icon>
  </button>
</custombuttons>

所以我們修改<button>底下定義即可，而比較麻煩的是<icon>這部份是新增至工具列按鈕圖示，大小為16x16的BMP、ICO、GIF和JPEG圖檔，需轉換為base64文字編碼。例如Google閱讀器直接取自官方的ICO，按右鍵另存新檔，到base64編解碼網站，使用瀏覽讀取剛剛的另存的ICO圖檔，點選Convert the source data(轉換來源資料)來進行編碼，得到資料再貼到<icon>這裡的定義就完成了我們所要的圖示按鈕。至於其他語法在官方都有詳細說明，有些都是不必要的，所以我們只把製作Google閱讀器必要語法和需求列入︰

<?xml version="1.0" encoding="utf-8"?>
<custombuttons xmlns="http://toolbar.google.com/custombuttons/">
<button>

<!-- 你要連結的網站 -->
<site>http://www.google.com.tw/reader/view/</site>

<!-- 按鈕名稱 -->
<title>Google 閱讀器</title>

<!-- 按鈕訊息描述 -->
<description>使用 Google 閱讀器在同一處存取新聞和網誌</description>

<!-- 下拉選單開啟、連結網站的更新時間為1800秒，點選按鈕不會強制更新、開啟連結Google服務狀態 -->
<feed menu="true" refresh-interval="1800" refresh-onclick="false" google-service="true">http://www.google.com.tw/reader/atom/</feed>

<!-- 按鈕圖示 -->
<icon>
AAABAAIAEBAAAAAAAABoBQAAJgAAABAQAAAAAAAAaAQAAI4FAAAoAAAAEAAAACAAAAABAAgAAAAA
AEABAAAAAAAAAAAAAAAAAAAAAAAA////AJPduQCN2bQAhNStAHzOpQB1yqAAc8mgAIPTrADZ++AA
4P3jAOX/5gDg/eQA2fvfANH32gDH9NUAvfDPALPrygCo58MA1/reAN784gBra80AdMmfANL32wDt
7fkA9vb8AOzs+ADn5/cA4+P1AN3d8wDR0e8Azs7uALa25gCZVioAoaG5AMPD6wDAwOoA7L2kAPXT
wQDyuJsA77CQAO2ohgDkoH0A25NqAOaIWwDKfkwAvLzoALKy5ADyy7YA8tfJAO6ZcADkhVgA2YFT
ANh9TwCysr4A9cOrAPXq5ADadkYAynpGAMXFxQDJye0AqqriAOmOYwD28O0A5K2QAPPz+wCjo98A
5Zl0ANeLYADKdDwAmJjcAMlsMwC5uecA/Pf0AMNpLQDCwsMA56WEAMaDVgCPj7IAfHzSAPfj2QBd
XaIA0JJoAMJlKwCvXSMA////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP//
/wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////
AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A
////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD/
//8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP//
/wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////
AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A
////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD/
//8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP//
/wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////
AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A
////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD/
//8A////AP///wD///8A////ACAgICAgICAgICAgICAgICAgLDMqLENDSSwsUyAgICAgIEMAAEYA
AERPACwgUBQUICAoAD8qAABGAABMIE0fThQgKjMxAAAvPwAASSA6AB8UICYAAAAJPTcAL0YgOgAf
FCAkAAAlMSUAADNGIDoARRQgPz09JjcAACgsNCA6AEEUIDY3AAAAACYzNCwgOh48FCAvAAAAJTEz
MywzICEfHxQgJCUlJCgoKEMzLCAeHzwUICAgICAgICAgICAhHjweFCAgFQ4UFwAAFxwXHB4eHxQg
IAQMCBQUFE4UFBQUFBQgICADCAkJCQgODg4REQMgICAgIAEBAQEBAgMEBBUgICCAH9RcAA/OoAAB
1BwAAM6gAADUJAAAzqAAANQsAADOoAAA1FwAAM6gAADUPIAAzqDAANREwAHOoMAD1EzgB86gKAAA
ABAAAAAgAAAAAQAgAAAAAABABAAAAAAAAAAAAAAAAAAAAAAAAAAAAACZVir/mVYq/5lWKv+ZVir/
mVYq/5lWKv+ZVir/mVYq/5lWKv+ZVir/AAAAAAAAAAAAAAAAAAAAAAAAAACZVir/ynQ8/9eLYP/b
k2r/ynQ8/9CSaP/Xi2D/wmUr/8p6Rv/Kfkz/r10j/5lWKv8AAAAAAAAAAAAAAAAAAAAAmVYq/9uT
av///////Pf0/8p0PP///////////8p0PP/349n//////8p+TP+ZVir/XV2i/2trzf9ra83/AAAA
AJlWKv/npYT//////+StkP/lmXT///////z39P/KdDz////////////Gg1b/mVYq/4+Psv+2tub/
fHzS/2trzf+ZVir/25Nq/9mBU//koH3//Pf0///////yy7b/5K2Q////////////w2kt/5lWKv/C
wsP//////7a25v9ra83/mVYq//K4m//////////////////16uT/6Y5j//bw7f//////8su2/8ls
M/+ZVir/xcXF//////+5uef/a2vN/5lWKv/svaT////////////108H/5Zl0//XTwf//////////
/9eLYP/KdDz/mVYq/8XFxf//////mJjc/2trzf+ZVir/77CQ/+mOY//pjmP/8rib//bw7f//////
/////+StkP/Kekb/2nZG/5lWKv/FxcX/8/P7/6Oj3/9ra83/mVYq//XDq//16uT/////////////
/////////++wkP/ZgVP/2nZG/8p6Rv+ZVir/xcXF/8nJ7f+qquL/a2vN/5lWKv/yy7b/////////
////////8tfJ/+6ZcP/khVj/2YFT/8p+TP/YfU//mVYq/7Kyvv+ysuT/vLzo/2trzf+ZVir/7L2k
//XTwf/108H/8rib/++wkP/tqIb/5KB9/9uTav/miFv/yn5M/5lWKv/Dw+v/vLzo/7Ky5P9ra83/
AAAAAJlWKv+ZVir/mVYq/5lWKv+ZVir/mVYq/5lWKv+ZVir/mVYq/5lWKv+hobn/w8Pr/7a25v/A
wOr/a2vN/wAAAAAAAAAAdMmf/9L32/9ra83/7e35//b2/P/29vz/7Oz4/+fn9//j4/X/3d3z/9HR
7//Ozu7/trbm/2trzf8AAAAAAAAAAHPJoP/X+t7/3vzi/2trzf9ra83/a2vN/2trzf9ra83/a2vN
/2trzf9ra83/a2vN/2trzf8AAAAAAAAAAAAAAACD06z/2fvg/+D94//l/+b/4P3k/9n73//R99r/
x/TV/73wz/+z68r/qOfD/4PTrP8AAAAAAAAAAAAAAAAAAAAAAAAAAJPduf+T3bn/k925/5Pduf+T
3bn/jdm0/4TUrf98zqX/dcqg/3PJoP8AAAAAAAAAAAAAAACAH9RcAA/OoAAB1BwAAM6gAADUJAAA
zqAAANQsAADOoAAA1FwAAM6gAADUPIAAzqDAANREwAHOoMAD1EzgB86g</icon>

<!-- Google 閱讀器讀取到新文章的訊息描述 -->
<feed-description>Google 閱讀器讀取到新文章</feed-description>

<!-- Google 閱讀器讀取到新文章的按鈕圖示變換 -->
<feed-icon>
AAABAAEAEBAAAAAAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAQAQAAAAAAAAAAAAAAAAA
AAAAAAD+/f3/7uvq/+3q6f/t6un/7erp/+3q6f/t6un/7erp/+3p6P/s6Of/7enn/+3q6P/t6un/
7erp/+7r6v/9/f3/8+/t/3lDLf9sMBj/bzQc/280HP9vNB3/ay4V/2gpEP9wNR7/d0Aq/3Q7Jf9t
MBf/aCkP/2otFP90Pyr/7+zq//Tu7P9/PCH/cikK/3QtD/90LA//biIC/4ZHLf/Bo5f/zLSr/7ud
kP+2loj/upyP/62Fdf+BPyT/dTMX/+/r6f/17+3/jEcp/4A0FP+DOBj/fS4N/6VwWv/49fT/x6eZ
/4tHKf+ANRX/gTYW/4lHKv/u6OX/wpyL/3wyE//w6+n/9vDt/5dOL/+NPRr/jTwY/5hRMf/69/X/
0rOl/4QuCf+JNxL/jDsX/4o2Ev+CKQL/49XP/8abiP+GNxT/8Ozq//fx7v+hVDL/lkAa/5M6Ev/C
lYH//////6NYN/+UPhf/l0Me/5U+GP+dUjH/uop1/+XZ0//Ss6b/lEUj//Dr6P/37+v/sWxN/7Z3
Wv+uZ0j/1LOk//Tq5f+iTCb/oUki/6FJIv+fRh7/oUwm/6dZN/+gTSj/oEwm/55OKv/x7Or/9+/r
/8KGa//Rqpn/yJV+/9OtnP/06OP/qlIp/6lQJ/+oTyf/qE0k/6ZKIP+lRxv/pEQY/6NBFP+kTyn/
8uzq//nz8P/FhGb/1a+d/9Glkf/JlXz/+vj4/7loQv+vUSf/sFUr/7BSKP+uUCX/rU0h/61PJP+s
Sx7/qVIq//Lt6v/79fP/yYZm/9ewnv/at6f/0J2E/+TQxv/jwLD/tVUp/7NUJ/+zVCb/sVAi/61D
E/+/c1H/xYBe/6tOI//y7er/+/b0/9OWef/Rm4H/37+x/9y5qP/QmX7/4sq//+LAsP/MiGj/xHRP
/8NyTP/MiWn/6tTJ/9KZfv+uTSD/8+3q//z49f/apo3/0pN1/9y3pP/hw7T/372t/9aljf/VpIz/
2K2Y/9mvm//ZsJ3/1qiS/8mFZf+6WCr/tFcq//Pt6v/8+ff/37Ca/9qki//XnoL/37yq/+PHuf/h
w7T/37mn/9qtmP/PjW7/wmk//8BkNv++XzD/vVsr/7hfNP/z7er//Pn3/+K4o//erpf/3auS/9qh
h//brZf/4sKz/+LDs//hwbH/1qCF/8l6U//Hdk7/xG5E/8FlOP+8Zz7/9O7r//36+f/oxbT/5b2q
/+O8p//iuKP/4LGZ/92rkf/drpb/3rOd/9qmjP/VlXb/0pBv/8+JZ//NgVz/yIJf//bx7v//////
/vv6//37+v/9+/r//fv5//36+f/9+vj//fn3//z39P/89/X//Pn3//z49v/8+Pb//Pf1//v39f//
/v7/AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA//8AAP//AAD//wAA
//8AAP//AAD//w==</feed-icon>

<!-- Button created by carlos - carlos@my-net.tw -->

<!-- 按鈕更新位置 -->
<update>http://my-net.cc/googlereaderbutton.xml</update></button>
</custombuttons>

最後把以上語法貼到Google工具列自訂按鈕編輯器，儲存至Google工具列，如果需要增加其他定義，我們可以再隨即修改儲存，而語法有問題的話，基本是無法儲存至Google工具列(會有提示)。或者把以上語法另存為*.xml，再將檔案複製到C:\Documents and Settings\使用者名稱\Local Settings\Application Data\Google\Custom Buttons路徑的目錄下，重新開啟瀏覽器就可以看到按鈕已經新增到Google工具列。一般製作好的按鈕放到網站提供其他人安裝，連結語法則是︰

<a href="http://toolbar.google.com/buttons/add?url=http://my-net.cc/googlereaderbutton.xml" title="新增 Google 閱讀器">新增到工具列</a>

例如點擊這裡新增Google閱讀器按鈕。