close


優質部落格，迴紋針老師的「Christabelle的藝想世界」，常常都會有好康、好玩的事物，
昨個兒迴老師居然開始充當紅娘，要為您搭起友誼的橋樑，如果有需要的人，記得趕緊去登記啊！

不過我要說的好康，不是這個「來電 50」啦！那是什麼咧？且聽我娓娓道來～

常在迴紋針老師家出沒的人一定有注意到，迴老師有掛了一個「收入網摘」的外掛，裡頭有 Google 書籤、智邦 MyShare...等等的，不過老師說這是 Java Script 的外掛還是啥 PHP 的程式，總之就是整包丟到 Server 上再去啟動就可以了；這樣看來，似乎在非自己架設的網站上就沒辦法玩囉？不，其實還是可以的，因為我從網頁原始碼中有看到語法，是可以讓無名之類的 BLOG 來使用，只是我一直都很懶，直到最近懶病稍有好轉現象，於是前晚才動手來整理一下這個部分。


我說的「呷厚倒休播」是這個加入書籤啦，不是「來電 50」...XD


如果依照迴紋針部落格原始碼抽離出來的語法來照用，雖然不是不可以，但是會有幾個問題：
  1. 圖片連結路徑不對，就算對了，圖在迴紋針的網站，吃人家花錢買的流量也不太道德。
  2. 迴紋針說 MyShare 和 Yahoo! Web 的圖是 jas9 畫的，沒徵求同意前不方便使用。
  3. 部分書籤頁面會在本文頁面開啟，跟我習慣不一樣，我習慣從新視窗／分頁開啟。
  4. 有幾個圖片的 title 和 alt 標籤不完整，死圖的時候會沒有替代文字。
根據這些問題，我做了一些小修正：
  1. 圖片放到自己或公用的空間；放無名相簿，非無名網站不能用，那用 flickr 應該可以吧？（其實是不可以）
  2. jas9 創作的圖，改成到各書籤官網抓圖修改。
  3. 改語法，把在同視窗開啟的敘述都改成在新視窗／分頁開啟。
  4. 把 title 和 alt 標籤的敘述補充完整，並且改了一些描述。
  5. 改變順序，為了尊重來源網站，所以把 MyShare 放第一個，中文的黑米放第二，...。
  6. 在用了二天之後，又加上了兩個還蠻多人用的書籤，technorati 和 digg。
昨天我先把語法 PASS 給愛咪測試使用，看看有沒有什麼問題，目前看來是一切正常；而後來跟迴紋針老師聊了一下，才發現原來他把 MyShare 放在排尾，是因為多數人慣用右手，這樣使用滑鼠會比較順手，看來我的「禮貌」變成「不禮貌」了～XD

好，重點來了，要怎麼樣才能在自己的部落格加入這個小玩意兒？只要把文末語法加入你的文章末尾即可～

但有幾件事還要特別提醒一下，以及徵求高手協助：
  1. 記得要註冊、登入各書籤網站，才可使用。
  2. 目前必須一篇一篇的貼，不知有沒有誰可以用 CSS 來搞個一勞永逸的辦法？當然如果 BSP 願意把這個小東西納入為標準功能就更方便了～
  3. 貼在 Banner 上，似乎是一勞永逸的辦法，但由於按了書籤按鈕後，系統會去抓你所在頁面的資料，一個不小心，很多人加的書籤都會是你部落格的首頁，而不是單篇文章，貼在文章第一行也會有類似的風險；所以建議「加入書籤」要放在首頁看不到，而必須點入文章後才看得到的地方。
  4. 不見得所有書籤按鈕都要放上你的版面，可以自行刪減；當然你也可以依樣畫葫蘆，增加其他的書籤貼紙，像是 blogmarks, blinklist, scuttle...等等的～
好，有興趣的人就試試，祝大家用得愉快囉～

補充說明：

★★ 2007/03/30 ★★
  1. 做了一下實驗，無名非付費會員，雖然可以貼上語法，圖案也會顯示，不過其語法會被系統改掉，變成死連結，所以意思就是：這個語法在無名裡還是只能給付費會員使用啦！唉～XD
  2. 非付費會員如果真要使用，也不是不行，只是會麻煩了一點；首先，你要有一個付費會員的朋友，然後把他加入共同作者，每當你發文時，就請這位共同作者修改文章，把這個語法貼到文末就行了（不要懷疑，因為在無名裡能不能用 Java Script，不是看該版面的所有者是不是 VIP，而是取決於「誰在用」，所以付費會員在非付費會員的網頁上一樣可以使用 Java Script，當然，目前也僅止於這種「夾帶式」的 JS 語法，不是每種都能用～）。

★★ 2007/03/31 ★★
  1. 如果你一開始就 Copy 這個語法去用，我有做些更正喔！MyShare, Yahoo! 以及 furl 改成非彈跳視窗，還有 Yahoo! 的網頁從英文頁改回中文頁，最重要的是，支援反白即為書籤摘要，即先在網頁反白一段文字，再按加入書籤按鈕，這段文字會出現在書籤的摘要中（原來分享的語法只有 MyShare 和 HemiDimi 有這功能，現在僅剩 technorati 沒這個功能，而 furl 裡則是中文摘要會變亂碼，不過中文標題正常）。
  2. 再新增一個「集書籤之大成」的按鈕 — AddThis，語法、結果如文末。用這個的話，除了 MyShare 和 HemiDemi，其他幾乎都可以刪了～XD 當然你也可以留下幾個可能常用的，這樣就不用按二個按鈕才能收入書籤，尤其是可以留下 Yahoo! 按鈕，因為 AddThis 裡的 Yahoo! 是連到英文網頁...:P 不過 AddThis 方便歸方便，還是有個大缺點，就是反白文字再按鈕，那段文字並不會成為書籤的摘要...

★★ 2007/04/01 ★★
  1. 聽說華文部落格不能忽視中國，所以再加上一個「百度搜藏」，這組語法同樣支援反白文字即摘要；一樣，語法、結果如文末。

★★ 2007/04/03 ★★
  1. 配合智邦 MyShare 程式的變更，再次更新語法。
  2. 因為 flickr 規定外連圖片一定要將連結導回 flickr，可是這樣就不能當書籤按鈕了，所以全面更換圖片連結位置，目前圖片置放於樣版國度（還是誰有空間要提供？:P）；放在 flickr 上的圖暫時不會拿掉，以免造成使用前版語法者的圖片連結失效。

★★ 2007/04/05 ★★
  1. 在 kiroro's Tech Blog 看到一個新的中文書籤網站—Fiigo，既然是中文的，當然要把它加上來；官方目前提供的語法並不支援「反白即摘要」，所以我就又改了一下，底下的語法是有支援的；kiroro's Tech Blog 有列出三個關於「網路書籤」的延伸閱讀，有興趣的也可以看看。

★★ 2007/04/11 ★★
  1. 經 timk 提醒國內還有一個大書籤網站－PChome，所以又加上了～當然，反白即摘要是一定要的。


針對部分的留言，容我再多說幾句話：
  • 第一點，原始碼是參考迴紋針的，這上文中已有說明，而且我 3/27 就已經開始使用，並且在 3/28 傳給 Amykaku 使用，這兩天有上我們 BLOG 的人應該有人有印象，誰先誰後不言可喻。

  • 第二點，原來的 Google 和 del.icio.us 是 location.href= 的語法，會在同視窗開啟，我通通改成 void window.open()，從新視窗開啟；如果有人跟我一樣（是「有人跟我一樣」，不是「我跟別人一樣」，這差很多），是否該稱之「英雄所見略同」？

  • 第三點，原語法在 alt= 的敘述各為「Google書籤、收入Y!MyWeb、Del.icio.us、收入furl、收入HemiDemi、收入MyShare」，我把「Google書籤」改為「Google Bookmarks」，「收入Y!MyWeb」改為「Yahoo! My Web」，其餘幾個則是把「收入」字眼刪除；而 title= 這部分，Google 和 del.icio.us 並沒有這一段，我都把它補上了，而內容則是和我改過的 alt= 敘述一致；如果有人跟我一樣，是否該稱之「太有默契」？

  • 第四點，重新排列這 6 個圖示（多的幾個是後來追加，其中 technorati 大家都知道它的份量，當然要加，Digg 則是中時電子報有用，因此想說有在用的人應該也不少，百度則是大陸最大站，華文部落格應該不能漏了它）；如果原來迴紋針是 123456，我改成 653412，學過排列組合就會知道 6 個圖示的排列方式有 6!=720 種；如果有人跟我一樣，是否該稱之「巧合」？畢竟這的確是比中樂透的機率高多了。

  • 第五點，也是最重要的一點：這語法沒有什麼抄襲不抄襲的，套句迴紋針的話，到最後還不都是「萬流歸宗」；就看你是參考誰的來改而已嘛！像我就是參考迴紋針的，沒必要怕這樣講會丟自己的臉，或是推了人家一把（迴紋針也不需要我推啦），就硬要說是參考其他啥網站的，其他網站的教學內容如果不是那麼「英雄所見略同」、那麼「有默契」，以及那麼「巧合」，不就好笑了嗎？
我不是知名部落客，但，還需要我寫更多條嗎？那個誰，有本事，就把我的新版本再偷走啊！不要硬拗了，知錯能改，善莫大焉啊～


在複製語法前，先看一下迴紋針老師說的話：「大家都掛了書籤貼紙，等了別人來自己家摘文章，可是有多少人因為喜歡別人的好文，而主動去摘它呢？……如果大家都只是裝了這個工具，孤芳自賞地希望別人來摘，自己卻吝於給別人掌聲與鼓勵，我想這也就沒什麼意義了。」共勉之～

語法如下，其中「加入書籤」這幾個字，還有 title="○○○"、alt="○○○" 都是可以隨自己喜好作更改；每個書籤按鈕前方已加上註釋文字方便篩選，你可以留下自己想要的書籤按鈕即可，也可以隨自己喜好變更它們的順序；如果你不喜歡這些圖，或是怕這些圖活不久會變成死連結，也可另存圖檔再上傳到自己的空間，更換語法中的圖片位址即可。之前已經使用舊版語法的人可以更新一下～

IE 使用者點選後端的圖示即可進行複製語法
加入書籤：
<!-MyShare->
<a href="javascript:(function(){d=document;w=window;t='';if(d.selection){t=d.selection.createRange().text;}else{if(d.getSelection){t=d.getSelection();}else{if(w.getSelection){t=w.getSelection()}}}void(window.open('http://myshare.url.com.tw/index.php?func=newurl&url='+encodeURIComponent(location.href)+'&desc='+escape(document.title)+'&contents='+escape(t),'newwin'))})();"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/1.jpg" title="MyShare" alt="MyShare" border="0"></a>

<!-HemiDemi->
<a href="javascript:desc='';via='';if(document.referrer)via=document.referrer;if(typeof(_ref)!='undefined')via=_ref;if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://www.hemidemi.com/user_bookmark/new?title='+encodeURIComponent(document.title)+'&url='+encodeURIComponent(location.href)+'&description='+encodeURIComponent(desc)+'&via='+encodeURIComponent(via)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/2.jpg" title="HemiDemi" alt="HemiDemi" border="0"></a>

<!-Fiigo->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://www.fiigo.com/bookmark/my.php?a=add_web&title='+encodeURIComponent(document.title)+'&url='+encodeURIComponent(location.href)+'&comment='+encodeURIComponent(desc)+'&ei=UTF-8',0));"><img src="http://www.fiigo.com/bookmark/pic/save_icon/icon-16x16-2.gif" title="Fiigo" alt="Fiigo" border="0"></a>

<!-Baidu->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://cang.baidu.com/do/add?iu='+encodeURIComponent(location.href)+'&it='+encodeURIComponent(document.title)+'&dc='+encodeURIComponent(desc)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/3.jpg" title="Baidu" alt="Baidu" border="0"></a>

<!-Google Bookmarks->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://www.google.com/bookmarks/mark?op=add&bkmk='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)+'&annotation='+encodeURIComponent(desc)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/4.jpg" title="Google Bookmarks" alt="Google Bookmarks" border="0"></a>

<!-Yahoo! My Web->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://tw.myweb2.search.yahoo.com/myresults/bookmarklet?t='+encodeURIComponent(document.title)+'&u='+encodeURIComponent(window.location.href)+'&d='+encodeURIComponent(desc)+'&ei=UTF-8'));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/5.jpg" title="Yahoo! My Web" alt="Yahoo! My Web" border="0"></a>

<!-PChome->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://search20.portal20.com.tw/x.jsp?t='+encodeURIComponent(document.title)+'&u='+encodeURIComponent(window.location.href)+'&n='+encodeURIComponent(desc)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/a2940.jpg" title="PChome" alt="PChome" border="0"></a>

<!-Del.icio.us->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://del.icio.us/post?title='+encodeURIComponent(document.title)+'&url='+encodeURIComponent(location.href)+'¬es='+encodeURIComponent(desc)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/6.jpg" title="Del.icio.us" alt="Del.icio.us" border="0"></a>

<!-Digg->
<a href="javascript:desc='';if(window.getSelection)desc=window.getSelection();if(document.getSelection)desc=document.getSelection();if(document.selection)desc=document.selection.createRange().text;void(open('http://digg.com/submit?phase=2&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)+'&bodytext='+encodeURIComponent(desc)));"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/7.jpg" title="Digg" alt="Digg" border="0"></a>

<!-Technorati->
<a href="javascript:void window.open('http://technorati.com/faves?add='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title))"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/8.jpg" title="technorati" alt="technorati" border="0"></a>

<!-Furl->
<a href="javascript:(function(){d=document;t=d.selection?(d.selection.type!='None'?d.selection.createRange().text:''):(d.getSelection?d.getSelection():'');var%20furlit=window.open('http://www.furl.net/storeIt.jsp?t='+encodeURIComponent(d.title)+'&u='+escape(d.location.href)+'&r='+escape(d.referrer)+'&c='+encodeURIComponent(t)+'&p=1');})();"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/9.jpg" title="furl" alt="furl" border="0"></a>

<!-AddThis->
<a href="javascript:void window.open('http://www.addthis.com/bookmark.php?pub=addthis&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title));"><img src="http://s3.addthis.com/button1-bm.gif" title="其他更多書籤" alt="其他更多書籤" border="0"></a>


最後，如果你想要將這個書籤語法分享給你的朋友，也可以在你的書籤之後加上一個使用教學的連結按鈕，像這樣：使用教學，語法如下：

<a target="_blank" href="http://www.wretch.cc/blog/CGS&article_id=11722738"><img src="http://web.caidiy.com/plate/files/myblog/person/make_template/cgs0102/1037//images/12.jpg" title="使用教學" alt="使用教學" border="0"></a>

繼續閱讀 Part II

延伸閱讀： (返回)
　網路書籤 Web2.0 Show
　網路書籤好幫手 Taiwan.CNET.com
　《Download！》功能強大的網路書籤 管理你有興趣的網站 MSN 台灣 3C 情報


加入書籤： MyShare HemiDemi Fiigo Baidu Google Bookmarks Yahoo! My Web PCHome Del.icio.us Digg technorati furl Windows Live Favorites 其他更多書籤

arrow
arrow
    全站熱搜

    CGS 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄