Aug 14, 2010

改變blog list內的小圖


網誌清單(blog list)顯示的小圖(thumbnail):
1.除了是blogspot,其餘的sina、yahoo、wordpress都不支援
2.一定是內文第一張相片/圖片
3.圖片必須經blogspot上傳(存放在http://picasaweb.google.com內)
4.不論原來的相片/圖片有多大,都只會縮小成為一張 72 x 72 pixel的小圖
4.橫向長方形圖片,一般都會顯示中間的部份
5.垂直的長方形圖片,它的處理較奇怪,不是中央部份,反而是較為高一點位置,但又未到最頂端

即是系統早已設定如何顯示那張小圖,要改都改不了,只能用技巧讓它去顯示自己想要的小圖式樣。




上一篇文章雖然有很多相片,但都是由javascript控制,所以系統應該不會找到一張圖片,再去顯示小圖,因此我特別做了一張小圖:
轉換到 Edit HTML 模式,看到是一堆原始碼:

然後改寫下面紅色部份的原始碼:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/_ZffFGp5sevw/TGM1xfoTFbI/AAAAAAAAA4w/0bPOBgtVQeY/s1600/mr_hk02.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/_ZffFGp5sevw/TGM1xfoTFbI/AAAAAAAAA4w/0bPOBgtVQeY/s1600/mr_hk02.jpg" /></a></div>
<div class="separator" style="display:none;" >
<a href="http://4.bp.blogspot.com/_ZffFGp5sevw/TGM1xfoTFbI/AAAAAAAAA4w/0bPOBgtVQeY/s1600/mr_hk02.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/_ZffFGp5sevw/TGM1xfoTFbI/AAAAAAAAA4w/0bPOBgtVQeY/s1600/mr_hk02.jpg" /></a></div>

更改了原始碼後,圖片便會隱藏了,但系統仍然會找到這一張圖片,並會顯示這一張小圖,因為它始終是文章內的第一張圖片。



如果內文有貼上視頻,但沒有什麼圖片,亦可以利用視頻本身的圖片。

視頻:http://www.youtube.com/watch?v=qrO4YZeyl0I
圖片:http://img.youtube.com/vi/qrO4YZeyl0I/0.jpg

紅色部份為視頻在YouTube的編號,先開啟了圖片,另存檔案,然後再貼在文章內。

花了這麼多功夫,攪了大半天,其實只是想讓自己的網誌出現在別家的網誌清單內美觀一點,對於自己網誌有什麼影響、好處?絕對沒有。

至於什麼人適合用?應該是無聊的人!(我,哈哈)

5 comments:

  1. 哈哈,咁下次你都試吓用囉!

    ReplyDelete
  2. 以我一把年紀,己經學到頭都腫哂

    ReplyDelete
  3. thanks very much, an idea that is both thoughtful and useful! :o)

    ReplyDelete
  4. naruto
    其實唔係好難咋?你咁鍾意點相,只不過多貼一張,加上你咁你咁多相都快獸,你可以好多篇都淨係cut快獸出嚟做thumbnail。

    best actor
    多謝晒,希望你都用得著。

    ReplyDelete