※「Web Diary Proのコメント欄に絵文字をつける」のフォロー記事。
コメント欄絵文字を実装後にお試しください。
Web Diary Proの環境設定で、
「ログの表示設定」→「記事一覧にコメントの内容を表示」を
「表示する」に設定していると、
コメント欄につけた絵文字が[♪]のようになり表示されない、
ということがありましたので、解決策を。
1.「skin>diary.html」を開く
2.<!--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-->
3.<!--SKIN_CMT_START-->~<!--SKIN_CMT_END-->の
間にある ${ARTICLE_TEXT} を以下のように<div>で囲む
<div class="com_text">${ARTICLE_TEXT}</div>
4.<!--SKIN_CMT_FOOT_START-->~<!--SKIN_CMT_FOOT_END-->の
間に以下の強調部分を追加。
<!--SKIN_CMT_FOOT_START-->
</dl>
</div></div>
<!--SKIN_CMT_FOOT_END-->
5.「skin>footer.html」を開き、「コメント欄にも絵文字をつける」で
記入したスクリプトに続けて、以下のものを追加する。
<!-- コメント一覧にも絵文字を表示 -->
<script type="text/javascript">
<!--
// コメントにカスタマイズ絵文字入力機能:画像変換
function changeCustmizeEmojiTag() {
// (1)コメント全体のタグの id 属性
var commentAreaIdName = 'comlist';
// (2)コメント全体のタグ名
var commentAreaTag = 'div';
// (3)各コメントの 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がかぶりそうな時には別物ものにしてもOKです。
非公開 (12/09)
非公開 (11/30)
非公開 (11/30)
非公開 (09/24)
非公開 (05/24)