什麼是 Aside? 可以看到 Photo Matt 中,許多沒有標題的文字,就是使用 Matt 的 On Asides,相關應用亦可見 中文 WordPress 右方的資訊欄。然而,原本 WP 1.2 的 Aside 方法在 WP 1.5 之後已經失效了。
Max 上星期在留言中提供了 WordPress 1.5 使用 Asides,我在自己的機器上測試後可以使用,以 WP 1.5 預設的 Kubrick 主題,提供安裝筆記。
事前準備:
由於這個方法會修改 theme 當中的 index.php 檔案,建議先將其備份起來。
Step 1.
編輯 theme 底下的 index.php,尋找:
<?php while (have_posts()) : the_post(); ?>
在其之後加上:
<?php if (in_category(10) && !$single) { ?>
<ul class="asides">
<?php echo wptexturize($post->post_content); echo ' '; comments_popup_link('(0)', '(1)', '(%)')?> <?php edit_post_link('(e)'); ?>
</ul>
<?php } else { ?>
其中 10 就是會顯示成 Asides 的分類 id,你可以在管理介面的 管理 > 分類 中找到。
註: 原文為有加上 <li> 標籤,但我把它刪掉了。
Step 2.
同樣修改 index.php,於第一行加上:
<?php function stupid_hack($str) {
return preg_replace('|</ul>s*<ul class="asides">|', '', $str);
}
ob_start('stupid_hack');
?>
Step 3.
還是在 index.php 中尋找:
<?php endwhile; ?>
將其修改為:
<?php } endwhile; ?>
存檔後,Asides 的效果即大致完成。
Step 4.
以下為使用 CSS 修飾,參考這裡的作法,修改 style.css,選擇性加入:
/* This is the styling for asides*/
ul.asides {
border: 邊框;
font: 字型;
font-size: 字型大小;
font-color: #字型顏色;
background: #背景顏色;
background: URL(背景圖片) repeat center;
margin: 外距;
padding: 內距;
}
/*just to make it sit pretty*/
/* to change the links: */
ul.asides a {
text-decoration:none;
}
/* end stylling for asides */
註: 若於 Step 1. 有使用 <li> 標籤,則這裡的 ul.asides 應更改為 ul.asides li