右に２つあるサイドバーを両側に配置するには？

質問

今MovableType4.0で無料テンプレートを使っています。
MTmonsterのテンプレをつかっているのですが、
http://www.free-movabletype.jp/10templete/mt4-018.html

この画像を見ていただければわかると思いますが、
両サイドにサイドバーが配置されているのではなくて、
右側に２つサイドバーが配置されています。

これを、記事を真ん中に持ってきて、
サイドバーを両サイドに配置したいのですが、
どの部分をいじっていいのかわかりません。

どなたかわかる方いらっしゃいましたらご指導お願い致します。

回答No.5

xenotactic

MTのテンプレートだと小枠空間というサイトが有名です。
簡単なカスタマイズの方法も書かれていると思うので、
もし気になったら参考にしてみてください。
私は好きじゃないですが（え

回答No.4

Muller3

ちょっとヨコから失礼して。
下のシートは移動しないのではなくて、元々右側に2カラムの画像で作ってあるんですよ。monster-imgファイルにあるbg_container.gifやheader_gra.gifを見てみるとわかると思います。
この画像を切り出して自分で構成しなおさない限り両サイドは無理、ということです。

MTデフォルトのテンプレート（ベーススタイルシート）を使ったテンプレートだったら、bodyのclassをほんのちょっと変えるだけでカラム構成を変えることもできるはずなんですが（たぶん）…。

お礼

ありがとうございます。
そうでしたか。。

奥が深いです

まだまだ自分で扱える領域じゃないですね・・・

今の知識だけでは無理なような気が。
簡単に考えてたのが間違ってましたね＞＜

もうちょっと知識つけてからやってみることにします。

アドバイスありがとうございました＾＾

回答No.3

noname#57571

tareteruです （ ^- ^　）
『MT4-004』というテンプレートのソースを見てみましたが、カラムの配置構造はこんな風になっていました（細部は省略しています）。

<div id="content-inner">
<div id="alpha"></div>　（記事）
<div id="beta"></div>　（サードバー）
<div id="gamma"></div>　（サイドバー）
</div>

ですので、単純に考えれば下記のようにボックスタグの順番を入れ替える（もちろん中身ごと）ことで配置を変えることが出来ると思います。

<div id="content-inner">
<div id="beta"></div>　（サードバー）
<div id="alpha"></div>　（記事）
<div id="gamma"></div>　（サイドバー）
</div>

ただし私自身が実際にやって表示具合を確かめたわけではないので、単純にこれだけで済むか、また変更の結果不具合が発生しないかは保証しかねます。おやりになる場合は必ず元データのバックアップを取っておきましょう （ ^^

お礼

どうもありがとうございました。

なかなか難しいですね。
今色々やってみました。

左に持ってくることはできました。
あとはそのベースになってるシートが移動しません。。。

かなり難しいみたいです。

しばらくこのデザインでやってみることにします。

ありがとうございました。

回答No.2

xenotactic

画像見ました。
http://www.free-movabletype.jp/images/MT4-018L.html
これ、ですよね？

なんとも説明しづらいですね。
普通、3カラムで両サイドにメニューを持ってくる場合は
次のような構造にします。

<div id="container">
<div id="left-block">
<div id="main">
ここが中央に表示される記事部分
</div>
<div id="left">
ここが左に表示されるカラム部分
</div>
<br class="none">
</div>
<div id="right">
ここが右に表示されるカラム部分
</div>
</div>

#container {
margin:0 auto;
width:950px;
}

#left-block {
width:700px;
float:left;
}

#main {
width:468px;
float:right;
}

#left {
width:200px;
float:left;
}

.none {
display:none;
clear:both;
}

#right {
width:230px;
float:right;
}

お礼

どうもありがとうございました。

難しそうですが、色々試しながらやってみることにします。

回答No.1

noname#57571

記載のページをIEで見たら、サイドバーは両サイドに配置されてましたが‥ (。_゜ )??

補足

すみません。私の説明が悪かったようですごめんなさい。

このページ自体のことではなくて、
こちらのサイトで提供しているテンプレのことです。

​http://www.free-movabletype.jp/10templete/mt4-018.html​
このページを開くと
真ん中に提供テンプレが載っていて、
他にも　右側に人気ランキングでテンプレが載っています。

画像が小さくてわかりにくいと思いますが、
この提供されているテンプレが、サイドバーが右に２つならんでます。

記事欄が一番左でサイドバーが２列右にあります。

このサイドバーの１つを記事の左側に持ってくる方法が知りたいです。

説明不足ですみません。よろしくお願いいたします。