<< [del.icio.us] 可以上傳FireFox書籤到網站 | 回blog首頁 | [FireFox] Copy / Paste 因保全因素而無法生效 >>

2005年03月13日 00:58

[Blog] 手動製作連結Furl與del.icio.us的圖示

今天一時興起，用手動製作的方式組合了下列圖示：

Add to Furl　　 Add to del.icio.us

接著解釋一下製作過程：
  1. 到Adam Kalsey的網站：Button Maker來製作雙併式的圖示如 Add to Furl
    1. 圖形分成左邊方塊(Left Box)與右邊方塊，中間有直槓(Bar)
    2. 網頁上第3個欄位指定的是中間直槓的位置(預設是25)，如果要把直槓向右移，則增加該值
    3. 網頁左邊方塊的第4個欄位(Text start pixels from the left)指的是左邊文字開始位置，如果要往左邊界移動，則減少該值
    4. 網頁右邊方塊的第4個欄位( pixels from the bar)指的是右邊文字由直槓開始起算之位置，如果要往左邊界移動，則減少該值，要往右邊界移則增加該值
    5. 文字、顏色等都指定好後按 Submit 即可產生圖形檔在網頁上
    6. 在圖形上按右鍵再另存圖片
  2. 依上述步驟也將 Add to del.icio.us 圖示也產生出來
  3. 由www.furl.net下載網站圖示檔favicon.ico
  4. 依＜span＞ Add to Furl＜/span＞的順序將網站圖示檔和按鈕圖形檔組合在一起，HTML片段如右：
    ＜span title="Add to Furl"＞＜img src="網站圖示檔URL" /＞＜img src="按鈕圖形檔URL" /＞＜/span＞
  5. 由先前貼過的文章將內容貼到＜span＞的 onclick事件。
  6. 同步驟 3由del.icio.us下載網站圖示檔，並比照步驟4組合在一起
  7. 在以上產生好的HTML最前面用＜div align="center"＞、最後面用＜/div＞將HTML片段括住，好讓圖形顯示在中央位置
步驟大概是這樣，兩組按鈕間會緊靠在一起，因此可以用空白將之空開(樂多遇到 & 符號會截斷該符號後文字，暫時用全形空白來取代&nbsp;吧)。

還有最後幾個問題：
  1. 找不到將游標換成手狀的樣式！在IE可以用"cursor: hand"的樣，W3C 似乎無法使用hand這個值，不知是否能有別的替代方法？
  2. 原本在步驟4中的＜span＞...＜/span＞是使用＜button＞...＜/button＞(這樣問題一應該就能解決了)，但不知為何無名小站無法解析；反正＜button＞似乎不是標準標籤，就使用＜span＞吧。
在Blog網站未提供連結Furl與del.icio.us方法之前，先用這個笨方法解決好了。

Add to Furl　 　 Add to del.icio.us

    • 您可能有興趣的文章：

    把文章的分類當做HEMiDEMi的標籤：Xuite自動書籤按鈕 V1.3
    << [del.icio.us] 可以上傳FireFox書籤到網站 | 回blog首頁 | [FireFox] Copy / Paste 因保全因素而無法生效 >>
    emisjerry 發表於樂多 │回應(7) │引用(2) │Blog工具箱 │編輯本文
    樂多分類：網路/3C │昨日人次：1 │累計人次：203
    Ads by Roodo! 

    引用URL

    http://cgi.blog.roodo.com/trackback/38143
    引用列表:
    看見許多格不約而同推出同類型的制式icon.比方說email address 系列;RSS link系列等等.製作這icon,除了使用photoimpact photoshop等繪圖軟體土法煉鋼之外.你可知道還有更容易上手的方法?? 在這介紹兩個網站: E-Mail Icon Generator. ButtonMaker. 讓你輕輕鬆鬆,幾秒鐘就搞定!...
    個人化Icon製造機【黑海中的璀璨】 at 2005年03月14日 03:28
    先記下來，要來好好研究一下
    【網路工具】Social Bookmark - Furl it!【六年七班三十四號‧生活雜記】 at 2005年06月4日 02:33

    回應文章
    呵，你作的del.icio.us貼紙跟我的幾乎一樣呢！
    想必也是從他的logo得到配色的靈感吧！：）
    | 檢舉 | Posted by doobop at 2005年03月14日 02:05
    是啊...
    | 檢舉 | Posted by emisjerry at 2005年03月14日 10:00
    cursor: pointer;

    手状鼠标，IE&NS兼容
    | 檢舉 | Posted by Fwolf at 2005年03月20日 17:35
    測試過確實正確。感謝Fwolf。
    | 檢舉 | Posted by emisjerry at 2005年03月20日 20:32
    香港做按鈕的網站 http://www.hkwebs.net/catalog/tools/buttonmaker/
    | 檢舉 | Posted by emisjerry at 2005年03月31日 10:03
    按鈕網站彙總 http://blog.roodo.com/bayangobi/archives/31175.html
    | 檢舉 | Posted by emisjerry at 2005年03月31日 10:05
    感謝你這篇文章～～
    我就直接拿ICON 去用了
    感謝萬分～～～～
    | 檢舉 | Posted by Evan Lim at 2007年01月3日 19:00
     
     


    回最上方