【部落格圈】自己做張漂亮貼紙

小婆喜歡「賞心悅目」的事物，部落格小貼紙也不例外。

部落格圈流行那種 80x15 像素的小貼紙，讓有點兒老花兼近視的小婆看得眼花撩亂，吸引不了小婆的目光，更不會想去點那麼小、看不清楚的東西。

昨天下午小婆也試了 Joaoko 提供的 My Cool Button，不知是小婆資質魯鈍，還是極端地吹毛求疵，想做張「Google Analytics」貼紙方便小婆去看訪客讀者特性分析，不是背景顏色不對、字距太大，就是成品字體變成了鋸齒狀。

還不如用小婆前幾天試出來的方法，自己做張漂亮的貼紙。

>.^


想要藉由部落格圈宣傳活動或增加人氣，提供貼紙語法是最便捷的途徑之一。

會引發小婆將貼紙語法稍作研讀的，就是這張「 319 鄉村兒童藝術工程」貼紙。

『我們不願見到台灣的孩子，
　　因為「外在環境」有了欣賞藝術的級距；
　我們不願見到鄉村的孩子，
　　因為「城鄉差距」喪失欣賞藝術表演的權利。』

這個「319 鄉村兒童藝術工程」活動立意甚佳，小婆大學時也參加過救國團文化服務隊，更是會共襄盛舉，免費替其宣傳。

但是當時任憑小婆在其官網內怎麼找就是沒看到「貼紙」語法，利用「Google 搜尋」也沒能立即找著。既然找不到，乾脆自己做一張。

不過，現在他們也提供了新的「Banner」語法（gif 檔），但龜毛小婆還是多加了兩個指令：「位置居中（div align="center"）」和「另開新網頁（target="_blank"）」。

<div align="center"><a href="http://www.319kidsmile.org/" target="_blank"><img src="http://www.319kidsmile.org/images/image01.gif" border="0" alt="孩子的第一哩路．First Mile, Kid's Smile" width="195" height="62" /></a></div>

<div align="center"><a target="_blank" href="http://blog.xuite.net/jason700804/bignose/12078644"><img alt="送好書到信義鄉" border="0" src="http://2.bp.blogspot.com/_4Ud38qIYlgk/RnlXHllwAeI/AAAAAAAABV4/GSKz9mNC2w4/s200/Hsin-YiBook.bmp" /></a></div>

其實看倌們仔細比較一下各家貼紙的語法，幾乎大同小異，也能舉一反三地做一張自己喜歡的連結貼紙：位置 → 連結 → 圖案

01. 位置：div align="center"
02. 連結：a href="http://連結網址" target="_blank"
03. 圖案：img src="http://圖檔.jpg .gif .bmp 或 .png"
　　alt="主題名稱" border="0" width="寬度" height="高度"

<div align="center"><a href="https://www.google.com/analytics/home/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfKbTmThZNOkiTQLAtAYy9xsMiQEsC5IKEYkaHzpTOWNMoc9SX02jbHh6YVxeCeUV7VWFUP5kDBKVjVuOmrC5617NB1TUCr4-91Cmn0lmLmz01rUULd1vVvH7GOdwQDGhYkHWEmQ/s200/Google+Analytics.bmp" border="0" width="200" height="57" alt="Google Analytics" /></a></div>

就以「Google Analytics」為例，步驟如下：

01. 先到 Google Analytics 網站，按鍵盤的「Shift + Print Scrn」
02. 開啟「小畫家」，按鍵盤的「Ctrl + V」
03. 利用「□ 選圖片的矩形部份，加以移動、複製或編輯」選取其網
　　頁左上角標誌，然後按鍵盤的「Ctrl + C」
04. 點選：檔案 → 另開新檔 → 否
05. 按鍵盤的「Ctrl + V」
06. 適當地調整圖案大小後，點選：影像 → 屬性，得知圖案的寬度
　　（width）和高度（height）
07. 點選：檔案 → 儲存檔案
08. 張貼圖案至部落格文章內或 Flickr
09. 於上述貼紙樣板之對應位置輸入「連結網址」、「圖檔位址」、
　　「主題名稱」、「圖案寬度」和「圖案高度」
10. 完成了簡易靜態式的貼紙語法

>.^

那麼怎樣將語法放入文章中或邊欄裡供訪客讀者拷貝帶走？這也是昨天小婆經查訪「HTML Code Tutorial」後試驗出來的：

<textarea name="Sticker Code" rows="5" cols="50">【貼紙語法貼入此處】小於符號 /textarea 大於符號

分享兩個動態式的幸福貼紙，怎麼做出來的，小婆還不會！有興趣的看倌們，請自行去問創作者囉～

<center><embed src="http://wawa.club.hinet.net/event/20060712/flash_130x170_3.swf" width="130" height="190" wmode="transparent" type="application/x-shockwave-flash"></embed></center>
Source:《守護愛情．享受 Xuite 個性歡樂包活動》

<center><embed src=http://i175.photobucket.com/albums/w155/toyaa88/dodoplay2.swf quality="high" width="150" height="200" wmode="transparent"></embed></center>
Source:《Happydodo 快樂多多》

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

◎ 延伸閱讀 ◎

【這是小婆利用 My Cool Button 的作品】

《部落格貼紙產生器》by 迴紋針／
　Tool: Brilliant Button Maker

《輕鬆４個步驟就能做出 Web 2.0 樣式的按鈕》by Joaoko／
　Tool: My Cool Button

《信箱貼紙製造器：愛搞部落格社交的格長必備》by Poki／
　Tool: Nexodyne

>.^