WordPress 2.0 Duke 前兩天正式釋出，不過，按照慣例，有興趣嘗鮮的人大概在正式釋出之前大概都已經先玩過了。WP 2.0 的新功能之一，就是對於照片上傳功能做了一定的改寫，將原本在選單上的「上傳」（Upload）這個選項，移到了發表文章的介面中，稱為是「行內」（inline）的上傳，與之前的版本或其他的網路出版工具相較，之前的照片上傳功能，就是把照片檔案傳到伺服器的某個目錄當中，而 WP 2.0 會在上傳之後，為這張照片發表一篇類型為附件（Attachment）的文章（post，在 WP 的設計中，文章分成「已發表」、「草稿」、「個人私有文章」、「靜態網頁」，以及新增的「附件」），將這篇「附件文章」，當成你正在處理的這篇文章的附件，而在這篇文章當中，寫入關於這張照片的相關 metadata。

例如，如果你設定的文章網址為 http://example.com/post/mypost ，當你上傳一張照片，並且將照片的標題設定為 myphoto 的時候，那麼，當你連到了 http://example.com/post/mypost/myphoto ，就會以一個獨立的頁面，顯示附件的內容。另外，雖然在官方模板中還沒有提供，不過你可以在自己的模板中，增加一個叫做 attachment.php 的 php 檔案，當成是顯示附件的模板。

不過，如果你只是把 page.php 或 single.php 複製成 attachment.php，應該是不會出現照片的，因為照片的網址並不是存在於 post_content 欄位裡頭，而是在一個新增的欄位 guid 裡。所以在模板的 loop 裡頭，試試以下的程式碼，用 img 語法顯示照片：

if($post->guid && strstr($post->post_mime_type, "image")) {
    echo '
';
}

說到 guid，如果你已經升級到了 WP 2.0 ，而且設定了固定網址（permalink）的結構，可以發現，在之前的版本中，會在 .htaccess 檔案中增加了非常多的轉旨規則，可說是密密麻麻，但是在 WP 2.0 中，.htaccess 檔案就只有五行而已，就是因為 guid。系統會在每一篇文章的資料中，增加一筆叫做 guid 的資料，guid 就是這篇文章的網址，.htaccess 的規則就是把所有的網址都丟給 index.php 判斷，index.php 就會去資料庫中比對是否有符合這個位置的文章，然後就把文章找出來，而如果是照片，guid 裡頭，就是照片檔案的網址。

因為照片是被當成文章的附件處理，所以，每一張照片都有對應到「這張照片是屬於那篇文章」的 metadata（實際上，就是這個附件文章的上層文章的 ID – post_parent），那麼，我們還可以做這樣的事情：隨機選出幾張照片，當成照片列表，然後點到照片的鍊結上，就可以到這張照片的所屬文章了。換言之，就是一個「隨機文章」的圖片版，會比單純的「隨機文章」功能看來華麗些。

作法大概是這樣。比方說，我們要把這個照片列表，放在一個叫做 #photolist 的 div 裡頭，我們先在 css 樣式表中定義一下 #photolist：

#scroller a {
   display: block;
   width: 100px;
   height: 100px;
   border: 1px solid #CCC;
}

這個樣式的內容為，div 下的每個鍊結都是 100px 寬高的方塊，然後有一個 1px 寬的外框，而這個樣式表的設計，會將照片列表以垂直的方式呈現出來，如果要改成水平的，大概就是要加上一個 float 語法。—然後，我們要寫一個 function，看看是要放在 my-hacks.php 或是寫成一個 plugin，都可以。

function photolist(){
   global $wpdb;
   $images = $wpdb->get_results("SELECT ID, post_date, post_title, guid, post_parent FROM $wpdb->posts WHERE post_status = 'attachment' AND left(post_mime_type, 5) = 'image' ORDER BY RAND( ) LIMIT 5", ARRAY_A);
   /* ORDER BY RAND() 代表隨機選擇， LIMIT 5 代表選擇五張照片，
      這邊也可以寫成是要用最近五篇文章之類的語法。 */
   foreach ( $images as $key => $image ) {
      $attachment_ID = $image['ID'];
      $meta = get_post_meta($attachment_ID, '_wp_attachment_metadata', true); 
      $image = array_merge($image, $meta);
      if ( ($image['width'] > 128 || $image['height'] > 96) && !empty($image['thumb']) && file_exists(dirname($image['file']).'/'.$image['thumb']) ) {
         $src = str_replace(basename($image['guid']), '', $image['guid']) . $image['thumb'];
         $images_script .= "src".$attachment_ID."a = '$src';\nsrc".$attachment_ID."b = '".$image['guid']."';\n";
         $thumb = 'true';
         $thumbtext = $__thumbnail_on;
      } else {
         $src = $image['guid'];
         $thumb = 'false';
         $thumbtext = $__no_thumbnail;   
      }
      $href =  get_permalink($image['post_parent']);
      /* 如果改成 get_permalink($image['ID']) ，就是直接前往這張照片的附件文章網頁 */
      if($image['height'] && $image['width']) {
         if($href) echo ""; else echo "";
         echo " $image['width'])
         echo ' style="height: 90px; margin-top: 5px;" ';
         else  {
            $height = (int)(($image['height'] * 90) / $image['width']);
            $margin = (int)(100 - $height)/2;
            echo ' style="width: 90px; margin-top: '.$margin.'px;" ';
         }
         echo " />";
      }
   }
}

這個 function 最後幾行的用意，在於不讓 img 語法中的照片變形，如果照片是高大於寬，那就是將高度設為 90px，上下留 5px 的間距，反之，如果是寬大於高，那就是寬設為 90px，另外算出上下應該是怎樣的間距。最後，只要在模板中插入：

就可以了。