幫 WordPress 的最新文章加上 new 圖標
大家應該有發現最近只要本站一有新文章更新，該篇新文章標題的右方就會顯現一個閃動的 new 圖標（如上圖），現在我就在這裡跟大家分享一下我的作法，這是我在對岸網友流年觀影的博客看到的教法，這裡我就借花獻佛一下囉 
其實很簡單，我只是按照流年觀影提供的程式語法，把它加在我的 index.php 檔案裏，以下是我的語法：
<div style="float: right; margin: 8px 5px -5px"> <?php $t1=$post->post_date; $t2=date("Y-m-d H:i:s"); $diff=(strtotime($t2)-strtotime($t1))/3600; if($diff<24){echo "<img src='圖標網址' alt='24小時內最新發表'>";} ?></div>
記得先自己用 PhotoShop 做一個 new 圖標，或是使用 Ulead GIF Animator 做一個會閃動的 gif 圖檔，如果都不會做，請自行 Google 搜尋 new 圖標囉！接著將圖標檔案上傳到你的主機空間裏，然後把上述語法的『圖標網址』部份換成你的圖標網址即可，然後將語法中的 24 換成你想維持的時間數，例如 12，這個數字部份就是代表文章發表時間，我是設定 24 小時之內發表的文章，所以我還是維持 24 的數值，你就看你自己要設定幾小時囉！
再說明一下，如果你想將圖標顯示在標題左方，請將語法裏的 float: right 改成 float: left 即可。
至於非自己網站的連外網址總是在新分頁開啟的方式，則是借鏡海芋小站這篇文章的教法，大家不妨看看。
這是採用了目前最流行的 jQuery 語法來達成的，我自己是非常簡單的在我使用的主題 js 檔案裏加上以下這段語法：
$("a").click(function(event){ $("a").not("[href*=blogs.carrielis.com]").attr("target","_blank");});
其中那個網址部份，請你們自行改成自己部落格的網址，最主要的其實就是那個 "target","_blank" 相信熟悉 HTML 語法的人對它都不陌生吧！這段語法簡單就是說，只要跟你部落格無關的連外網址，點擊下去都會以新視窗或新分頁開啟。
如果你跟我使用的主題一樣，請在 yinheli.js 這個檔案搜尋 //out links 字串，主題作者原本就有寫下這個功能，你可以自己修改，記得把 /* 和 */ 刪除，就可以使用此功能了。如果你是使用其它主題，請在 頁首 (header.php) 檔案裏先寫下
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
接著再在底下寫下我上面提供的語法，這樣就可以囉！
最後要再更新我曾經提過的 Tab pane 功能，也就是我側邊欄的那個 Tab 功能（如下圖），這裡我也曾經使用過 jQuery 的 tab 功能，但後來還是徹掉了，因為我覺得那個功能會與本主題其它功能相衝，也會跟一些插件衝突，所以我還是用回這個 Tab pane。
側邊欄的 Tab Pane 功能
一樣，我們還是去原作者網站下載這個 JS 元件，然後把它上傳到你主機中的主題目錄之下。之後，把以下語法加入你頁首 (header.php) 檔案裏
</head>
之前：
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/tabpane/js/tabpane.js"></script> <link type="text/css" rel="StyleSheet" href="<?php bloginfo('template_url'); ?>/tabpane/css/tab.webfx.css" />
接著使用 Widgets（模組）的方式，在你的側邊欄加上 tab pane，同樣也是使用下述語法：
<div class="tab-pane" id="tab-pane-1"> <script type="text/javascript"> var tabPane1 = new WebFXTabPane( document.getElementById( "tab-pane-1" ) ); </script> <div class="tab-page" id="tab-page-1"> <h2 class="tab">General</h2> <script type="text/javascript"> tabPane1.addTabPage( document.getElementById( "tab-page-1" ) ); </script> This is text of tab 1. This is text of tab 1. This is text of tab 1. This is text of tab 1. </div> <div class="tab-page" id="tab-page-2"> <h2 class="tab">Privacy</h2> <script type="text/javascript"> tabPane1.addTabPage( document.getElementById( "tab-page-2" ) ); </script> This is text of tab 2. This is text of tab 2. This is text of tab 2. This is text of tab 2. </div> </div>
記得把
<h2 class="tab">General</h2>
中間的 General 改成你要的 tab 名稱，還有把
This is text of tab 1. This is text of tab 1.
This is text of tab 1. This is text of tab 1.
改成你的程式代碼，這樣就可以囉！
文ｂｙ覺非／各種小功能就是這樣一點一滴建構出來的喔！
飛翔於文字國裏的蝴蝶，我是愛寫文的女子，不要看我的人，請你看看我的文，那裡面全是我的心．和我想對你說的話……
StartOver．回。到。原。點 http://blogs.carrielis.com
【歷史上的今天】
- 創作│《情定水雲軒》。第六章．之二。【長篇連載小說】 - 2009
您必須保留原作姓名標示
您不得為商業使用本著作
您不得改變或改作本著作
额大陆不支持facebook~~没机会
@xD~碳 如果我沒有記錯的話，
"alt"代表的是圖片顯示不出來時所呈現的文字，也是圖片要給搜尋引擎的含意，讓搜尋引擎不會被這些HTML代碼誤解擾亂、進而影響了網站的SEO。至於
"Title"則是網址連結所要呈現給搜尋引擎得知的意義，讓搜尋引擎知道這個跳轉會連結到哪裡去。"alt"和"Title"所代表的含意原本就不一樣喔～另外，你說火狐顯示不出
"alt"的圖標，但是我所使用的就是火狐啊！顯示很正常，並不會不能顯示喔！alt=’24小時內最新發表，alt建議換成title
因為火狐顯示不出alt，title就能顯示，改一下吧xD
@阿婆 其實我這裡只要你輸入連結網址就會自動顯示的，並沒有被當成垃圾評論呀！
我會試試看，謝謝你提供的資訊喔
@Carrie
http://wordpress.org/extend/plugins/commentwitter/
我在本地試過，有一些ajax評論插件會有沖突，但不知你的這個會不會。你可以先在本地試一下，安裝調用好了自己給自己一個評論，看會不會有異常現象。
我不敢用超鏈接，怕被spam了。
@阿婆 呵，也不算怎麼折騰啦，就是找出自己究竟想要甚麼效果，找出來研究一下就用上了
↑給個網址吧～
PS：還有一些可以同時把評論更新到Twitter的插件，你也可以試一下噢。
@Arno Ruan 我之前有用過，不過好像會和我主題裡面不曉得哪一個 jQuery 功能起衝突呢！沒關係，現在這個 Tabpane 也很好用，顯示速度也挺快。
@拆組達人 OK，那就等你更換版型時再來使用這些我介紹的功能吧
@SMILE 哈，我不是老師啦，只是愛跟大家做分享，我算是比較雞婆的人而且又健忘，所以記在這裡做個備忘錄囉
最近考慮換版型了(已使用超過三個月)
所以這個功能到時候再回來爬文參考！^^
感謝分享！
jQuery 的 tab 可以參考我的作法，變數$我都換掉了，調用不會有衝突喔。^_^