解決済
個別ページへ行くとデザインが崩れる。コメントの文字がブログの内容の文字より大きい。
初めまして。よろしくお願いします。
ＴＯＰページでブログ読んでいたり、カテゴリーからクリックしてブログを読んでいる分には思っている通りのデザインで表示されているのですが、コメントボタンを押したり、続きをクリックしたりすると、カテゴリー名前もしくはタイトルが長すぎるのか、ＴＯＰで表示される感じとデザインが変わってしまいます。
また、コメントの文字もブログの本文より大きくて困っています。
ピクセルをいじれば、ＴＯＰと同じように表示される、コメントの文字もサイズ指定したらいいのかもしれない、とは思っているのですが、どこをどういじったらいいのか分かりません。
もしお分かりになる方がいたら、ぜひ教えて頂きたいです。
よろしくお願いします。
デザインはcustomで がページです。
回答(1)
2.
私が認識したのと、おっしゃっているのとが同じ変化を指しているのかは分かりませんが、とりあえず個別記事ページではサイドバーが１本だけで２カラムになって、醜くなっていますね。デザインを統一したいというならば、ここも３カラムにした方がいいでしょうね。デザインのカスタマイズをしましょう。
一見したところ、あなたの「個別記事ページ」でだけカレンダーの出力が違っているとか意図がよく分からないところがあるのですがｗ、何かいじりましたか？とりあえず、以下では「トップページなどのデザインで何も不満がなく、それに統一したい」という前提に立った修正案を提示しておきます。長いのでそちらはコメントにて。
>>記事のサイズ
cssを見ると、本文その他が「14px」などと数字指定されているにも関わらず、コメント・トラバの本文などだけ「small」などと相対指定されていますね。ここも数字にすればより意図に則した表示ができるのではないでしょうか。
デザインのカスタマイズから、cssをいじりましょう。cssの真ん中辺りに
#trackbackbody,#commentbody{padding:15px 0;}
.trackbackttl,.commentttl{font-size:x-small;padding:0px 5px 0px 0px;}
.trackbacktext,.commenttext{font-size:small;line-height:130%;padding:10px 0px 20px 0px;}
.loginon,.loginoff{
font-size:12px;
などとなっている部分があるでしょうので探して下さい。「.trackbackttl,.commentttl」がコメント等のタイトル（投稿者とか投稿時間とか）を、「.trackbacktext,.commenttext」がコメント本文を指定しています。で、この中に「font-size:x-small;」などとなっている場所がありますが、「x-small」のところにサイズを入れればＯＫです。
参考までに、本文は12pxですね。これより小さくしたければ11pxを指定するといいでしょう。
本当に何から何までお手数かけて本当に申し訳ありません。
コメントでも書かせて頂きましたが、本当に親切かつ回答に直結するお答えを頂き、すぐに理解することが出来ました。
本当にありがとうございました。
コメント(12)
まず、デザインのカスタマイズから、個別記事ページ以外のどれかのページと、「個別記事ページ」とを開いてみて下さい。
前者でのサイドバー表示部分は、まず始点が「<!-- Plugin A -->」です。
<!-- Loop End -->
</div>
</div>
<!-- Plugin A -->
<div id="left">
<div id="lefttop"></div>
とかなっている個所を探して下さい。
で、終点が「<!-- / Plugin B-->」です。一番下の方に、
<div id="rightbottom"></div>
</div>
<!-- / Plugin B-->
<br clear="all">
</div><!-- End of blogcontainer-->
となっている個所があると思うので探してみましょう。両方見つかったら、<!-- Plugin A -->から<br clear="all">までを選択して、コピーしてください。
後者ですが、開始部分は<div id="links">です。こんな感じの
<div id="contentcommentbottom"></div>
<div id="links">
<div id="linkstop"></div>
<div id="linksbody">
かたまりがあるでしょうので探して下さい。
で、終点が、<!-- End of blogcontainer-->のすぐ上の<br clear="all">辺りです（正確にはその上の</div>）。こんな感じになっているでしょう。
<div id="linksbottom"></div>
</div>
<br clear="all">
</div><!-- End of blogcontainer-->
見つかったら、<div id="links">から<br clear="all">までを選択して、先ほどコピーしたのをペーストして下さい。
これでとりあえず、個別記事ページの表示がトップページとかに統一されるようになります。とは言え、個別記事ページだけ書式が違うのは何か訳があるのでしょうから、狙いを別途おっしゃていただければより適切な方法が提示されるでしょう。
ご理解しにくい書き方をして本当にもうしわけありません。
教えていただいた回答通りに訂正したところ、思ったように変更出来ました。
ccsは多少かじっていたので自分の範囲内で訂正出来るかな？なんて思っていたんですが、量が多い上にこの単語は何を表しているんだ！？と疑問も多くて、本当に本当にお力をお借りさせて頂きました。
本当にありがとうございます。
私としてはデザインの見栄えを良くしたいだけなので、個別記事でも2カラムではなく、3カラムにした方がいいかもしれないですね。
再度ご質問なのですが、3カラムにするにはどうしたらいいのでしょうか？？
正直、どこをどういじったらいいのか、すら分かってない感じなんです・・・。
あと！
カレンダーの出力ですが、その辺はいじった覚えがないのですが、どう間違っているか教えて頂けたらなぁ・・・と思っています。
何度もしつこく本当に申し訳ありません。
おっと、コピーしたところがプラグインＡ（左サイドバー）だけになっていらさるようですねｗ
プラグインＡを閉じたところはこんな感じになっていますが、
<!-- / Plugin A-->
<br clear="all">
</div><!-- End of wrapper-->
<br clear="all">
この<!-- End of wrapper-->と、<br clear="all">の間に以下をコピペして下さい。
<!-- Plugin B -->
<div id="right">
<div id="righttop"></div>
<div id="rightbody">
<$PluginList_B$>
</div>
<div id="rightbottom"></div>
</div>
<!-- / Plugin B-->
これでプラグインＢ（右サイド）が表示されるようになります。
まあ、本当は<$PluginList_B$>の下にもっとゴテゴテ（トップページとかで、右サイドバーの「プレスブログ」のすぐ下にある、チェッカーズとかＲＳＳのバナー群）つくんですが……
個別ページにも表示させたかったら、別途トップページのテンプレとかからコピペして下さい。要は、上に挙げたのの代わりに<!-- Plugin B -->から<!-- / Plugin B-->までをコピーすればいいのです。
大事になっていますが、大丈夫ですか？
故意にそうしたのでない限り、3カラムのデザインで個別記事のみが2カラムになることはないので、再構築が不完全（前のデザインが残っているなど）なのだと思いますが。
基本的に、ユーザ側でhtmlのカスタムまでを強いるデザインは無いと思うのですが。。
何ページかソースを読んでみればお分かりになるかと思いますが、（コメント>>1-2を実行なさったようなので、それを元に考えると）プラグインＢの部分がコピーされてなかったというので正しいでしょう。コピーの最終点を、プラグインＡ終末の<br clear="all">と勘違いなさったのではないかと思います。
質問にありますが、元々カスタマイズなさっているようなので（だからとにかく再構築、などは奨めませんでした。意図通りの表示が為されなかった場合何度も再構築を試みている可能性は高いでしょうしね）、当初の問題はその時に何か誤って削ってしまったことから起こったのではないかと思います。質問の時点ではプラグインＢがＡの直下に来ていましたが、意図的でないならば<div id="right">辺りを誤って削ったとか。
カレンダーが云々と言いましたが、特にいじってないならばお気にめさらず。原状になるような変更をすれば問題は一緒に消えるはず。
そういうことだったのですか！
私はてっきり、3カラムのこのデザインで
<div id="links">
がある時点で、カスタムではなく
再構築が不完全（全てのページを選ばなかった）ために
前に選んでいたデザイン（恐らく2カラム）が
個別記事のみに残ってしまったのではないかと解釈してしまいました。
メタタグやアクセス解析などの、
テンプレートを変えるとリセットされる要素も無さそうだし
この際リセットしてしまったほうが早いかな…とも
いずれにしてもうまく解決することを願いつつ、
横から失礼いたしました。
しつこい質問にお答え頂き、ほんとうにありがとうございます。
まず、カレンダーの件ですが、私にいじった覚えはないので気にしないことにしておきます＞＜
あと、個別記事での2カラムに関してですが、あれはわざとです＾＾；
実は言われた通り、コピーして再構築したのですが、コメントにもあったようにAの下にBか来たので、みっともないと思い、削除したので2カラムになってるいるんです。
<div id="right">を削除してしまったのかもしれないので、もう1度CCSを見てみます。
>>みっともないと思い、削除した
あれｗ
なんでだろ……と思ったら。
分かりました。id="wrapper"がないせいですね。このデザインは左から、
id:wrapper [ id:left[左サイドバー] ／ id:content[本文部] ]
id:right [右サイドバー]
という構造になってるんですが、現在の記述だとこの「wrapper」がありません。で、id:right の float が left に指定されてるので、wrapper（これは left 指定）がないとcontent（これはright指定だが、wrapperの中でのright、ということだった）とかより左に来てしまうわけです。
解決方法としては、ブログタイトルのちょっと下に
<div id="blogcontainer">
<div id="content">
という部分がありますが、この二つの間に
<div id="wrapper">
を追記、で、プラグインＡの終着とＢの開始部の間に
<!-- / Plugin A-->
<br clear="all">
</div><!-- End of wrapper-->
<!-- Plugin B -->
<div id="right">
となるように、</div>を入れます。この</div>の方は、最初にコピーして下さいと申し上げたところに入っているはずですが、肝心の対応する<div id="wrapper">がなかったので表示が狂ったのですね。
これで直るはずだけど、ここまで来ると、一から確認するということで原テンプレから作り直した方が後々のためかもしれませんねｗ
おっしゃる通りでした。
私が確認する前に丁寧かつ分かりやすい説明と共に解決に直結する回答本当にありがとうございます＞＜
無事に解決しました。
本当に感謝の気持ちで一杯です。
まだまだ勉強不足、かつライブドア内での定義なども理解に欠けていたこともあり、本当に恥ずかしい気持ちでいっぱいです。
本当にご迷惑おかけしました。
そして、本当にありがとうございます。
