hsuyo BLOG

什麼是 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

Author: hsuyo @ 10:39 pm, 03/14/2005
Tags: asides, hacks, wordpress
Related Tags: No Tags
Category: WP 速記. Responses are currently closed, but you can trackback from your own site.