HOME > Blog カスタマイズ > コメント欄パワーアップ作戦 ( 5-2 )

コメント欄パワーアップ作戦 ( 5-2 )

2006年04月29日 AQ

ライブドア無料版をご利用で、サーバーに直接
■ スクリプトファイルをアップロードできない方


コメント欄パワーアップ作戦 ( 5-1 ) の関連記事となります。

■ スクリプト提供ブログ

■ 個別記事の HTML に、スクリプトの記述をおこないます。

管理画面 > カスタマイズ/管理 > デザインの設定 > カスタマイズ > に入ると、各 HTML が並んでいます。その内の個別記事ページの HTML を、メモ帳か何かのテキストエディターにコピーして下さい。

<head> 〜 </head> の間に、以下のタグを記述します。</head> の上ぐらいが良いでしょう。

<script language="JavaScript"><!--

var resColor1 = 'color:green';
var resColor2 = 'color:blue';
var urlTarget = '';

function onloadBlog(e) {
var cmntDiv = document.getElementById("commentbody");
var aryDiv = cmntDiv.getElementsByTagName("div");
var sHTML;

var regURL = new RegExp("(<(B|b)(R|r) ?/?>\r?\n?)(s?https?://[-_.!~*'()a-zA-Z0-9;/?:@&=+$,%#]+)","g");
var regQuot = new RegExp("(<(B|b)(R|r) ?/?>\r?\n?)(&gt;|>)([^&gt;][^<>>]+)","g");
var regDoubleQuot = new RegExp("(<(B|b)(R|r) ?/?>\r?\n?)(&gt;&gt;|>>)([^<>]+)","g");
var regBRClr = new RegExp("^<br />","i");
for(var i = 0; i < aryDiv.length ; i++){
if(aryDiv[i].getAttribute("class") == "commenttext" || aryDiv[i].getAttribute("className") == "commenttext"){
sHTML = aryDiv[i].innerHTML;
sHTML = '<br />' + sHTML;
sHTML = sHTML.replace(regURL,'<a href="$4" target="' +urlTarget+ '">$4</a>');
sHTML = sHTML.replace(regQuot,'<br /><span style="' +resColor1+ '">$4$5</span>');
sHTML = sHTML.replace(regDoubleQuot,'<br /><span style="' +resColor2+ '">$4$5</span>');
sHTML = sHTML.replace(regBRClr,'');
aryDiv[i].innerHTML = sHTML;
}
}

return true;
}


window.onload = onloadBlog;

// --></script>

1行目の var resColor1 = 'color:green'; は、『 > ( 全角 ) 』 もしくは 『 > ( 半角 ) 』 を、コメント欄の先頭行に記入した時に変わる文字の色を指定します。'color:green'; とせずに 'color:#○○○○○○'; と、色コードを指定していただいても結構です。

2行目の var resColor2 = 'color:blue'; は、『 >> ( 半角 ) 』 をコメント欄の先頭行に記入した時に変わる文字の色を指定します。'color:blue'; とせずに 'color:#○○○○○○'; と、色コードを指定していただいても結構です。

3行目の var urlTarget = ''; は、自動リンクのターゲットウインドウを指定します。ブラウザーを別に開けるのであれば、var urlTarget = '_blank'; と記述し、同じページで開ける場合は var urlTarget = '_self'; と、記述します。

■ 次に、良く目をこらして見てみるとこういう部分があります。



</tr>
</form>
</table>

この </table> の真下に以下のタグを記述します。

<script type="text/javascript">
<!--
onloadBlog();
// -->
</script>

これで記述は終わりです。管理画面内の個別記事ページのところに貼り付け直して、保存して下さい。その後、『 全て再構築 』 しますが、その前に何かひとつの記事を選択して再投稿して下さい。何も変えずで結構です。その再投稿した記事のコメント欄で、このカスタマイズが成功しているかどうかを確認して下さい。(・・;)

正しく動作し、エラーや何も不具合がおきていないかを確認した後に、『 全て再構築 』 をかけて下さい。コメント欄において、各段落の先頭行に 『 > ( 全角 ) 』、『 > ( 半角 ) 』、『 >> ( 半角 ) 』 を記入して、その後文字を続けて書くと、改行するまでの間の文字が変化します。

また、http://〜 から始まる URL を記入すると自動的にリンクが貼られ、クリックするとそのページが開きます。(^^)

各ブラウザー、各 OS ( Windows、Mac ) によって表示される具合が違ってきます。ご了承下さい。

■ 関連記事:

この記事へのコメント
1. Posted by 奈々   2006年04月30日 06:00
4 初めまして、新着ブログを彷徨ってま〜す
足跡残しておきますね。
てへへっ
2. Posted by AQ   2006年04月30日 06:10
> 奈々 さん 初めまして (^^)

朝早くからご苦労さまです。
お身体こわさぬようご自愛を〜 [アイタ]
3. Posted by しまうま   2006年05月07日 02:16
何故か、http://blog.pekebatu.com/ だとリンクできたけど、

http://blog.pekebatu.com/archives/50517472.html
ではリンクが出来ませんでした。

TOPページしかリンク表示できないのかなぁ?
4. Posted by AQ   2006年05月07日 15:00
> しまうまさん (^^) 初めまして!

えっ (・・;) そんな設定はしてないんですけどね。[?]
なんででしょうね?

>>3
のコメント欄に書かれた、リンク URL をクリック
したらちゃんとページが開きましたから、アドレス
間違っている事もなさそうですしね ・・・ [アングリ]
5. Posted by しまうま   2006年05月10日 01:54
>>4

あと、同じページで開くより、別ページで開く方が良いかも。
同じページの場合、リンク先に1度進んで、戻るを実行すると
ちょっとバグりました。
6. Posted by AQ   2006年05月10日 02:35
> しまうまさん

あら [?] それはご報告ありがとうございました。
通常は外部リンクの設定にするほうが良いでしょうね。
ただこれは個人の好みによるので、強制はできないですけどね。[ふーん]
7. Posted by くらなむ   2006年05月10日 12:26
あ〜[ビックリ]久しぶりに来てみると
こんないい事が[ラブラブ] 今はまだ、いつやれるのか
時間の余裕が無いのですが、
絶対にやりたいことが またひとつ増えました[ピコン]
また、成功したら報告に来ますね[音符]
8. Posted by AQ   2006年05月10日 16:04
> くらなむさん (^^)

お久しぶりです。
このスクリプトを使用した方法だと、既存の絵文字を使用したまま、文字の強調も、URL リンクを飛ばすことも可能になります。

お時間のあるときに頑張ってカスタムして下さい。[ニコ]
9. Posted by とらねこ   2006年07月04日 13:01
すみません・・・このカスタマイズですが、他のコメント欄パワーアップ作戦を全然やっていないと、全く変わらない・・・と言うことも、あるんでしょうかね?
ちなみに私は、IE6、リニューアル後、一番新しいテンプレートの”ベルベット(カラム3)を使用、無料版です。
urltargetは"_blank";と記入しました。

位置は間違えていません(たぶん)。
ここの部分をコピーし、貼り付けました。
10. Posted by AQ   2006年07月04日 15:37
> とらねこさん

私が確認の為、とらねこさんのブログに書き込みしましたが、
無事に問題なく表示されていますよ。

欲を言えば、この部分↓

[blockquote]<script type="text/javascript">
<!--
onloadBlog();
// -->
</script>[/blockquote]
現在 ・・・

</tr>
</form>
</table>
</div>
-- 今ココに入っている --

なんですが ・・・

</tr>
</form>
</table>
-- ココに入れる --
</div>

ほうが良いかな。問題なく表示されているので、
現在のままでも良いとは思いますが [ニコ]
11. Posted by とらねこ   2006年07月04日 16:10
[big]ひいいっ[/big]
どどど、どうしてお分かりになったんでしょ!?[ギョロ目]
今見たら、本当にそうなっていました。何度も確認したつもりだったんですが・・・。

すみません。私、ここのコメント欄のように[blockquote]引用[/blockquote]や、リンクがつくもんだとばかし・・・
あれあれ。
今私の方に来て下さいましたね!?

わざわざお手間をおかけしてしまい、すみませんでしたぁ[あーあ]
12. Posted by AQ   2006年07月04日 16:40
> とらねこ さん

[blockquote]どどど、どうしてお分かりになったんでしょ!? [ギョロ目][/blockquote]
はは (^^) ブログを直接見れば中身は全部わかりますよ。
良くナレッジで、『 ブログのアドレスを記載して下さい 』 って
回答欄にみんな書いてるでしょ。

そうしたら、どこがおかしいか、一目瞭然だからです。

この、
[blockquote]引用[/blockquote]
などの部分は、設置自体は難しくないんですが、後の CSS などでの調整が難しいんですよ。それぞれのテンプレートによって、調整具合が全然違ってきます [汗汗]

ですから、記事にしにくいんですよ (-_-;)
どう説明したら、わかりやすくなるんだろう? って
考えちゃいます [んー]
13. Posted by はじめ   2006年07月30日 10:13
いつも参考にさせて頂いております。
「その再投稿した記事のコメント欄で、このカスタマイズが成功しているかどうかを確認して下さい。(・・;)

→カスタマイズが成功しているか、いないかは、どこで確認できますか?記事のコメント欄を見ましたが、違いがよくわかりませんでした。。。

「正しく動作し、エラーや何も不具合がおきていないかを確認した後に、『 全て再構築 』 をかけて下さい。」
→エラーや不具合がおきている場合は、どのような状態になりますか?

お時間ありましたら、お願いします。
14. Posted by AQ   2006年07月30日 17:09
> はじめ さん こんにちわ (^^)
>>13
[blockquote]カスタマイズが成功しているか、いないかは、どこで確認できますか?記事のコメント欄を見ましたが、違いがよくわかりませんでした。[/blockquote]
実際にテスト投稿をコメント欄にするんですよ。

> ( 全角 ) こう書いたらどうなるかな?
> ( 半角 ) これはいけるかな?
>> なるほどこうすれば、こうなるのか [ギョロ目]

アドレスを直接書いたらちゃんと飛ぶかな?

http://blog.pekebatu.com/

お〜 いけたいけた ヽ(^。^)ノ
・・・ って独り言、言いながら ww

[blockquote]エラーや不具合がおきている場合は、
どのような状態になりますか?[/blockquote]
これはその時によって変わってきますね。
まったくの無反応だったり、ブログの表示が崩れたり。
はじめさんのカスタマイズした時の、ミスの個所などで
結果が異なってきます。

設置した後ご連絡下さい。確認しに行きますよん [フリフリ]
15. Posted by 【たら】   2007年02月06日 16:28
こんにちは!

はじめまして!【たら】と申します。
ライブドアブログの【個別記事のhtml】にスクリプトを貼り付けたのですがうまくいきませんでした。
パソコン初心者なので、困ってしまいました。

どうか、コメント欄に自動リンクの貼り方を
教えていただけますでしょうか?

宜しくお願い致します。
16. Posted by AQ   2007年02月07日 02:26
> 【たら】 さん 初めまして。
>>15
え〜と、ブログを見に行かさせていただいたのですが、現在スクリプトを設置なさっていないみたいなので、どこがおかしいのかを確認できないですね [汗汗]

『 うまくいかなかった・・・ 』
設置してみて、何がどうなったのでしょうか [?]
その上手くいかなかった症状も併せてお教えいただくと、
なんらかのアドバイスが出来るかも知れません。

一応、記事を読んでそのままのとおりに設置していただくと、成功するようにしてあります。再度チャレンジをしていただき、その上手く稼働していない状況を見させて下さい [にゃ〜ん]
17. Posted by 【たら】   2007年02月10日 14:39
【たら】です。

たびたびすいません。

えっ、スクリプトが設置されていない!?

デザインの設定→カスタマイズ→個別記事ページでここにスクリプトを貼り付けて、内容を保存して、再構築するだけではダメなのでしょうか???

スクリプトの設置方法が分かっていないようです[鼻水]

ご教授願います。

ご迷惑をおかけして申し訳ありません。
18. Posted by AQ   2007年02月11日 04:00
> 【たら】 さん
>>17
迷惑はかかっていませんよ (^^)

もう一度サイトを見させていただいて、
アドバイスさせていただきますね。

もうちょっと、お待ちくださいませ ヽ(^。^)ノ
19. Posted by ぶんママ   2007年06月10日 00:38
AQさん、はじめまして!

コメント欄のパワーアップ、無事に成功しました〜。
色が変わるって素敵です。ありがとうございました。
20. Posted by AQ   2007年06月10日 09:12
> ぶんママさん
>>19
初めまして (^^)

ブログの中でもご紹介して戴いているみたいで、ありがとうございます。丁寧に使い方を説明なさっていて、訪問者の方に優しいですよね [にゃ〜ん]

また新しいカスタマイズが発表できたら良いんですけど ・・・
時間がある時に、なんとか頑張りますね〜 [またね〜]
この記事にコメントする
 :Name
 :Mail
 :URL
  情報を記憶:   書き込みのリセット: 
 
ご利用のブラウザ、設定ではご利用になれません。
 
  



Promotion
Mini BBS
Tag Click