Right Bower

【ダウンロード】　※サンプルページはこちら
・skin_chai_g（lzh）
・skin_chai_g（zip）

WDP用スキン「CHAI」とおそろいのWGPスキンです。
ご要望をいただきましたのでWGPスキンにも挑戦。
１カラムではありません。（あまり意味がないと思えましたので）

【ダウンロード】　※サンプルページはこちら
・skin_maru（lzh）
・skin_maru（zip）

角丸で記事全体を囲んだ２カラムスキンです。画像使用。
記事を画像で囲みたい、という方のサンプルとしてもどうぞ。

+ + + + + + + + + + + + + + + + + + + + + + + + + +
クロスブラウザ対応に疲れ、現実逃避で作ったスキン。
素直に２カラムにすれば苦労はしなかったのかと実感しました…。

【ダウンロード】　※サンプルページはこちら
・skin_bb（lzh）
・skin_bb（zip）

１カラムスキン「BB」の修正版です。Web Diary Pro4.33以上、
「ナビゲーションを記事の前に表示」をONにしてご使用下さい。

○「ナビゲーションを常に表示」で主要ナビの常時表示可能。
　（カレンダー＆新着ミニ画像のみ未対応）
○「.today」が表示されるようになった
○IE5以上、Firefox1.0以上、Netscape6以上、Opera7以上に対応。
　Firefox、Macでの表示崩れを修正。

※「BB II」ではJavaScriptをMugiさんのものから
　Dynamic Driveさんのものへ変更しました。
　旧「BB」からバージョンアップされる方は、スキンを上書きした後
　skinフォルダ内の「popup2.js」を削除してください。

※旧「BB」や他のスキンからの移行する際、
　HTML書き出しをONにしている場合、必ず「サイトの再構築」を
　行ってください。

※「Web Diary Proのコメント欄に絵文字をつける」のフォロー記事。
　コメント欄絵文字を実装後にお試しください。

Web Diary Proの環境設定で、
「ログの表示設定」→「記事一覧にコメントの内容を表示」を
「表示する」に設定していると、
コメント欄につけた絵文字が[♪]のようになり表示されない、
ということがありましたので、解決策を。

１．「skin＞diary.html」を開く

２．<!--SKIN_CMT_HEAD_START-->～<!--SKIN_CMT_HEAD_END-->の
　　間に以下の強調部分を追加。

<!--SKIN_CMT_HEAD_START-->
<div class="list"><div id="comlist">
<h4>コメント一覧</h4>
<dl>
<!--SKIN_CMT_HEAD_END-->

３．<!--SKIN_CMT_START-->～<!--SKIN_CMT_END-->の
　　間にある ${ARTICLE_TEXT} を以下のように<div>で囲む

<div class="com_text">${ARTICLE_TEXT}</div>

４．<!--SKIN_CMT_FOOT_START-->～<!--SKIN_CMT_FOOT_END-->の
　　間に以下の強調部分を追加。

<!--SKIN_CMT_FOOT_START-->
</dl>
</div></div>
<!--SKIN_CMT_FOOT_END-->

５．「skin＞footer.html」を開き、「コメント欄にも絵文字をつける」で
　　記入したスクリプトに続けて、以下のものを追加する。

<!-- コメント一覧にも絵文字を表示 -->
<script type="text/javascript">
<!--
// コメントにカスタマイズ絵文字入力機能：画像変換
function changeCustmizeEmojiTag() {
// （１）コメント全体のタグの id 属性
var commentAreaIdName = 'comlist';
// （２）コメント全体のタグ名
var commentAreaTag = 'div';
// （３）各コメントの class 属性
var commentBodyClassName = 'com_text';
// ***************** 設定ここまで *****************
var list = getCommentEmojiList();
var att = getCustmizeEmojiAttribute();
var objComArea;
var classComArea;
var objComBody = new Array();
if (commentAreaIdName != '') {
objComArea = document.getElementById(commentAreaIdName);
if (!objComArea || !objComArea.innerHTML) return;
classComArea = objComArea.getElementsByTagName(commentAreaTag);
} else {
classComArea = document.getElementsByTagName('*');
}
for (var i = 0; i < classComArea.length; i++) {
if (classComArea[i].className == commentBodyClassName) objComBody[objComBody.length] = classComArea[i];
}
for (var i = 0; i < objComBody.length; i++) {
objComBody[i].innerHTML = getStringCustmizeEmojiTag(list, objComBody[i].innerHTML, att);
}
}
function getStringCustmizeEmojiTag(list, s, att) {
for (var i = 0; i < list.length; i++) {
s = s.split('[' + list[i][0] + ']').join('<img src="' + list[i][1] + '"' + att + ' alt="' + list[i][0] + '" />');
}
return s;
}
changeCustmizeEmojiTag();
// -->
</script>
<!-- コメント一覧にも絵文字を表示 ここまで -->

ちなみにここでは暫定的に「comlist」「com_text」などにしてありますが、
同じidで各箇所をそろえれば何でもかまいません。
他とidがかぶりそうな時には別物ものにしてもＯＫです。

ナビゲーション表示位置を変えられるようになった
ver4.33以上対応のWebDiaryPro用・１カラムスキンです。
「CHAI」シリーズのバリエーションの一つですが、
Egg*Station様の素材をお借りしてややゴージャスになっております。

「ナビゲーションを記事の前に表示する」の設定をONにしての使用を
前提としていますので、必ずver4.33以上でご使用下さい。

【 サンプルページ 】
　※「KIRAKIRA」（CHAIのカスタマイズ例と同じです）

【 ダウンロード 】
　・skin_kira.lzh
　・skin_kira.zip