FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

コメント欄の幅を変える

コメント欄の幅を変える方法を紹介します。
サイト幅を狭くした場合、コメント欄も狭くしなければコメント投稿画面で崩れてしまうことがあります。


HTMLを編集します。

<!--▼コメント投稿▼-->

<textarea id="comment" cols="55" rows="8" name="comment[body]"></textarea><br />

<!--▲コメント投稿▲-->

<!--▼コメント編集▼-->

<textarea id="comment" cols="55" rows="8" name="edit[body]"><%edit_body></textarea><br />

<!--▲コメント編集▲-->



cols="55"の数値をお好みのサイズになるように設定してください。
関連記事
[ 805 ] コメント欄の幅を変える
いたお様
早速のご返事、本当にありがとうございました。
実は、いたお様のテンプレートが気に入って、何種類か挑戦したものの、どうしてもコメント欄が崩れてしまい、幅広(デフォルト)のままでお借りしようと思っていました。
これでスッキリしました。
お気に入りのテンプレートをお借りできて、さらに丁寧なアドバイスまでいただき、本当にありがとうございました。
[ 2006/11/19 08:43 ] [ 編集 ]
[ 823 ] > かずじぃさん
こんばんは、かずじぃさん。
サイト幅を狭くしてもコメント幅はそれに合わせて狭くならないので、製作側は予めコメント欄を小さめで作っておくべきだと気づきました。
こちらこそユーザから学ぶことが多いです。有難う御座います。
[ 2006/11/28 23:24 ] [ 編集 ]
[ 836 ] 突然ですみませんが
コメント欄のサイズ変更がわからなくて検索した結果
こちらにたどり着きました。
とてもわかりやすく解説してくださっていたので、超初心者の私でもすぐに好みのサイズに変更することが出来ました。
本当にありがとうございました!!
[ 2006/12/02 09:47 ] [ 編集 ]
[ 841 ] > mokaさん
こんばんは、mokaさん。
お役に立てて私も嬉しいです。ちょっと最近なかなか更新できていないのですが、これからも役立つ記事を書けるように頑張ります。
[ 2006/12/03 21:41 ] [ 編集 ]
[ 1551 ] トラックバック
初めまして。sunnyを使わせて頂いております。
大変気に入っております。

サイトの幅を変更したいと考えてるいるのですが、
どうもうまくいきません。

コメント覧も合わせて幅を変える事は
わかったのですが、トラックバックはどうでしょうか?
トラックバックのURLが表示されるページではどうしても
他のページの幅と異なってしまいます。

お時間がある時に教えて頂けましたら幸いでございます。

[ 2007/03/27 18:48 ] [ 編集 ]
[ 1559 ] > ガイドさん
ガイドさんが使用されているテンプレート「sunny」の作者は私ではくまるぼろらいとさんですよ^^;
[ 2007/03/28 01:38 ] [ 編集 ]
[ 1592 ] すみませんでした。
FC2ブログのテンプレート工房 いたお 様

大変失礼しました。(^^;)
[ 2007/03/29 15:58 ] [ 編集 ]
[ 1620 ] > ガイドさん
いえいえお気になさらずに^^
テンプレート職人さんは沢山いますから。
[ 2007/04/03 01:11 ] [ 編集 ]
[ 2836 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2007/10/05 22:24 ] [ 編集 ]
[ 6158 ] 解決しました^^
初めまして。テンプレート工房様

幅を変更したらコメントの幅が広いままで
しばらく悩んでたんですが解決することが出来ました
説明も分かりやすくとても使いやすかったです
またお世話になりますね^^
[ 2009/09/22 14:21 ] [ 編集 ]
[ 6164 ] > kazuoさん
お役に立てて良かったです^^
ちなみにこのような方法もあります。

コメント入力欄の幅設定
http://10plate.blog44.fc2.com/blog-entry-289.html
[ 2009/09/22 20:16 ] [ 編集 ]
[ 8473 ] お世話になります
お聞きしたいのですが、コメント欄のタイトルバーを消す事は可能でしょうか?1つ1つのコメントにタイトルバーを表示するのではなく、一つの枠の中でコメントを表示させたいのです。

説明が下手ですみません…。
[ 2010/02/19 17:49 ] [ 編集 ]
[ 8475 ] ネドさん
lightframe_whiteで試して見ました。こんな感じでいいのでしょうか?基本構造は変えずにやってみました。

http://blog-imgs-30.fc2.com/y/a/s/yassee/20100219.jpg

テンプレートの<!--▼コメント表示▼-->の下の部分

<!--comment-->
<div class="comment_outline">
 ~略~
</div><!--/comment_outline-->
<!--/comment-->

この<div>タグを外に出します。

<div class="comment_outline">

<!--comment-->
 ~略~
<!--/comment-->
</div><!--/comment_outline-->

スタイルシートは以下部分
/********************************************* ▼ コメント ▼ */
.comment_outline {
border:#000000 2px solid; /* 外枠の/色太さ/実線 */
background-color:#FFFFFF; /* 背景色 */
text-align:left; /* 左寄せ */
margin-bottom:20px; /* 次のコメントまでの間隔 */
}
.comment_title {
font-size:10pt; /* 文字サイズ(タイトル) */
color:#555555; /* 文字色 (タイトル) */
font-weight:bold; /* 太字 (タイトル) */
background-color:#ffffff; /* 背景色 (タイトル) */
text-align:left; /* 左寄せ (タイトル) */
border:#666666 0px solid; /* 枠 (タイトル) */
padding:5px 20px;
}
.comment_body {
font-size:10pt; /* 文字サイズ(コメント本文) */
color:#000000; /* 文字色 (コメント本文) */
border-top: #e0e0e0 0px solid; /* 枠(上) (コメント本文) */
border-left: #666666 0px solid; /* 枠(上) (コメント本文) */
border-right: #666666 0px solid; /* 枠(上) (コメント本文) */
border-bottom:#666666 0px solid; /* 枠(上) (コメント本文) */
}

色と枠を表示しないようにしただけです。
[ 2010/02/19 18:56 ] [ 編集 ]
[ 8476 ] [ 8473 ] ネドさんへ
<!--▼コメント表示▼-->
<!--▲コメント表示▲-->の間にある
<div class="comment_title"><a name="comment<%comment_no>" id="comment<%comment_no>"><%comment_title></a></div>
を削除すればいいと思いますが。

<!--▼コメント表示▼-->から
<!--▲コメント編集▲-->迄の間のコメント関係を<div></div>でくくって適当なクラス名でcss書けば大丈夫だと思います。
[ 2010/02/19 19:05 ] [ 編集 ]
[ 8477 ] sakuraiさん
ご指摘の<div class="comment_title">~</div>まで全部削ってしまうとコメントタイトルが表示されなくなってしまいます。しかもa nameも削るとダイレクトにコメントにジャンプできなくなってしまいます。

また<div>~</div>でくくっても現在表示されている枠部分のスタイルシートに手を加えないと枠は表示されたままです。

私は枠を消したいという質問の意図だと理解してフォローしましたが・・、違うのかな?。

[ 2010/02/19 19:38 ] [ 編集 ]
[ 8479 ] そうですね。
すいませんでした。ここのテンプレートで考えないとダメでした。

「タイトルバーを表示するのではなく」を
「タイトルバーを表示しないで」と読み違えました。
しかし、それ以前の「タイトルバーを消す」が引っかかる…
[ 2010/02/19 20:25 ] [ 編集 ]
[ 8480 ] ありがとうございます
やっすぃぃぃーさんSakuraiさん、ありがとうございます。
お二人の書いていただいたタグを参考に自分なりに編集してみるとうまく出来ました!ありがとうございました!
[ 2010/02/19 21:56 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

ブログ内検索1
プロフィール

いたお

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
09 | 2023/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

09 | 2023/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
ユーザータグ


△ ページトップへ戻る