顯示具有 Blogger 標籤的文章。 顯示所有文章
顯示具有 Blogger 標籤的文章。 顯示所有文章

修改 Blogger 網址旁的小圖片(Favicon)

2010年8月25日 星期三 張貼者: 夢無痕 0 意見

隨著Google的盛行使用Blogger人數也越來越多,有時瀏覽器多開了幾個 Blogger 的分頁,整體看起來都是橘底白字的 B,自己部落格要是混在其中,頗為難找。轉念之間,我何不做一個有特色的圖示,既顯眼又便於區別且有個性,也許還能讓訪客留下一點深刻的印象。

第一步
自行製作小圖片大小約為16*16 存成ico檔,或者至下列網站尋找你喜歡的圖片。
ICONFINDER

之後可透過下列網站將您的圖片轉換成 Favicon 適合使用的大小圖片。
FavIcon from Pics

第二步
將第一步產生的小圖示放到某個網頁空間。我是放到 Google Page Creator,有 100MB 的容量。把圖示放在 Google Page Creator,記下小圖示的網址,以下會用到。


第三步
請選擇「版面配置」-> 「修改 HTML」。記得先備份版面。在版面中找到 </head>,在上一行加入以下程式碼,就完成了。

一般網頁要改小圖示也可以仿照以上三步驟。

最後我改成LINUX的胖企鵝 aethanyc,還滿顯眼的。自己的部落格終於有專屬的小圖示了。

...繼續閱讀

歡迎分享


標籤: ,

陽春版HTML碼轉換小工具

2010年8月18日 星期三 張貼者: 夢無痕 3 意見

      當編寫部落格時常因為要分享一些html程式碼供給別人參考時,常會被Blog系統誤認導致無法正常顯示程式碼,因此只要透過此工具將想要顯示在Blog的html程式碼貼上去,轉換後再將轉換結果貼在你的育發布的網誌上即可正常顯示。

...繼續閱讀

歡迎分享


標籤:

Blogger網誌 新增Facebook、Buzz、Plurk、Twitter 按鈕

2010年5月15日 星期六 張貼者: 夢無痕 4 意見

        上google了一整天,查詢了一整個上午終於找到如何在我的Blogger上新增 Facebook、Buzz、Plurk、Twitter 按鈕 ,尤其看了jimmyyen大大的網誌,也詢問了jimmyyen一些相關技術,jimmyyen相當熱心也提供了不少相關技術,在此再鄭重感謝一次。
        想要在自己的部落格添加 Facebook、Buzz、Plurk、Twitter 按鈕,只要將以下程式碼貼在Html裡即可需展開小裝置範本需打勾),至於使用者想在部落格哪顯示此四個按鈕可自行設定,我個人是放置於各個網誌內文下如果要跟我一樣可以放置於此段語法的之下</data:post.body>


按鈕語法如下:

<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank' title='分享至 Facebook'><img src='http://www.czmarry.tw/social_networking_iconpack/facebook_32.png'/></a>

<a expr:href='&quot;http://www.google.com/buzz/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;srcTitle=&quot; + data:blog.title+ &quot;&amp;srcURL=&quot; + data:blog.homepageUrl ' target='_blank' title='谷文至 Buzz!'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfnZfbzuNEZaYrBQuFVSgNlMYva-pX1I2qjFtR7VC35XQoRY6BBO6PxySDXMsbZiysJfw0HpH4PAisNaUG9FaYEfVmbgejmNoYM8oG5l1ZhZuzpAgdYSkgOIS_m7utJT2_Fx1C2KTb0u98/s800/google_buzz-17.png'/></a>

<a expr:href='&quot;http://www.plurk.com/?qualifier=shares&amp;status=&quot; + data:post.url + &quot; &quot; + &quot;(&quot; + data:post.title + &quot;)&quot;' target='_blank' title='噗文至噗浪'><img src='http://www.czmarry.tw/social_networking_iconpack/plurk_32.png'/></a>

<a expr:href='&quot;http://twitter.com/?qualifier=shares&amp;status=&quot; + data:post.url + &quot; &quot; + &quot;(&quot; + data:post.title + &quot;)&quot;' target='_blank' title='推文至Twitter'><img src='http://www.czmarry.tw/social_networking_iconpack/twitter_32.png'/></a>

...繼續閱讀

歡迎分享


標籤:

新增網誌MSN即時通

2010年5月7日 星期五 張貼者: 夢無痕 0 意見

        這個週末禮拜日就是母親節了,很久沒有回家給媽媽看因此就回台中了,在家裡生活作息就變的正常多了,在宿舍以往都是兩點多才睡,但是在家裡莫名其妙很早十二點就睡覺囉!!在家閒閒就想說上網買些書來看,去他人的網誌看看書本的評價,其中在一個網誌裡面到了一個好物,就是可以在網誌上新增MSN 即時聊天區塊(如右側)
我個人認為這是個非常強大且實用的功能,因為我幾乎整天都掛著MSN,可以讓來觀看我網誌的朋友們有任何意見或問題可以透過此功能,即時跟我聯絡。(前提我要在線上)

        第一步請先在此註冊登入申請MSN網誌語法...這裡
       第二步在1的框內打勾儲存進行第三步
       第三步依照只是操作

...繼續閱讀

歡迎分享


標籤:

Blogger 3D標籤雲

2010年4月25日 星期日 張貼者: 夢無痕 1 意見

     前幾天Java看累了,就到處看看網誌看有什麼新奇的小工具可以安裝在自己的網誌上讓自己的網誌更炫。逛著逛著在黃河水的網誌中看得好一個超炫的工具,那就是3D 標籤雲(如右側)原名是WP Cumulus,由Flash + Actionscript寫成,原理就是把標籤雲套用在球狀的Flash裡面,可藉由球體的轉動選則你所想要看的網誌類別。

      剛開始接觸時一直反覆的看著 Mr. Fu大哥那篇網誌 ,我照著說明做可是就是一直沒有實現3D標籤雲的效果。看完感覺內容寫得很跳Tone,我想 Mr. Fu大哥大概把會去觀看他網站的參觀者都當成網頁程電腦高手或著Hack吧!省略了蠻多步驟的。因此我為了造福讓來我網誌參觀人們,現在我就來一步一步的慢慢介紹給有此福氣你。
     首先先準備ADOBE CS3 (據我所知CS4好像不行,或者我不會用) 因為此套件原本是英文版如要顯示中文,需要編碼成中文,因此透過CS3的專案管理來新增編碼腳本...(此處可以下載)

  1. 接下來製作專屬的flash
    製作前請先到官網下載原始碼,打開tagcloud.fla檔,左上角會有"Tag"點選之後,下方會出現"內嵌字體"按鈕。點選"內嵌字體"。把所有的選項全部消除,不然製做出來的swf檔會夭壽大(說不定別人看完你的網誌都還沒顯示出來喔)。

  2. 因此我們只要把我們的標簽內容全不輸入即可,像我會用到這些文字因此我只要在框內輸入
    [ Windows Linux1234567890證照哩哩扣扣程式JavaMicorsoft旅遊生活點滴電腦軟體xpBloggerCCNA國際心情寫照資訊敗家產品故事分享書籍語言嘴砲空間 ]。
    案下Ctrl+Enter如有出現字即可代表現階段成功。
  3. 接下來是讓我們的3d標籤雲具有中文編碼的功能,請在Flash編輯器裡開啟tagcloud_as3.flp檔,然後把剛剛下載的UrlUTF8Encoder.as加的專案裡,把中文編碼的檔案存放在com\roytanck\wpcumulus裡,也就是跟Tag.as放一起。
  4. 接著編輯Tag.as檔內的程式碼有三個地方需要做修改
    第一新增以下這一行


    import com.roytanck.wpcumulus.UrlUTF8Encoder;
    第二 搜尋 format.font = "Arial";用來更改在Client端呈現的字體(Clien需要也有此字體檔)


    var format:TextFormat = new TextFormat();
    format.font = "微軟正黑體";
    format.bold = true;
    第三 搜尋 private function mouseUpHandler( e:MouseEvent ):void將 .. :void{} 括號內的函式取代為:


    code: var request:URLRequest = new URLRequest(UrlUTF8Encoder.urlencodeUTF8(_node["@href"]) ); navigateToURL(request,"_self");
    
  5. 將Tag.a存檔然後把Flah在匯出一次(Ctrl + Enter)成 tagcloud.swf,當你打開swf檔時,會完全沒字,這是正常情況不用擔心。
  6. 接著上傳 tagcloud.swf 檔案製網頁空間,到google收尋一下就很多,個人推薦google協作平台
  7. 最後一步驟將下列程式碼貼在你的網誌範本裡
    紅色部分修改你swf檔的網路途徑
    綠色部分分別為寬和高(可自行調整)
    紫色部分為背景顏色


    <b:widget id='Label99' locked='false' title='Labels' type='Label'>
    <b:includable id='main'>
    <b:if cond='data:title'>
    <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <script src='http://yfj750106.vndv.com/swfobject.js' type='text/javascript'/>
    <div
    id='flashcontent'>Blogumulus by <a
    href='http://www.roytanck.com/'>Roy Tanck</a> and
    <a href='http://www.bloggerbuster.com'>Amanda
    Fazani</a></div>
    <script type='text/javascript'>
    var so = new SWFObject(&quot; 
    http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, 
    &quot;tagcloud&quot;, 
    &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, 
    &quot;#ffffff&quot;);
    // uncomment next line to enable transparency
    //so.addParam(&amp;quot;wmode&quot;, &quot;transparent&quot;);
    so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
    so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
    so.addVariable(&quot;distr&quot;, &quot;true&quot;);
    so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
    so.addVariable(&quot;tagcloud&quot;,
    &quot;<tags><b:loop values='data:labels'
    var='label'><a expr:href='data:label.url'
    style='12'><data:label.name/></a></b:loop></tags>&quot;);
    so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
    so.write(&quot;flashcontent&quot;);
    </script>
    <b:include name='quickedit'/>
    </div>
    </b:includable>
    </b:widget>
    
  8. 最後的最後恭喜囉!!!!

...繼續閱讀

歡迎分享


標籤:

Blogger 網誌文章可開啟/摺疊

2010年4月24日 星期六 張貼者: 夢無痕 0 意見

        接觸了Blooger幾天下來,發現網誌文章每一頁都是全開的,因此造成首頁的整體感看起來非常的冗長,因此上網google了一下,在這個網頁-Not My Business-找到了解決方法。
修改方法如下 :
        一. 控制主頁 > 版面配置 > 修改 HTML > 把 展開小裝置範本 打勾
        二. 把以下程式貼在</head>上面


        三.接著把紅色部份的代碼插入,而綠色的代碼可以改為自己想要的中文字,最後儲存範本。(有些範本會沒有uncustomized-post-template,是正常情況所以請依各個網誌架構而異)
<b:includable id='post' var='post'>
<div class='post uncustomized-post-template'
 expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>

<div class='post-header-line-1'/>
<div class='post-body'>

<b:if cond='data:blog.pageType == "item"'>

<p><data:post.body/></p>

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a href='javascript:void(0);' 
expr:onclick='"javascript:showFull
(\"post-" + data:post.id + "\");"'>
Read More...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a href='javascript:void(0);' 
expr:onclick='"javascript:hideFull
(\"post-" + data:post.id + "\");"'>
Summary only...</a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
       六. 設定 > 格式 裡把下面語法放到最下面的文章範本裡,當新增文章時,自己調整要顯示文章的部份。
顯示文章的部份

隱藏文章的部份

...繼續閱讀

歡迎分享


標籤:

Blogger 模板

2010年4月21日 星期三 張貼者: 夢無痕 0 意見

超開心的!!
終於找到我喜歡的模版了,因為這可是我人生的第一個部落格喔!所以不得不好好的挑選,當然既然找到就趕快給他套用上去吧!


呵呵!!有好東西就一定要跟大家分享啊,不然就天理難容了
這是我找到的模版網址 重點是免費的喔!!!

...繼續閱讀

歡迎分享


標籤:

在Blogger新增背景音樂

2010年4月16日 星期五 張貼者: 夢無痕 8 意見

在右上角新增小工具的新增一個HTML/Java script
貼上以下兩個音樂播放器其中一個程式碼即可

  • 他會先把音樂下載好才播放,但是如果音樂檔案比較大的話,就可能需要等待一段時間才播放。
<embed src="http://sites.google.com/site/aronggolife/play.mp3(貼上音樂網址)"
width="200"
height="20"
type="audio/mpeg">
</embed>



  • 他會邊下載邊播放,不過如果頻寬不穩的話,可能會斷斷續續一段時間喔!!!
<embed type="application/x-shockwave-flash"
src="http://eting.up.seesaa.net/player/dewplayer-multi.swf"
width="240"
height="20"
flashvars="son=http://sites.google.com/site/aronggolife/free.mp3(貼上音樂)&amp;
autostart=1&amp;
autoreplay=1&amp;
bgcolor=FFFFFF">
</embed>
如果不想"自動"播放可以移除這個
autostart=1&
如果不想"重複"播放可以移除這個
autoreplay=1&

...繼續閱讀

歡迎分享


標籤:

Test

張貼者: 夢無痕 0 意見

<html><body>
test
</body></html>

test

...繼續閱讀

歡迎分享


讓Blogger可以貼程式碼

2010年4月15日 星期四 張貼者: 夢無痕 0 意見

研究了一整個早上,終於研究出來囉!!!
可支援
Bash/shell、C#C/C++CSSDelphiDiffGroovyJavaScriptJavaPHPPlain TestPythonRubySQLVBXML
只要將以下的程式碼,貼在Blog底圖貼上

<html><body>
Here!!!
</body></html>

以下這裡。




之後如果要貼程式碼
只需要在
這裡貼上

就可以實現顯是程式碼且不會被系統默認了,而且還有顯示行數讓程式閱讀起來更加方便有條理。

...繼續閱讀

歡迎分享


標籤: