法則69 投稿者別にアイコンやデザインを変更する

class名に投稿者名を設定するテンプレートソース

<MTEntries lastn="10" sort_order="descend">
<div class="entry<$MTAuthorName$>">
<h2><$MTEntryTitle$></a></h2>
<$MTEntryBody$>
</div>
</MTEntries>

投稿者ごとにデザインを設定するCSSソース

/* カテゴリごとに背景色を振り分ける*/
/* ユーザーごとに異なる色を指定*/
div.entryKato {
    border-top: 2px solid #CC0066;
}
div.entryHirasawa {
    border-top: 2px solid #0066FF;
}
div.entryRyoken {
    border-top: 2px solid #33CC99;
}
/* ユーザーごとに異なるアイコンを指定*/
div.entryKato h2 {
    background: url(/img/icon_user_a.gif) 0 0 no-repeat;
}
div.entryHirasawa h2 {
    background: url(/img/icon_user_b.gif) 0 0 no-repeat;
}
div.entryRyoken h2 {
    background: url(/img/icon_user_c.gif) 0 0 no-repeat;
}

• 第4章 Webサイトの価値を高めるデザインの法則