3カラムから2カラムにしたいのですが、
できるだけ具体的に教えてください。
デザインは「Wonderland Happiness」で、3カラムを2カラムにしたいんです。一生懸命過去の質問も読ませていただいたのですが、なかなかわからなくて・・・
できれば具体的にここをこういじれっ
って教えてもらえるとすっごく助かります。
ぜひよろしくお願いします。
m(_ _"m)ペコ
回答(1)
1.

では流れを説明します。
投稿する画面の上の「カスタマイズ/管理 」をクリックします。
次に左の「デザインの設定」をクリックし、
最後に右下の「カスタマイズ」をクリックします。
デザインの設定画面になります。
スタイルシート(CSS) | トップページ | 個別記事ページ | カテゴリアーカイブ | 月別アーカイブ
というメニューがあり、
デフォルトは「スタイルシート(CSS)」になってます。
まずスタイルシートを編集します。
#content、#blogのwidthを179px増やします。
(581pxにします)
#left{}を削除します。
.blogbody、.trackbackurlbody、#trackback、#comment、#takecoment、#formbodyのwidthも179px増やします。
(493pxにします。)
一番下に保存ボタンがあるのでクリックします。
次に、メニューの「トップページ」をクリックします。
<$PluginListA>を<$PluginListB>の直上に移動します。
次に<!--PluginA-->から<!--/ PluginA--><br clear="all">までを削除します。
一番下に保存ボタンがあるのでクリックします。
個別記事ページ、カテゴリアーカイブ及び月別アーカイブもトップページ同様に措置し、保存します。
右上の「ブログに設定を反映(再構築)」をクリックし、
再構築をします。
ここまで終わったら、
ブログを見てください。
おそらく、レイアウトは2カラムで、
本文の背景が小さいままになっている状態です。
この変更には、
4つの背景画像を編集し、アップロードし、
CSSを変更する必要があります。
4つの背景というのは
http://parts.blog.livedoor.jp/img/usr/wonderland01/mainbg.jpg http://parts.blog.livedoor.jp/img/usr/wonderland01/date.jpg http://parts.blog.livedoor.jp/img/usr/wonderland01/line.jpg http://parts.blog.livedoor.jp/img/usr/wonderland01/mainbtm.jpgです。
失敗したら、戻せばいいだけなので、まずやってみたらいかがでしょうか?
(上記はあくまで一つの方法で他にももちろん方法はあります。)
ありがとうございます!
これからもよろしくですぅ。。。
ペコリ(o_ _)o))
コメント(8)
結構、大変な作業だと思うので、
ここで一からすべて回答するのは、難しいと思います。
まず、自分でやってみて、上手くいかないところを
自分のblogを公開しながら、一つ一つ質問した方が、
いいと思います。
Wonderland Happiness って、どこに属するテンプレート?
見ないと回答ができないので教えて下さい。
回答してみて、
やはり、ちょっと説明するのは大変だなぁーと思いました。
一度回答しようとしたら、PCダウンして、2度、上の文章を書きました。
(1度目のが詳しく書いてました(笑))
分かりづらかったら、ごめんなさい。
最初にも書きましたが、いろいろやって、ダメだったら
ココで聞くといいと思いますよ。
(*'▽'*)わぁ♪
ありがとうございます~
やっぱり難しそうですけど、ひとまずチャレンジしてみます。
失敗するようなら、またその箇所をご相談にあがりますね。
本当にありがとうございます。
ペコm(_ _;m)三(m;_ _)mペコ
さっそくやってみました。。。
背景画像の除くと、トップページはうまくいったみたい。
月別、記事ごとのページは、画像がずれたり、プラグインがずれたりしちゃいました。。。
どっか細かいところを修正しないといけないっぽいですね。
http://blog.livedoor.jp/casabulankaren/
ああ・・・ページを晒すのはとっても恥ずかしいのですが・・・
どこがダメなんでしょう??
すみません、出かけていたので、
回答遅れました。
トップページ以外が上手く表示できていないようですが、
<$PluginListA>の位置が間違っているのではないでしょうか。
朝の回答どおりならば、
おそらく
<!-- Plugin B --> <div id="right"> <div id="righttop"></div> <div id="rightbody"> <$PluginListA> <$PluginListB> ・・・・・・という配置になっているはずですが、
現状はおそらく、<!-- Plugin B -->の前に<$PluginListA>があるのではないでしょうか?
これが直接の原因かわかりませんが、とりあえず気が付いたのでご報告します。
(〃ω〃) キャァ♪
たっけーさん、ありがとうございます。
ページ見ただけでそこまでわかっちゃうんですね。
すごい、、尊敬しちゃいます。。
画像は加工ソフトで横に引き伸ばせばいいですよね?
同じように179px引き伸ばすとぴったりになるのかしら。。
で、CSS?かどこかの、対応する画像URLを置き換える?
という感じでいいのでしょうか?
すいません、こんなに親切に教えてもらった挙句に
さらに質問攻めで。。。
179px幅を拡大すればOKなんですが、
ちょっと格好悪いかもしれません。
たぶん、見た目で伸ばした画像だって分かるような気がします。
置き換える画像は、最初に回答してある4つの画像です。
CSSに
background:url(アドレス) no-repeat **** ;という部分があるので、その部分を変更します。




